/* 템플릿 카드: 썸네일과 hover 배경만 둥글게 하고 NEW 리본은 자르지 않는다. */
.cl-dashboard-redesign.template-list .imgbox {
  border-radius: var(--cl-radius-md, 10px);
}

.cl-dashboard-redesign.template-list .imgbox > .img-responsive,
.cl-dashboard-redesign.template-list .imgbox > .overbox {
  border-radius: inherit;
}

/* 템플릿 확인창: 공개 페이지의 헤더·미리보기와 분리된 리디자인 범위. */
.cl-dashboard-redesign.cl-source-template-dialog-wrap {
  position: fixed;
  inset: 0;
  z-index: 999999;
  font-family: var(--cl-source-font);
  color: var(--cl-text);
}

.cl-dashboard-redesign.cl-source-template-dialog-wrap > .modal {
  position: fixed;
  inset: 0;
  overflow-y: auto;
  padding: 24px;
  background: rgba(0, 0, 0, .45);
}

.cl-dashboard-redesign.cl-source-template-dialog-wrap > .modal.in {
  /* Bootstrap이 설정하는 인라인 display:block을 모달 내부에서만 교체한다. */
  display: flex !important;
}

.cl-dashboard-redesign.cl-source-template-dialog-wrap .modal-dialog.cl-source-template-dialog {
  flex: none;
  width: 560px;
  max-width: 100%;
  margin: auto;
  padding: 0;
  transform: none;
}

.cl-dashboard-redesign.cl-source-template-dialog-wrap .cl-source-template-dialog > .modal-content {
  position: relative;
  width: 100%;
  padding: 32px;
  border: 0;
  border-radius: var(--r-xl, 14px);
  background: var(--surface, #fff);
  box-shadow: var(--shadow-modal, 0 20px 50px rgba(20, 24, 32, .25));
}

.cl-dashboard-redesign.cl-source-template-dialog-wrap .cl-source-template-dialog .modal-body {
  padding: 0;
  color: var(--cl-text-sub);
  font-size: 14px;
  line-height: 1.6;
  text-align: center;
  overflow-wrap: anywhere;
}

.cl-dashboard-redesign.cl-source-template-dialog-wrap .cl-source-template-dialog .modal-body .modal-title {
  margin: 0 28px 24px;
  color: var(--cl-text);
  font-size: 20px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0;
}

.cl-dashboard-redesign.cl-source-template-dialog-wrap .cl-source-template-dialog .modal-body p {
  margin: 0;
}

.cl-dashboard-redesign.cl-source-template-dialog-wrap .cl-source-template-dialog .br-text {
  display: block;
  margin-top: 12px;
}

.cl-dashboard-redesign.cl-source-template-dialog-wrap .cl-source-template-dialog .modal-footer {
  display: flex;
  flex-direction: column;
  gap: 14px;
  margin: 24px 0 0;
  padding: 0;
  border: 0;
}

.cl-dashboard-redesign.cl-source-template-dialog-wrap .cl-source-template-dialog .modal-footer::before,
.cl-dashboard-redesign.cl-source-template-dialog-wrap .cl-source-template-dialog .modal-footer::after {
  display: none;
}

.cl-dashboard-redesign.cl-source-template-dialog-wrap .cl-source-template-dialog .modal-footer > .btn {
  width: 100%;
  height: 46px;
  margin: 0;
  padding: 0 16px;
  border: 1px solid transparent;
  border-radius: var(--r-md, 8px);
  background: transparent;
  color: var(--cl-text-sub);
  font-size: 14px;
  font-weight: 600;
  box-shadow: none;
}

.cl-dashboard-redesign.cl-source-template-dialog-wrap .cl-source-template-dialog .modal-footer > .btn-primary {
  background: var(--cl-green);
  color: #fff;
}

.cl-dashboard-redesign.cl-source-template-dialog-wrap .cl-source-template-dialog .modal-footer > .btn.btn-default.close-button-dialog {
  /* common.css의 .flat-modal .btn.btn-default !important 규칙 대응. */
  background-color: transparent !important;
  color: var(--cl-text-sub);
}

.cl-dashboard-redesign.cl-source-template-dialog-wrap .cl-source-template-dialog .modal-footer > .btn-primary:hover,
.cl-dashboard-redesign.cl-source-template-dialog-wrap .cl-source-template-dialog .modal-footer > .btn-primary:focus {
  background: var(--cl-green-hover);
}

.cl-dashboard-redesign.cl-source-template-dialog-wrap .cl-source-template-dialog .modal-footer > .btn.btn-default.close-button-dialog:hover,
.cl-dashboard-redesign.cl-source-template-dialog-wrap .cl-source-template-dialog .modal-footer > .btn.btn-default.close-button-dialog:focus {
  background-color: var(--green-soft, #f1fbf5) !important;
  color: var(--cl-green-text);
}

.cl-dashboard-redesign.cl-source-template-dialog-wrap .cl-source-template-dialog .modal-content > .close {
  position: absolute;
  top: 20px;
  right: 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  padding: 0;
  border: 0;
  border-radius: var(--r-md, 8px);
  background: transparent;
  color: var(--cl-text-muted);
  opacity: 1;
  text-shadow: none;
  transition: transform .18s, background-color .12s, color .12s;
}

.cl-dashboard-redesign.cl-source-template-dialog-wrap .cl-source-template-dialog .close svg {
  display: block;
  width: 15px;
  height: 15px;
  fill: currentColor;
}

.cl-dashboard-redesign.cl-source-template-dialog-wrap .cl-source-template-dialog .modal-content > .close:hover,
.cl-dashboard-redesign.cl-source-template-dialog-wrap .cl-source-template-dialog .modal-content > .close:focus {
  background: var(--bg-3, #f1f2f5);
  color: var(--cl-text);
  transform: rotate(90deg);
}

.cl-dashboard-redesign.cl-source-template-dialog-wrap .cl-source-template-dialog button:focus-visible {
  outline: 2px solid var(--cl-green);
  outline-offset: 2px;
}

.cl-dashboard-redesign.cl-source-template-dialog-wrap + .modal-backdrop {
  opacity: 0;
}

@media (max-width: 480px) {
  .cl-dashboard-redesign.cl-source-template-dialog-wrap > .modal { padding: 16px; }
  .cl-dashboard-redesign.cl-source-template-dialog-wrap .cl-source-template-dialog > .modal-content { padding: 28px 20px 20px; }
}

@media (prefers-reduced-motion: reduce) {
  .cl-dashboard-redesign.cl-source-template-dialog-wrap .cl-source-template-dialog .modal-content > .close { transition: none; }
}

/* Source dashboard: inflow analytics page */
body.cl-dashboard-redesign-page .cl-source-analytics-page {
  box-sizing: border-box !important;
  width: auto !important;
  max-width: none !important;
  margin-top: 0 !important;
  margin-right: var(--cl-source-app-gutter) !important;
  margin-left: calc(var(--cl-source-app-gutter) + var(--cl-source-sidebar-w)) !important;
  padding: 28px 32px 60px !important;
  background: transparent !important;
  color: var(--cl-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .cl-source-analytics-head {
  display: block !important;
  width: 950px !important;
  max-width: 100% !important;
  margin: 0 0 24px !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .cl-source-analytics-breadcrumb {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 0 20px !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .cl-source-analytics-breadcrumb a,
body.cl-dashboard-redesign-page .cl-source-analytics-page .cl-source-analytics-breadcrumb strong {
  color: inherit !important;
  font: inherit !important;
  text-decoration: none !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .cl-source-analytics-breadcrumb a {
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .cl-source-analytics-breadcrumb a:hover,
body.cl-dashboard-redesign-page .cl-source-analytics-page .cl-source-analytics-breadcrumb a:focus {
  color: var(--cl-green-text) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .cl-source-analytics-breadcrumb span {
  color: var(--cl-text-muted) !important;
  font-size: 23px !important;
  font-weight: 400 !important;
  line-height: 1 !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .cl-source-analytics-breadcrumb strong {
  color: var(--cl-text-sub) !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .cl-source-analytics-head .main-title {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: -1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 0 !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .cl-source-analytics-head > p {
  margin: -10px 0 0 !important;
  padding: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 1.55 !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .cl-source-analytics-panel {
  box-sizing: border-box !important;
  width: 950px !important;
  max-width: 100% !important;
  margin: 0 0 24px !important;
  padding: 22px 24px !important;
  overflow: hidden !important;
  background: var(--cl-surface) !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: var(--cl-radius-lg) !important;
  box-shadow: var(--cl-shadow-panel) !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .cl-source-analytics-panel:last-of-type {
  margin-bottom: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .cts_content,
body.cl-dashboard-redesign-page .cl-source-analytics-page .host-counts,
body.cl-dashboard-redesign-page .cl-source-analytics-page .sites-log {
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .analytics-data-title {
  display: flex !important;
  align-items: baseline !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin: 0 0 14px !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .analytics-data-title .log-note {
  flex: none !important;
  margin: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 12.5px !important;
  font-weight: 400 !important;
  line-height: 1.4 !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .cl-source-analytics-table-wrap {
  width: 100% !important;
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .analytics-data-table {
  width: 100% !important;
  margin: 0 !important;
  border-collapse: collapse !important;
  background: #fff !important;
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  table-layout: fixed !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .cl-source-analytics-rank-panel .analytics-data-table {
  min-width: 560px !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .cl-source-analytics-log-panel .analytics-data-table {
  min-width: 760px !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .analytics-data-table .title {
  margin: 0 !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .analytics-data-table .title > th {
  padding: 12px 16px !important;
  background: #fafbfc !important;
  border: 0 !important;
  border-top: 1px solid var(--cl-border) !important;
  border-bottom: 1px solid var(--cl-border) !important;
  color: var(--cl-text-sub) !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .analytics-data-table .rows > td {
  padding: 15px 16px !important;
  background: #fff !important;
  border: 0 !important;
  border-bottom: 1px solid var(--cl-border) !important;
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 1.45 !important;
  vertical-align: middle !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .analytics-data-table .rows:first-of-type > td,
body.cl-dashboard-redesign-page .cl-source-analytics-page .analytics-data-table .rows.first > td {
  padding-top: 15px !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .analytics-data-table .rows:last-child > td {
  border-bottom: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .analytics-data-table .rows:hover > td {
  background: #fafbfc !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .analytics-data-table.see-all-off .rows.hide-host {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .analytics-data-table .no {
  width: 96px !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .analytics-data-table .datetime,
body.cl-dashboard-redesign-page .cl-source-analytics-page .analytics-data-table .in-site-date {
  width: 190px !important;
  text-align: left !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .analytics-data-table .in-site-name {
  min-width: 0 !important;
  width: auto !important;
  padding-right: 16px !important;
  padding-left: 16px !important;
  overflow: hidden !important;
  text-align: left !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .analytics-data-table .in-site-count {
  width: 120px !important;
  color: var(--cl-green-text) !important;
  font-weight: 700 !important;
  text-align: right !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .analytics-data-table .in-site-ip {
  width: 170px !important;
  color: var(--cl-text-sub) !important;
  font-variant-numeric: tabular-nums;
  text-align: right !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .analytics-data-table .top-hosts,
body.cl-dashboard-redesign-page .cl-source-analytics-page .analytics-data-table .top-hosts span {
  color: var(--cl-green-text) !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .analytics-data-table a {
  display: inline-block !important;
  max-width: 100% !important;
  overflow: hidden !important;
  color: var(--cl-green-text) !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  text-overflow: ellipsis !important;
  vertical-align: top !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .analytics-data-table a:hover,
body.cl-dashboard-redesign-page .cl-source-analytics-page .analytics-data-table a:focus {
  color: var(--cl-green-text) !important;
  text-decoration: underline !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .analytics-data-table .in-site-name span {
  color: var(--cl-text) !important;
  font-weight: 600 !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .analytics-data-table .cm-popover-info {
  display: inline-block !important;
  width: 13px !important;
  height: 13px !important;
  margin-left: 4px !important;
  color: var(--cl-green) !important;
  fill: currentColor !important;
  vertical-align: -2px !important;
  cursor: default !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .see-more-hosts {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 86px !important;
  height: 32px !important;
  margin: 14px 0 0 !important;
  padding: 0 13px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 6px !important;
  color: var(--cl-text-sub) !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  transition: background .12s, border-color .12s, color .12s !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .see-more-hosts:hover,
body.cl-dashboard-redesign-page .cl-source-analytics-page .see-more-hosts:focus {
  background: #fafbfc !important;
  border-color: #d5d9e0 !important;
  color: var(--cl-text) !important;
  outline: 0 !important;
  text-decoration: none !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .see-more-hosts.hide {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page p.none {
  position: static;
  margin: 0 !important;
  padding: 34px 0 18px !important;
  color: var(--cl-text-muted) !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .log-data-notice {
  display: flex !important;
  gap: 6px !important;
  margin: 16px 0 0 !important;
  padding: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 12.5px !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .log-data-notice span:first-child {
  flex: none !important;
  color: var(--cl-text-muted) !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .sites-log .paging {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  width: 100% !important;
  margin: 22px 0 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  line-height: 1 !important;
  list-style: none !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .sites-log .paging:empty {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .sites-log .paging li {
  display: inline-flex !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .sites-log .paging li > a,
body.cl-dashboard-redesign-page .cl-source-analytics-page .sites-log .paging li > span,
body.cl-dashboard-redesign-page .cl-source-analytics-page .sites-log .paging li > strong {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  width: auto !important;
  min-width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 8px !important;
  background: transparent !important;
  border: 1px solid transparent !important;
  border-radius: 6px !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  transition: background .12s, border-color .12s, color .12s !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .sites-log .paging li > a[aria-label] {
  width: 30px !important;
  min-width: 30px !important;
  padding-right: 0 !important;
  padding-left: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .sites-log .paging li > a[aria-label] > span {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .sites-log .paging li > a:hover,
body.cl-dashboard-redesign-page .cl-source-analytics-page .sites-log .paging li > a:focus {
  background: var(--cl-green-tint) !important;
  color: var(--cl-green-text) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .sites-log .paging li.active > a,
body.cl-dashboard-redesign-page .cl-source-analytics-page .sites-log .paging li.active > span,
body.cl-dashboard-redesign-page .cl-source-analytics-page .sites-log .paging li.active > strong {
  background: var(--cl-green-soft) !important;
  border-color: var(--cl-green) !important;
  color: var(--cl-green-text) !important;
  font-weight: 800 !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .sites-log .paging .fa {
  color: currentColor !important;
  font-size: 14px !important;
  line-height: 1 !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .log-bottom-space {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page ~ .mobile-detail-popup {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-analytics-page .popover,
body.cl-dashboard-redesign-page:has(.cl-source-analytics-page) .popover {
  z-index: 1400 !important;
}

@media (max-width: 767px) {
  body.cl-dashboard-redesign-page .cl-source-analytics-page {
    width: 100% !important;
    max-width: none !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
    padding: 24px 16px 64px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-analytics-page .cl-source-analytics-head {
    display: block !important;
  }

  body.cl-dashboard-redesign-page .cl-source-analytics-page .cl-source-analytics-breadcrumb {
    margin-bottom: 18px !important;
    font-size: 18px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-analytics-page .cl-source-analytics-panel {
    margin-bottom: 16px !important;
    padding: 18px 16px !important;
    border-radius: 12px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-analytics-page .analytics-data-title {
    align-items: flex-start !important;
    flex-direction: column !important;
    gap: 4px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-analytics-page .analytics-data-title .log-note {
    white-space: normal !important;
  }

  body.cl-dashboard-redesign-page .cl-source-analytics-page .sites-log .paging {
    flex-wrap: nowrap !important;
  }

  body.cl-dashboard-redesign-page .cl-source-analytics-page .sites-log .paging li {
    flex: none !important;
  }

  body.cl-dashboard-redesign-page .cl-source-analytics-page .sites-log .paging li:has(> a[aria-label="First"]),
  body.cl-dashboard-redesign-page .cl-source-analytics-page .sites-log .paging li:has(> a[aria-label="Last"]) {
    display: none !important;
  }

  body.cl-dashboard-redesign-page .cl-source-analytics-page .sites-log .paging li > a,
  body.cl-dashboard-redesign-page .cl-source-analytics-page .sites-log .paging li > span,
  body.cl-dashboard-redesign-page .cl-source-analytics-page .sites-log .paging li > strong {
    width: 30px !important;
    min-width: 30px !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
    font-variant-numeric: tabular-nums;
    text-align: center !important;
  }
}

/* Source dashboard: forms page */
body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) {
  box-sizing: border-box !important;
  width: auto !important;
  max-width: none !important;
  min-height: 0 !important;
  margin-top: 0 !important;
  margin-right: var(--cl-source-app-gutter) !important;
  margin-left: calc(var(--cl-source-app-gutter) + var(--cl-source-sidebar-w)) !important;
  padding: 28px 32px 60px !important;
  background: transparent !important;
  color: var(--cl-text) !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult),
body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) * {
  box-sizing: border-box !important;
  font-family: var(--cl-source-font) !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .cl-source-forms-box {
  float: none !important;
  width: 950px !important;
  max-width: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .cl-source-forms-head {
  display: block !important;
  width: 950px !important;
  max-width: 100% !important;
  margin: 0 0 24px !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .cl-source-forms-breadcrumb {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 0 20px !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .cl-source-forms-breadcrumb a,
body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .cl-source-forms-breadcrumb strong {
  color: inherit !important;
  font: inherit !important;
  text-decoration: none !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .cl-source-forms-breadcrumb a:hover,
body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .cl-source-forms-breadcrumb a:focus {
  color: var(--cl-green-text) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .cl-source-forms-breadcrumb span {
  color: var(--cl-text-muted) !important;
  font-size: 23px !important;
  font-weight: 400 !important;
  line-height: 1 !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .cl-source-forms-breadcrumb strong {
  color: var(--cl-text-sub) !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .cl-source-forms-head .title-wrap {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: -1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 0 !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .cl-source-forms-head .title-sub {
  margin: -10px 0 0 !important;
  padding: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 1.55 !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .cl-source-forms-panel {
  width: 950px !important;
  max-width: 100% !important;
  margin: 0 0 24px !important;
  padding: 22px 24px !important;
  overflow: visible !important;
  background: var(--cl-surface) !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: var(--cl-radius-lg) !important;
  box-shadow: var(--cl-shadow-panel) !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formSearch-box {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  width: 100% !important;
  min-height: 35px !important;
  margin: 0 0 18px !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formSearch-box .pull-right {
  float: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex: 1 1 auto !important;
  gap: 8px !important;
  min-width: 0 !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formSiteList,
body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formSearch,
body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formCount {
  display: inline-flex !important;
  align-items: center !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formSearch form {
  display: block !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .form-select {
  position: relative !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .form-select > a.dropdown-toggle,
body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) #cl-form-site-filter.form-select > a.dropdown-toggle,
body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .form-select > a.dropdown-toggle:hover,
body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .form-select > a.dropdown-toggle:focus {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: auto !important;
  min-width: 112px !important;
  height: 35px !important;
  margin: 0 !important;
  padding: 0 12px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 6px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  text-decoration: none !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) #cl-form-site-filter.form-select > a.dropdown-toggle {
  min-width: 190px !important;
  color: var(--cl-text) !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) #cl-form-site-filter.form-select .site-name {
  display: inline-block !important;
  max-width: 150px !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 10px 0 0 !important;
  overflow: hidden !important;
  color: inherit !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formTable-wrap .formCount .form-cnt {
  margin: 0 18px 0 0 !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .form-select svg,
body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) #cl-form-site-filter.form-select svg {
  position: static !important;
  flex: none !important;
  width: 16px !important;
  height: 16px !important;
  margin: 0 !important;
  transform: none !important;
  color: var(--cl-text-sub) !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .form-select .dropdown-menu {
  min-width: 100% !important;
  width: auto !important;
  margin-top: 4px !important;
  padding: 4px !important;
  overflow: hidden !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  box-shadow: var(--cl-shadow-drop) !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .form-select .dropdown-menu ul {
  max-height: 220px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow-y: auto !important;
  list-style: none !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .form-select .dropdown-menu li {
  display: block !important;
  min-height: 30px !important;
  margin: 0 !important;
  padding: 8px 10px !important;
  overflow: hidden !important;
  border-radius: 6px !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1.15 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .form-select .dropdown-menu li:hover,
body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .form-select .dropdown-menu li.active {
  background: var(--cl-green-tint) !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formTable-wrap .formSearch #formSearch-input {
  position: relative !important;
  display: block !important;
  width: 280px !important;
  max-width: 280px !important;
  height: 35px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 6px !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formTable-wrap .formSearch #formSearch-input input {
  display: block !important;
  width: 100% !important;
  height: 33px !important;
  margin: 0 !important;
  padding: 0 34px 0 12px !important;
  background: transparent !important;
  border: 0 !important;
  color: var(--cl-text) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 33px !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formTable-wrap .formSearch #formSearch-input input::placeholder {
  color: var(--cl-text-muted) !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formTable-wrap .formSearch #formSearch-input svg {
  position: absolute !important;
  top: 50% !important;
  right: 10px !important;
  width: 15px !important;
  height: 15px !important;
  transform: translateY(-50%) !important;
  fill: var(--cl-text-sub) !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formBorder-box {
  display: flex !important;
  width: 100% !important;
  margin: 0 !important;
  overflow: hidden !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formBorder-box .left-div {
  flex: 0 0 50px !important;
  width: 50px !important;
  max-width: 50px !important;
  overflow: hidden !important;
  background: #fff !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formBorder-box .right-div {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  overflow-x: auto !important;
  background: #fff !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formBorder-box.cl-source-forms-empty {
  display: block !important;
  overflow: hidden !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formBorder-box.cl-source-forms-empty .cl-source-forms-empty-div {
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formBorder-box .formTable {
  width: 100% !important;
  margin: 0 !important;
  background: #fff !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  color: var(--cl-text) !important;
  table-layout: fixed !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formBorder-box .right-div .formTable {
  min-width: 834px !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formBorder-box.cl-source-forms-empty .right-div .formTable {
  width: 100% !important;
  min-width: 884px !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formBorder-box .formTable tr,
body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formBorder-box .formTable th,
body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formBorder-box .formTable td {
  background: transparent !important;
  border: 0 !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formBorder-box .formTable tbody,
body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formBorder-box .formTable tr {
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formBorder-box .formTable tr:first-child {
  height: 44px !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formBorder-box .formTable tr.form-list {
  height: 56px !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formBorder-box .formTable th {
  height: 44px !important;
  padding: 12px 14px !important;
  background: #fafbfc !important;
  border-bottom: 1px solid var(--cl-border) !important;
  border-right: 1px solid var(--cl-border) !important;
  color: var(--cl-text-sub) !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
  text-align: left !important;
  vertical-align: middle !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formBorder-box .formTable td {
  height: 56px !important;
  padding: 0 14px !important;
  border-bottom: 1px solid var(--cl-border) !important;
  border-right: 1px solid var(--cl-border) !important;
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 1.45 !important;
  text-align: left !important;
  vertical-align: middle !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formBorder-box .right-div .formTable th:first-child,
body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formBorder-box .right-div .formTable td:first-child {
  text-align: center !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formBorder-box .right-div .formTable td:nth-child(2) {
  overflow: hidden !important;
  line-height: 1 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formBorder-box .right-div .formTable td:nth-child(2) span.form-sid {
  box-sizing: border-box !important;
  display: inline-block !important;
  max-width: calc(100% - 34px) !important;
  margin: 0 !important;
  overflow: hidden !important;
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 18px !important;
  text-overflow: ellipsis !important;
  transform: none !important;
  vertical-align: middle !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formBorder-box .right-div .formTable td:nth-child(2) span.label-country {
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 22px !important;
  max-width: 28px !important;
  height: 18px !important;
  margin: 0 0 0 6px !important;
  padding: 0 5px !important;
  border-radius: 3px !important;
  font-size: 10.5px !important;
  font-weight: 700 !important;
  line-height: 18px !important;
  vertical-align: middle !important;
  transform: none !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formBorder-box .left-div .formTable th,
body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formBorder-box .left-div .formTable td {
  width: 50px !important;
  height: 56px !important;
  padding: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formBorder-box .left-div .formTable tr:first-child th {
  height: 44px !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formBorder-box .right-div .formTable th:last-child,
body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formBorder-box .right-div .formTable td:last-child {
  border-right: 0 !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formBorder-box .formTable tr:last-child td {
  border-bottom: 0 !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formBorder-box.cl-source-forms-empty .formTable .form-empty td.cl-source-forms-no-data {
  min-width: 0 !important;
  max-width: none !important;
  width: auto !important;
  height: 56px !important;
  padding: 0 14px !important;
  border-right: 0 !important;
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 56px !important;
  text-align: center !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formBorder-box .formTable tr.form-list:hover td,
body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formBorder-box .formTable tr.form-list.on td {
  background: #fafbfc !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formBorder-box .formTable td .form-name {
  display: inline-block !important;
  max-width: 145px !important;
  margin: 0 !important;
  overflow: hidden !important;
  color: var(--cl-green-text) !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
  text-overflow: ellipsis !important;
  transform: none !important;
  vertical-align: middle !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formBorder-box .formTable a:hover .form-name,
body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formBorder-box .formTable a:focus .form-name {
  color: var(--cl-green-text) !important;
  text-decoration: underline !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formBorder-box .formTable td .receive-mail {
  display: inline-block !important;
  max-width: 165px !important;
  overflow: hidden !important;
  color: var(--cl-text) !important;
  text-overflow: ellipsis !important;
  vertical-align: middle !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formBorder-box .formTable td > .badge {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 18px !important;
  height: 18px !important;
  margin: 0 0 0 6px !important;
  padding: 0 6px !important;
  border-radius: 999px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 18px !important;
  vertical-align: middle !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formBorder-box .formTable td > .badge.red {
  background: #fdecee !important;
  color: var(--cl-danger) !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formBorder-box .formTable td > .badge.grey {
  background: #eef0f4 !important;
  color: var(--cl-text-sub) !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .newcheckbox {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 16px !important;
  height: 16px !important;
  min-height: 16px !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .newcheckbox label {
  position: relative !important;
  display: inline-flex !important;
  width: 16px !important;
  height: 16px !important;
  min-height: 16px !important;
  margin: 0 !important;
  padding: 0 !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .newcheckbox input[type="checkbox"] {
  position: absolute !important;
  inset: 0 !important;
  z-index: 2 !important;
  width: 16px !important;
  height: 16px !important;
  margin: 0 !important;
  opacity: 0 !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .newcheckbox svg {
  position: absolute !important;
  display: block !important;
  width: 16px !important;
  height: 16px !important;
  top: 0 !important;
  left: 0 !important;
  cursor: pointer !important;
  fill: #c9cdd4 !important;
  transition: opacity .18s ease !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .newcheckbox svg.active {
  opacity: 0 !important;
  fill: var(--cl-green) !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .newcheckbox input[type="checkbox"]:checked ~ svg:not(.active) {
  opacity: 0 !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .newcheckbox input[type="checkbox"]:checked ~ svg.active {
  opacity: 1 !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .newcheckbox svg.checkbox-disabled {
  background: #f1f2f3 !important;
  fill: #e1e4e8 !important;
  opacity: 1 !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .newcheckbox label:has(input[type="checkbox"]:disabled),
body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .newcheckbox label:has(input[type="checkbox"]:disabled) input {
  cursor: not-allowed !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .cl-form-name-cell {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .cl-form-name-cell > a {
  display: inline-flex;
  align-items: center;
  min-width: 0;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formBorder-box .formTable .cl-form-name-cell .form-name-edit {
  position: static;
  flex: none;
  float: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 24px !important;
  height: 24px !important;
  margin: 0 !important;
  padding: 0;
  border: 0 !important;
  background: transparent;
  color: var(--cl-text-muted) !important;
  line-height: 0;
  border-radius: 6px !important;
  vertical-align: middle !important;
  opacity: 0 !important;
  pointer-events: none;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formBorder-box .formTable .form-list:hover .cl-form-name-cell .form-name-edit,
body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formBorder-box .formTable .cl-form-name-cell .form-name-edit:focus-visible {
  opacity: 1 !important;
  pointer-events: auto;
}

@media (hover: none) {
  body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formBorder-box .formTable .cl-form-name-cell .form-name-edit {
    opacity: 1 !important;
    pointer-events: auto;
  }
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formBorder-box .formTable .form-list .cl-form-name-cell .form-name-edit.ss_user_noActive {
  pointer-events: none;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formBorder-box .formTable .cl-form-name-cell .form-name-edit:hover {
  background: var(--cl-green-tint) !important;
  color: var(--cl-green) !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formBorder-box .formTable .cl-form-name-cell .form-name-edit:focus-visible {
  outline: 2px solid var(--cl-green);
  outline-offset: 2px;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formBorder-box .formTable .cl-form-name-cell .form-name-edit svg {
  display: block;
  position: static;
  width: 14px !important;
  height: 14px !important;
  margin: 0 !important;
  fill: currentColor !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .pull-right .formDelete .delete-cnt-text {
  margin: 0 10px 0 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .pull-right .formDelete .delete-cnt {
  color: var(--cl-green-text) !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .form-box .form-delbtn,
body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .form-delbtn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 76px !important;
  height: 35px !important;
  padding: 0 12px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 6px !important;
  color: var(--cl-text-muted) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .form-box .form-delbtn.active,
body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .form-delbtn.active {
  background: var(--cl-green) !important;
  border-color: var(--cl-green) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .form-box .form-delbtn svg,
body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .form-delbtn svg {
  width: 12px !important;
  height: 13px !important;
  margin: 0 6px 0 0 !important;
  fill: currentColor !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .paging-box {
  display: flex !important;
  justify-content: center !important;
  width: 950px !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .cl-source-forms-pager,
body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .shop-pager {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  width: 100% !important;
  margin: 28px 0 0 !important;
  padding: 0 !important;
  border-top: 0 !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .shop-pager:empty {
  display: none !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .shop-pager .pg {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 8px !important;
  appearance: none !important;
  background: transparent !important;
  border: 1px solid transparent !important;
  border-radius: 6px !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  cursor: pointer !important;
  transition: background-color .12s, border-color .12s, color .12s !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .shop-pager .pg.active {
  background: #e4f7ec !important;
  border-color: var(--cl-green) !important;
  color: var(--cl-green-text) !important;
  font-weight: 800 !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .shop-pager .pg:hover:not(.active):not(:disabled),
body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .shop-pager .pg:focus:not(.active):not(:disabled) {
  background: #f1fbf5 !important;
  color: var(--cl-green-text) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .shop-pager .pg:disabled,
body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .shop-pager .pg:disabled:hover {
  background: transparent !important;
  color: var(--cl-text-muted) !important;
  cursor: default !important;
  opacity: .45 !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .shop-pager .pg.nav {
  color: var(--cl-text-muted) !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .shop-pager .pg.nav svg {
  display: block !important;
  width: 15px !important;
  height: 15px !important;
  fill: none !important;
  stroke: currentColor !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) ~ .mobile-detail-popup {
  display: none !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .popover,
body.cl-dashboard-redesign-page:has(:is(.cl-source-forms-route-forms, .cl-source-forms-route-consult)) .popover {
  z-index: 1400 !important;
}

/* Source dashboard: form response list page */
body.cl-dashboard-redesign-page .cl-source-form-view-page .cl-source-forms-breadcrumb {
  max-width: 950px !important;
}

body.cl-dashboard-redesign-page .cl-source-form-view-page .cl-source-forms-breadcrumb strong {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-form-view-page .cl-source-form-view-panel {
  padding: 22px 24px 24px !important;
  overflow: hidden !important;
}

body.cl-dashboard-redesign-page .cl-source-form-view-page .cl-source-form-view-actions {
  float: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  width: 100% !important;
  min-height: 35px !important;
  margin: 0 0 18px !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-form-view-page .btnExcel,
body.cl-dashboard-redesign-page .cl-source-form-view-page .btnExcel .label,
body.cl-dashboard-redesign-page .cl-source-form-view-page .btnExcel .label-inner {
  display: inline-flex !important;
  align-items: center !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  color: inherit !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .cl-source-form-view-page .btnExcel a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 35px !important;
  min-width: 112px !important;
  padding: 0 12px !important;
  background: #fff !important;
  border: 1px solid var(--cl-green) !important;
  border-radius: 6px !important;
  color: var(--cl-green-text) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  text-decoration: none !important;
}

body.cl-dashboard-redesign-page .cl-source-form-view-page .btnExcel a:hover,
body.cl-dashboard-redesign-page .cl-source-form-view-page .btnExcel a:focus {
  background: var(--cl-green-tint) !important;
  color: var(--cl-green-text) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-form-view-page .btnExcel svg {
  width: 12px !important;
  height: 12px !important;
  margin: 0 6px 0 0 !important;
  fill: currentColor !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-source-form-view-page .formDelete {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-form-view-page .formDelete.hide,
body.cl-dashboard-redesign-page .cl-source-form-view-page .btnExcel.hide {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-form-view-page .formDelete .bottom-delete-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-form-view-page .formBorder-box {
  min-height: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-form-view-page .formBorder-box.cl-source-form-view-empty {
  display: block !important;
  overflow: hidden !important;
}

body.cl-dashboard-redesign-page .cl-source-form-view-page .formBorder-box .right-div {
  overflow-x: auto !important;
  overflow-y: hidden !important;
}

body.cl-dashboard-redesign-page .cl-source-form-view-page .formBorder-box .right-div .formTable {
  width: max-content !important;
  min-width: 100% !important;
  table-layout: auto !important;
}

body.cl-dashboard-redesign-page .cl-source-form-view-page .formBorder-box.cl-source-form-view-empty .cl-source-form-view-empty-div {
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
}

body.cl-dashboard-redesign-page .cl-source-form-view-page .formBorder-box.cl-source-form-view-empty .right-div .formTable {
  width: 100% !important;
  min-width: 100% !important;
  table-layout: fixed !important;
}

body.cl-dashboard-redesign-page .cl-source-form-view-page .formBorder-box .right-div .formTable th,
body.cl-dashboard-redesign-page .cl-source-form-view-page .formBorder-box .right-div .formTable td {
  min-width: 150px !important;
  overflow: hidden !important;
  line-height: 1.45 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-form-view-page .formBorder-box .right-div .formTable th:first-child,
body.cl-dashboard-redesign-page .cl-source-form-view-page .formBorder-box .right-div .formTable td:first-child {
  min-width: 70px !important;
  max-width: 70px !important;
  width: 70px !important;
}

body.cl-dashboard-redesign-page .cl-source-form-view-page .formBorder-box.cl-source-form-view-empty .right-div .formTable th.check {
  min-width: 50px !important;
  max-width: 50px !important;
  width: 50px !important;
  padding: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .cl-source-form-view-page .formBorder-box.cl-source-form-view-empty .right-div .formTable th:nth-child(2) {
  min-width: 70px !important;
  max-width: 70px !important;
  width: 70px !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .cl-source-form-view-page .formBorder-box.cl-source-form-view-empty .right-div .formTable .form-empty td.cl-source-form-view-no-data {
  min-width: 0 !important;
  max-width: none !important;
  width: auto !important;
  height: 56px !important;
  padding: 0 14px !important;
  border-right: 0 !important;
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 56px !important;
  text-align: center !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-form-view-page .formBorder-box .right-div .formTable th:last-child,
body.cl-dashboard-redesign-page .cl-source-form-view-page .formBorder-box .right-div .formTable td:last-child {
  min-width: 150px !important;
  max-width: 170px !important;
  width: 150px !important;
}

body.cl-dashboard-redesign-page .cl-source-form-view-page .formBorder-box .right-div .formTable td.open {
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .cl-source-form-view-page .formBorder-box .right-div .formTable td.open:hover {
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-form-view-page .formBorder-box .right-div .formTable a {
  color: var(--cl-green-text) !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}

body.cl-dashboard-redesign-page .cl-source-form-view-page .formBorder-box .right-div .formTable a:hover,
body.cl-dashboard-redesign-page .cl-source-form-view-page .formBorder-box .right-div .formTable a:focus {
  color: var(--cl-green-text) !important;
  text-decoration: underline !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-form-view-page .formBorder-box .right-div .formTable .text-center {
  text-align: center !important;
}

body.cl-dashboard-redesign-page .cl-source-form-view-page .paging-box {
  padding-bottom: 0 !important;
}

/* Source dashboard: domain connection notice */
body.cl-dashboard-redesign-page .cl-source-domain-notice-wrap {
  position: fixed;
  inset: 0;
  z-index: 999999;
  background: rgba(20, 24, 32, .45);
}

body.cl-dashboard-redesign-page .cl-source-domain-notice-wrap + .modal-backdrop {
  opacity: 0 !important;
}

body.cl-dashboard-redesign-page #domainSetModal {
  display: flex !important;
  align-items: center;
  justify-content: center;
  position: fixed !important;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 16px !important;
  overflow: hidden !important;
  background: transparent;
}

body.cl-dashboard-redesign-page #domainSetModal > .cl-mobile-btn {
  display: none !important;
}

body.cl-dashboard-redesign-page #domainSetModal .modal-dialog {
  width: 620px !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page #domainSetModal .modal-content {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: auto !important;
  min-height: 0 !important;
  max-height: calc(100vh - 32px);
  max-height: calc(100dvh - 32px);
  margin: 0;
  padding: 0 !important;
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 14px !important;
  box-shadow: 0 20px 50px rgba(20, 24, 32, .25);
  color: var(--cl-text);
  font-family: var(--cl-source-font);
  letter-spacing: 0;
}

body.cl-dashboard-redesign-page #domainSetModal .modal-body {
  flex: 1 1 auto;
  width: 100%;
  max-width: none;
  min-height: 0 !important;
  margin: 0;
  padding: 32px 32px 0 !important;
  overflow: auto;
  color: var(--cl-text-sub);
  text-align: center;
}

body.cl-dashboard-redesign-page #domainSetModal .modal-title {
  margin: 0 26px 20px !important;
  padding: 0;
  color: var(--cl-text);
  font-size: 21px !important;
  font-weight: 800;
  line-height: 1.4;
  overflow-wrap: anywhere;
}

body.cl-dashboard-redesign-page #domainSetModal p {
  margin: 0;
  font-size: 14px;
  line-height: 22px;
}

body.cl-dashboard-redesign-page #domainSetModal .domain_cnt {
  color: var(--cl-green-text);
  font-weight: 700;
}

body.cl-dashboard-redesign-page #domainSetModal .conn-help-link {
  margin-top: 8px;
}

body.cl-dashboard-redesign-page #domainSetModal .conn-help-link a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  color: var(--cl-green-text);
}

body.cl-dashboard-redesign-page #domainSetModal .conn-help-link a:hover {
  color: var(--cl-green-text);
  text-decoration: underline;
}

body.cl-dashboard-redesign-page #domainSetModal .domain-icon-arrow {
  display: inline-flex;
  flex: none;
}

body.cl-dashboard-redesign-page #domainSetModal .domain-icon-arrow svg {
  width: 10px;
  height: 10px;
  fill: currentColor;
}

body.cl-dashboard-redesign-page #domainSetModal .noActive-lists {
  float: none;
  width: 100%;
  margin: 24px 0 0;
  border-top: 1px solid var(--cl-border);
}

body.cl-dashboard-redesign-page #domainSetModal .noActive-info {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr);
  align-items: center;
  gap: 24px;
  float: none;
  width: 100%;
  padding: 16px 0;
  border-bottom: 1px solid var(--cl-line);
}

body.cl-dashboard-redesign-page #domainSetModal .noActive-info .title,
body.cl-dashboard-redesign-page #domainSetModal .noActive-info .status {
  width: 100%;
  max-width: none;
  min-width: 0;
  margin: 0;
  padding: 0;
  text-align: left;
}

body.cl-dashboard-redesign-page #domainSetModal .noActive-info .title p {
  color: var(--cl-text);
  font-weight: 600;
  overflow-wrap: anywhere;
}

body.cl-dashboard-redesign-page #domainSetModal .status li {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(76px, auto);
  align-items: center;
  gap: 12px;
  padding: 0;
  font-size: 13px;
  line-height: 20px;
}

body.cl-dashboard-redesign-page #domainSetModal .status li.ssl {
  margin-top: 6px;
}

body.cl-dashboard-redesign-page #domainSetModal .status .list-title {
  width: auto;
  max-width: none;
  color: var(--cl-text-sub);
  font-size: 13px;
  overflow-wrap: anywhere;
}

body.cl-dashboard-redesign-page #domainSetModal .status .list-status {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 6px;
  color: var(--cl-text-sub);
}

body.cl-dashboard-redesign-page #domainSetModal .status .status-color {
  flex: 0 0 6px;
  width: 6px;
  height: 6px;
  margin: 0;
  border-radius: 50%;
}

body.cl-dashboard-redesign-page #domainSetModal .status [data-status="active"] .status-color {
  background: var(--cl-green);
}

body.cl-dashboard-redesign-page #domainSetModal .status [data-status="wait"] .status-color {
  background: #f59e0b;
}

body.cl-dashboard-redesign-page #domainSetModal .status [data-status="none"] .status-color {
  background: #e5484d;
}

body.cl-dashboard-redesign-page #domainSetModal .modal-footer {
  display: flex;
  flex: none;
  width: 100%;
  max-width: none;
  flex-direction: row-reverse;
  justify-content: flex-start;
  gap: 8px;
  margin: 0;
  padding: 24px 32px !important;
  border: 0;
}

body.cl-dashboard-redesign-page #domainSetModal .modal-footer::before,
body.cl-dashboard-redesign-page #domainSetModal .modal-footer::after {
  display: none;
}

body.cl-dashboard-redesign-page #domainSetModal .modal-footer .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 1 auto;
  width: auto !important;
  min-width: 0 !important;
  height: 44px !important;
  min-height: 44px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  border: 0 !important;
  border-radius: 8px;
  background: #fff !important;
  color: var(--cl-text-sub) !important;
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
  white-space: normal;
}

body.cl-dashboard-redesign-page #domainSetModal .modal-footer .ok-button-dialog {
  border-color: var(--cl-green) !important;
  background: var(--cl-green) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page #domainSetModal .modal-footer .btn:hover {
  background: #f4f5f9 !important;
}

body.cl-dashboard-redesign-page #domainSetModal .modal-footer .ok-button-dialog:hover {
  border-color: var(--cl-green-hover) !important;
  background: var(--cl-green-hover) !important;
}

body.cl-dashboard-redesign-page #domainSetModal .modal-content > .close {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 2;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--cl-text-sub);
  font-size: 0;
  line-height: 0;
  opacity: 1;
  transition: background .12s, transform .18s cubic-bezier(.34, 1.56, .64, 1);
}

body.cl-dashboard-redesign-page #domainSetModal .modal-content > .close svg {
  display: block;
  width: 9px;
  height: 9px;
  fill: currentColor;
}

body.cl-dashboard-redesign-page #domainSetModal .modal-content > .close:hover {
  background: #f1f2f5;
  color: var(--cl-text);
  transform: rotate(90deg);
}

body.cl-dashboard-redesign-page #domainSetModal :is(button, a):focus-visible {
  outline: 2px solid var(--cl-green);
  outline-offset: 2px;
}

@media (max-width: 600px) {
  body.cl-dashboard-redesign-page #domainSetModal .modal-body {
    padding: 48px 20px 0 !important;
  }

  body.cl-dashboard-redesign-page #domainSetModal .modal-title {
    margin: 0 0 16px !important;
    font-size: 20px !important;
  }

  body.cl-dashboard-redesign-page #domainSetModal .noActive-info {
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
  }

  body.cl-dashboard-redesign-page #domainSetModal .modal-footer {
    padding: 20px !important;
  }

  body.cl-dashboard-redesign-page #domainSetModal .modal-footer .btn {
    flex: 1 1 0;
    padding: 0 8px !important;
  }
}

/* Source dashboard: forms name edit modal */
body.cl-dashboard-redesign-page .flat-modal.cl-source-form-name-edit-modal-wrap {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  overflow: auto !important;
  background: rgba(0, 0, 0, .45) !important;
  z-index: 999999 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-name-edit-modal-wrap > .modal-default,
body.cl-dashboard-redesign-page .flat-modal.cl-source-form-name-edit-modal-wrap > .modal-default.in,
body.cl-dashboard-redesign-page .flat-modal.cl-source-form-name-edit-modal-wrap > .modal-default.show {
  position: fixed !important;
  inset: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100vw !important;
  height: 100vh !important;
  margin: 0 !important;
  padding: 24px 16px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  background: transparent !important;
  z-index: 999999 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-name-edit-modal-wrap + .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-source-form-name-edit-modal-wrap .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-source-form-name-edit-modal-wrap + .modal-backdrop.fade.in,
body.cl-dashboard-redesign-page .flat-modal.cl-source-form-name-edit-modal-wrap .modal-backdrop.fade.in {
  background: transparent !important;
  opacity: 0 !important;
  z-index: 999998 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-name-edit-modal-wrap > .modal-default > .cl-mobile-btn.close {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-name-edit-modal-wrap .modal-dialog.formname-Edit {
  width: min(460px, calc(100vw - 32px)) !important;
  max-width: min(460px, calc(100vw - 32px)) !important;
  margin: 0 auto !important;
  padding: 0 !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-name-edit-modal-wrap .modal-default.in .modal-dialog.formname-Edit,
body.cl-dashboard-redesign-page .flat-modal.cl-source-form-name-edit-modal-wrap .modal-default.fade .modal-dialog.formname-Edit,
body.cl-dashboard-redesign-page .flat-modal.cl-source-form-name-edit-modal-wrap .modal-default.show .modal-dialog.formname-Edit {
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-name-edit-modal-wrap .modal-dialog.formname-Edit .modal-content {
  position: relative !important;
  width: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 36px 40px 30px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 14px !important;
  box-shadow: 0 24px 64px rgba(20, 24, 32, .26) !important;
  color: var(--cl-text) !important;
  font-family: var(--cl-source-font) !important;
  letter-spacing: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-name-edit-modal-wrap .modal-dialog.formname-Edit .modal-body {
  width: 100% !important;
  max-width: none !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  color: var(--cl-text-sub) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 22px !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-name-edit-modal-wrap .modal-dialog.formname-Edit .modal-title {
  margin: 0 34px 18px !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-size: 22px !important;
  font-weight: 800 !important;
  line-height: 30px !important;
  letter-spacing: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-name-edit-modal-wrap .modal-dialog.formname-Edit .modal-content > .close.close-button-dialog {
  position: absolute !important;
  top: 16px !important;
  right: 16px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  appearance: none !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub) !important;
  font-size: 0 !important;
  line-height: 0 !important;
  opacity: 1 !important;
  text-decoration: none !important;
  transition: background-color .12s, color .12s, transform .18s cubic-bezier(.34, 1.56, .64, 1) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-name-edit-modal-wrap .modal-dialog.formname-Edit .modal-content > .close.close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-form-name-edit-modal-wrap .modal-dialog.formname-Edit .modal-content > .close.close-button-dialog:focus {
  background: #f1f2f5 !important;
  color: var(--cl-text) !important;
  outline: 0 !important;
  transform: rotate(90deg) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-name-edit-modal-wrap .modal-dialog.formname-Edit .modal-content > .close.close-button-dialog span,
body.cl-dashboard-redesign-page .flat-modal.cl-source-form-name-edit-modal-wrap .modal-dialog.formname-Edit .modal-content > .close.close-button-dialog svg {
  display: block !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-name-edit-modal-wrap .modal-dialog.formname-Edit .modal-content > .close.close-button-dialog svg {
  width: 10px !important;
  height: 10px !important;
  fill: currentColor !important;
  stroke: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-name-edit-modal-wrap .modal-dialog.formname-Edit .form-name-box {
  width: 100% !important;
  margin: 0 0 24px !important;
  padding: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 22px !important;
  letter-spacing: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-name-edit-modal-wrap .modal-dialog.formname-Edit .cl-common-form-wrap-box,
body.cl-dashboard-redesign-page .flat-modal.cl-source-form-name-edit-modal-wrap .modal-dialog.formname-Edit .cl-common-form-wrap,
body.cl-dashboard-redesign-page .flat-modal.cl-source-form-name-edit-modal-wrap .modal-dialog.formname-Edit .cl-common-form-group {
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-name-edit-modal-wrap .modal-dialog.formname-Edit .cl-common-form-group .form-name {
  display: flex !important;
  flex-direction: column-reverse !important;
  align-items: stretch !important;
  gap: 8px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-name-edit-modal-wrap .modal-dialog.formname-Edit .cl-common-control-label {
  position: static !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  display: block !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  line-height: 18px !important;
  letter-spacing: 0 !important;
  pointer-events: auto !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-name-edit-modal-wrap .modal-dialog.formname-Edit .cl-common-form-control {
  display: block !important;
  width: 100% !important;
  height: 44px !important;
  min-height: 44px !important;
  margin: 0 !important;
  padding: 0 13px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 42px !important;
  letter-spacing: 0 !important;
  outline: 0 !important;
  transition: border-color .12s, box-shadow .12s !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-name-edit-modal-wrap .modal-dialog.formname-Edit .cl-common-form-control:hover {
  border-color: #d5d9e0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-name-edit-modal-wrap .modal-dialog.formname-Edit .cl-common-form-control:focus {
  border-color: var(--cl-green) !important;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .13) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-name-edit-modal-wrap .modal-dialog.formname-Edit p.error {
  display: flex !important;
  align-items: flex-start !important;
  gap: 6px !important;
  width: 100% !important;
  margin: 10px 0 0 !important;
  padding: 0 !important;
  color: var(--cl-danger) !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  line-height: 18px !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-name-edit-modal-wrap .modal-dialog.formname-Edit p.error svg {
  flex: 0 0 13px !important;
  width: 13px !important;
  height: 13px !important;
  margin: 2px 0 0 !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-name-edit-modal-wrap .modal-dialog.formname-Edit .modal-footer {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  width: 100% !important;
  max-width: none !important;
  margin: 30px auto 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  gap: 12px !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-name-edit-modal-wrap .modal-dialog.formname-Edit .modal-footer > .btn {
  float: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 46px !important;
  min-height: 46px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  text-align: center !important;
  text-decoration: none !important;
  text-shadow: none !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-name-edit-modal-wrap .modal-dialog.formname-Edit .modal-footer > .ok-button-dialog {
  order: 1 !important;
  background: var(--cl-green) !important;
  border: 1px solid var(--cl-green) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-name-edit-modal-wrap .modal-dialog.formname-Edit .modal-footer > .ok-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-form-name-edit-modal-wrap .modal-dialog.formname-Edit .modal-footer > .ok-button-dialog:focus {
  background: var(--cl-green-hover) !important;
  border-color: var(--cl-green-hover) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-name-edit-modal-wrap .modal-dialog.formname-Edit .modal-footer > .close-button-dialog {
  order: 2 !important;
  background: transparent !important;
  border: 0 !important;
  color: var(--cl-text-sub) !important;
  font-weight: 500 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-name-edit-modal-wrap .modal-dialog.formname-Edit .modal-footer > .close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-form-name-edit-modal-wrap .modal-dialog.formname-Edit .modal-footer > .close-button-dialog:focus {
  background: var(--cl-green-soft) !important;
  color: var(--cl-green-text) !important;
}

/* Source dashboard: forms delete modal */
body.cl-dashboard-redesign-page .flat-modal.cl-source-form-delete-modal-wrap {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  overflow: auto !important;
  background: rgba(0, 0, 0, .45) !important;
  z-index: 999999 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-delete-modal-wrap > .modal-default,
body.cl-dashboard-redesign-page .flat-modal.cl-source-form-delete-modal-wrap > .modal-default.in,
body.cl-dashboard-redesign-page .flat-modal.cl-source-form-delete-modal-wrap > .modal-default.show {
  position: fixed !important;
  inset: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100vw !important;
  height: 100vh !important;
  margin: 0 !important;
  padding: 24px 16px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  background: transparent !important;
  z-index: 999999 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-delete-modal-wrap + .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-source-form-delete-modal-wrap .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-source-form-delete-modal-wrap + .modal-backdrop.fade.in,
body.cl-dashboard-redesign-page .flat-modal.cl-source-form-delete-modal-wrap .modal-backdrop.fade.in {
  background: transparent !important;
  opacity: 0 !important;
  z-index: 999998 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-delete-modal-wrap > .modal-default > .cl-mobile-btn.close {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-delete-modal-wrap .modal-dialog.cl-source-form-delete-modal,
body.cl-dashboard-redesign-page .flat-modal.cl-source-form-delete-modal-wrap .modal-dialog.cl-source-form-delete-empty-modal {
  width: min(420px, calc(100vw - 32px)) !important;
  max-width: min(420px, calc(100vw - 32px)) !important;
  margin: 0 auto !important;
  padding: 0 !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-delete-modal-wrap .modal-default.in .modal-dialog,
body.cl-dashboard-redesign-page .flat-modal.cl-source-form-delete-modal-wrap .modal-default.fade .modal-dialog,
body.cl-dashboard-redesign-page .flat-modal.cl-source-form-delete-modal-wrap .modal-default.show .modal-dialog {
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-delete-modal-wrap .modal-dialog.cl-source-form-delete-modal .modal-content,
body.cl-dashboard-redesign-page .flat-modal.cl-source-form-delete-modal-wrap .modal-dialog.cl-source-form-delete-empty-modal .modal-content {
  position: relative !important;
  width: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 36px 40px 30px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 14px !important;
  box-shadow: 0 24px 64px rgba(20, 24, 32, .26) !important;
  color: var(--cl-text) !important;
  font-family: var(--cl-source-font) !important;
  letter-spacing: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-delete-modal-wrap .modal-dialog.cl-source-form-delete-modal .modal-body,
body.cl-dashboard-redesign-page .flat-modal.cl-source-form-delete-modal-wrap .modal-dialog.cl-source-form-delete-empty-modal .modal-body {
  width: 100% !important;
  max-width: none !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  color: var(--cl-text-sub) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 22px !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-delete-modal-wrap .modal-dialog.cl-source-form-delete-modal .modal-title,
body.cl-dashboard-redesign-page .flat-modal.cl-source-form-delete-modal-wrap .modal-dialog.cl-source-form-delete-empty-modal .modal-title {
  margin: 0 34px 18px !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-size: 22px !important;
  font-weight: 800 !important;
  line-height: 30px !important;
  letter-spacing: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-delete-modal-wrap .modal-dialog .modal-content > .close.close-button-dialog {
  position: absolute !important;
  top: 16px !important;
  right: 16px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  appearance: none !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub) !important;
  font-size: 0 !important;
  line-height: 0 !important;
  opacity: 1 !important;
  text-decoration: none !important;
  transition: background-color .12s, color .12s, transform .18s cubic-bezier(.34, 1.56, .64, 1) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-delete-modal-wrap .modal-dialog .modal-content > .close.close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-form-delete-modal-wrap .modal-dialog .modal-content > .close.close-button-dialog:focus {
  background: #f1f2f5 !important;
  color: var(--cl-text) !important;
  outline: 0 !important;
  transform: rotate(90deg) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-delete-modal-wrap .modal-dialog .modal-content > .close.close-button-dialog svg {
  display: block !important;
  width: 10px !important;
  height: 10px !important;
  fill: currentColor !important;
  stroke: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-delete-modal-wrap .modal-dialog .modal-body .blank {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  margin: 0 2px !important;
  color: var(--cl-green-text) !important;
  font-weight: 700 !important;
  vertical-align: middle !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-delete-modal-wrap .modal-dialog .modal-body .blank svg {
  flex: 0 0 12px !important;
  width: 12px !important;
  height: 12px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-delete-modal-wrap .modal-dialog .modal-body .confirm-text {
  display: block !important;
  margin-top: 16px !important;
  color: var(--cl-text) !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-delete-modal-wrap .modal-dialog .modal-footer {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  width: 100% !important;
  max-width: none !important;
  margin: 28px auto 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  gap: 12px !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-delete-modal-wrap .modal-dialog .modal-footer > .btn {
  float: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 46px !important;
  min-height: 46px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  text-align: center !important;
  text-decoration: none !important;
  text-shadow: none !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-delete-modal-wrap .modal-dialog .modal-footer > .ok-button-dialog {
  order: 1 !important;
  background: var(--cl-danger) !important;
  border: 1px solid var(--cl-danger) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-delete-modal-wrap .modal-dialog .modal-footer > .ok-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-form-delete-modal-wrap .modal-dialog .modal-footer > .ok-button-dialog:focus {
  background: #d63f44 !important;
  border-color: #d63f44 !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-delete-modal-wrap .modal-dialog .modal-footer > .close-button-dialog {
  order: 2 !important;
  background: transparent !important;
  border: 0 !important;
  color: var(--cl-text-sub) !important;
  font-weight: 500 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-delete-modal-wrap .modal-dialog .modal-footer > .close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-form-delete-modal-wrap .modal-dialog .modal-footer > .close-button-dialog:focus {
  background: var(--cl-danger-soft) !important;
  color: var(--cl-danger) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-delete-modal-wrap.cl-source-form-delete-info-modal-wrap .modal-dialog .modal-footer > .ok-button-dialog {
  order: 1 !important;
  background: var(--cl-green) !important;
  border: 1px solid var(--cl-green) !important;
  color: #fff !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-form-delete-modal-wrap.cl-source-form-delete-info-modal-wrap .modal-dialog .modal-footer > .ok-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-form-delete-modal-wrap.cl-source-form-delete-info-modal-wrap .modal-dialog .modal-footer > .ok-button-dialog:focus {
  background: var(--cl-green-hover) !important;
  border-color: var(--cl-green-hover) !important;
  color: #fff !important;
}

@media (max-width: 767px) {
  body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) {
    width: 100% !important;
    max-width: none !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
    padding: 24px 16px 64px !important;
  }

  body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .cl-source-forms-breadcrumb {
    margin-bottom: 18px !important;
    font-size: 18px !important;
  }

  body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .cl-source-forms-panel {
    padding: 18px 16px !important;
    border-radius: 12px !important;
  }

  body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formSearch-box,
  body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formSearch-box .pull-right {
    align-items: stretch !important;
    flex-direction: column !important;
    gap: 10px !important;
  }

  body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formSiteList,
  body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formSearch,
  body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formCount,
  body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formSearch form,
  body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .formTable-wrap .formSearch #formSearch-input,
  body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) .form-select > a.dropdown-toggle,
  body.cl-dashboard-redesign-page :is(.cl-source-forms-route-forms, .cl-source-forms-route-consult) #cl-form-site-filter.form-select > a.dropdown-toggle {
    width: 100% !important;
    max-width: 100% !important;
  }
}

/* ===== 알림 > 문자 알림 / 카카오 알림톡 ===== */
body.cl-dashboard-redesign-page .dashbottom-wrap .dashbottom-container.kakao-wrap-width:has(.shopping-dashboard.setting-email:not(.setting-email-legacy)) {
  display: block !important;
  width: 100% !important;
  max-width: 1127px !important;
  margin-right: auto !important;
  margin-left: 0 !important;
}

body.cl-dashboard-redesign-page .dashbottom-container.kakao-wrap-width > .cl-source-notification-head {
  display: block !important;
  width: 100%;
  max-width: 1127px;
  margin: 0 0 28px;
}

body.cl-dashboard-redesign-page .dashbottom-container.kakao-wrap-width > .cl-source-notification-head .cl-source-notification-breadcrumb {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text);
  font-size: 20px;
  font-weight: 700;
  line-height: 1.35;
}

body.cl-dashboard-redesign-page .dashbottom-container.kakao-wrap-width > .cl-source-notification-head .cl-source-notification-breadcrumb .sep {
  color: var(--cl-text-muted);
  font-size: 23px;
  font-weight: 400;
  line-height: 1;
}

body.cl-dashboard-redesign-page .dashbottom-container.kakao-wrap-width > .cl-source-notification-head .cl-source-notification-breadcrumb .current {
  color: var(--cl-text-sub);
  font-weight: 700;
}

body.cl-dashboard-redesign-page .dashbottom-container.kakao-wrap-width > .cl-source-notification-head .cl-source-notification-breadcrumb .bc-link {
  cursor: pointer;
  transition: color .12s;
}

body.cl-dashboard-redesign-page .dashbottom-container.kakao-wrap-width > .cl-source-notification-head .cl-source-notification-breadcrumb .bc-link:hover {
  color: var(--cl-green-text);
}

body.cl-dashboard-redesign-page .dashbottom-container.kakao-wrap-width > .cl-source-notification-head .cl-source-notification-desc {
  margin: 12px 0 0 !important;
  padding: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 18px !important;
}

body.cl-dashboard-redesign-page .dashbottom-container.kakao-wrap-width > .cl-source-notification-layout {
  display: flex;
  align-items: flex-start;
  flex-wrap: nowrap;
  gap: 24px;
  width: 100%;
  max-width: 1127px;
}

body.cl-dashboard-redesign-page .dashbottom-container.kakao-wrap-width .cl-source-notification-main {
  flex: 1 1 760px;
  min-width: 0;
  max-width: 760px;
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 14px;
  box-shadow: var(--cl-shadow-panel);
}

body.cl-dashboard-redesign-page .dashbottom-container.kakao-wrap-width .cl-source-notification-main > .notification-tabs-wrap,
body.cl-dashboard-redesign-page .dashbottom-container.kakao-wrap-width > .notification-tabs-wrap {
  position: relative !important;
  display: block !important;
  width: auto !important;
  max-width: none !important;
  box-sizing: border-box;
  height: 51px !important;
  margin: 0 24px !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .dashbottom-container.kakao-wrap-width .cl-source-notification-main > .notification-tabs-wrap::before,
body.cl-dashboard-redesign-page .dashbottom-container.kakao-wrap-width > .notification-tabs-wrap::before {
  content: "" !important;
  position: absolute !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  z-index: 1 !important;
  height: 1px !important;
  background: var(--cl-border) !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .dashbottom-container.kakao-wrap-width .notification-tabs {
  position: static !important;
  inset: auto !important;
  z-index: auto !important;
  display: flex !important;
  align-items: center !important;
  float: none !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .dashbottom-container.kakao-wrap-width .notification-tabs ul {
  display: flex !important;
  align-items: center;
  flex-wrap: wrap;
  gap: 28px;
  width: auto !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  list-style: none !important;
}

body.cl-dashboard-redesign-page .dashbottom-container.kakao-wrap-width .notification-tabs li {
  float: none !important;
  width: auto !important;
  min-width: 0 !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

body.cl-dashboard-redesign-page .dashbottom-container.kakao-wrap-width .notification-tabs a {
  position: relative !important;
  z-index: 2 !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-width: 0 !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 2px !important;
  border: 0 !important;
  border-bottom: 2px solid transparent !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--cl-text-sub) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 20px !important;
  text-decoration: none !important;
  white-space: nowrap;
  transition: color .12s, border-color .12s;
}

body.cl-dashboard-redesign-page .dashbottom-container.kakao-wrap-width .notification-tabs a:hover,
body.cl-dashboard-redesign-page .dashbottom-container.kakao-wrap-width .notification-tabs a:focus {
  color: var(--cl-text) !important;
}

body.cl-dashboard-redesign-page .dashbottom-container.kakao-wrap-width .notification-tabs a.active {
  color: var(--cl-green-text) !important;
  border-bottom-color: var(--cl-green) !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) {
  float: none !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .dashbottom-container.kakao-wrap-width .cl-source-notification-guide {
  position: sticky;
  top: 72px;
  align-self: flex-start;
}

/* 알림 설정 가이드 영상 제작 전까지 모든 알림 탭에서 영상 섹션을 숨긴다. */
body.cl-dashboard-redesign-page .dashbottom-container.kakao-wrap-width .cl-source-notification-guide {
  display: none;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) > .kakaoemail-setting-button {
  display: none !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) > form {
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) #notification-talk-home,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) #notification-mail-home {
  width: 100% !important;
  box-sizing: border-box;
  margin: 0 !important;
  padding: 24px 28px 28px !important;
  border: 0 !important;
  background: #fff !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) #notification-mail-home {
  display: none !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy).notification-mail-active #notification-talk-home {
  display: none !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy).notification-mail-active #notification-mail-home {
  display: grid !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .setting-box.kakao-wrap {
  display: none !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-address-source,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-points-source {
  display: none !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy).notification-mail-active #notification-mail-home .notification-mail-detail:not(.is-hidden) .notification-mail-address-source,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy).notification-mail-active #notification-mail-home .notification-mail-detail:not(.is-hidden) .notification-mail-points-source {
  display: block !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy).notification-kakao-active #notification-talk-home {
  padding-bottom: 0 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy).notification-kakao-active #notification-talk-home > :last-child,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy).notification-mail-active #notification-mail-home > :last-child,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy).notification-kakao-active #notification-talk-home .notification-kakao-settings {
  margin-bottom: 0 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-home-head,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-toggle-row {
  display: flex !important;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  margin: 0 0 20px !important;
  padding: 0 !important;
  border: 0 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-home-head {
  display: none !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-home-head h2,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-title {
  flex: none;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  color: var(--cl-text) !important;
  font-size: 19px !important;
  font-weight: 800 !important;
  line-height: 28px !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-switch {
  flex: none;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-guide {
  flex: none;
  margin-left: auto !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .connect-guide {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: auto !important;
  min-width: 0 !important;
  height: 38px !important;
  margin: 0 !important;
  padding: 0 15px !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  background: #fff !important;
  color: var(--cl-green-text) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 18px !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .connect-guide:hover {
  border-color: var(--cl-green-line) !important;
  background: var(--cl-green-tint) !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .connect-guide.notification-mail-guide {
  margin-left: auto !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .connect-guide svg {
  flex: none;
  color: currentColor !important;
  fill: currentColor !important;
  stroke: currentColor !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .connect-guide svg path {
  fill: currentColor !important;
  stroke: none !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .cm-popover-info {
  flex: none;
  color: var(--cl-accent-blue) !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-point-summary {
  display: flex !important;
  align-items: center;
  gap: 12px;
  width: 100%;
  box-sizing: border-box;
  margin: 0 0 22px !important;
  padding: 16px 20px !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 12px !important;
  background: #f8faf9 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-point-title {
  display: inline-flex !important;
  align-items: center;
  gap: 5px;
  margin: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 20px !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-point-summary strong {
  margin: 0 !important;
  color: var(--cl-green-text) !important;
  font-size: 17px !important;
  font-weight: 800 !important;
  line-height: 24px !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-point-actions {
  display: flex !important;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 0 auto !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-point-actions .friends-btn,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-point-actions .notification-outline-btn,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-point-actions .notification-blue-btn {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  flex: none;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 36px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  background: #fff !important;
  color: var(--cl-text) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 18px !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-point-actions .notification-blue-btn {
  border-color: var(--cl-green) !important;
  background: var(--cl-green) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-point-actions .friends-btn:hover,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-point-actions .notification-outline-btn:hover {
  border-color: var(--cl-green-line) !important;
  background: var(--cl-green-tint) !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-point-actions .notification-blue-btn:hover {
  border-color: var(--cl-green-hover) !important;
  background: var(--cl-green-hover) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-point-actions .friends-btn:disabled,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-point-actions .notification-outline-btn:disabled,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-point-actions .notification-blue-btn:disabled {
  cursor: not-allowed !important;
  border-color: var(--cl-border) !important;
  background: #f5f6f8 !important;
  color: var(--cl-text-muted) !important;
  box-shadow: none !important;
  opacity: 1 !important;
}

body.cl-dashboard-redesign-page #notification-talk-home .notification-v2-section {
  display: grid !important;
  grid-template-columns: 210px minmax(0, 1fr) 36px;
  gap: 14px;
  align-items: start;
  margin: 0 !important;
  padding: 20px 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page #notification-talk-home .notification-v2-section :is(.notification-sms-settings-title, .notification-kakao-head) {
  display: flex !important;
  flex-direction: column;
  align-items: flex-start;
  gap: 0;
  grid-column: 1;
  grid-row: 1;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page #notification-talk-home .notification-v2-section h3 {
  display: flex;
  align-items: center;
  gap: 9px;
  margin: 0 !important;
  font-size: 14px !important;
  line-height: 20px;
}

body.cl-dashboard-redesign-page #notification-talk-home .notification-v2-icon {
  flex: none;
  width: 20px;
  height: 20px;
  object-fit: contain;
}

body.cl-dashboard-redesign-page #notification-talk-home .notification-v2-guide {
  position: static !important;
  float: none !important;
  display: inline-flex !important;
  align-items: center;
  width: auto !important;
  height: auto !important;
  min-height: 0 !important;
  gap: 3px;
  margin: 12px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--cl-green-text) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 1.5;
  text-align: left;
  word-break: keep-all;
  white-space: normal;
  transform: none !important;
}

body.cl-dashboard-redesign-page #notification-talk-home .notification-v2-guide svg {
  flex: none;
  width: 11px;
  height: 11px;
}

body.cl-dashboard-redesign-page #notification-talk-home .notification-v2-guide:hover,
body.cl-dashboard-redesign-page #notification-talk-home .notification-v2-guide:focus-visible {
  color: var(--cl-green-text) !important;
  text-decoration: underline;
  text-underline-offset: 3px;
}

body.cl-dashboard-redesign-page #notification-talk-home .notification-v2-section :is(.notification-sms-title, .notification-kakao-title) > .cm-popover-info {
  display: none;
}

body.cl-dashboard-redesign-page #notification-talk-home .notification-v2-section :is(.notification-sms-switch-row, .notification-kakao-switch-row) {
  grid-column: 3;
  grid-row: 1;
  align-self: start;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page #notification-talk-home .notification-v2-section :is(.notification-sms-detail-content, .notification-kakao-detail-content, .notification-v2-description) {
  grid-column: 2;
  grid-row: 1;
  min-width: 0;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page #notification-talk-home .notification-v2-description {
  display: none;
  color: var(--cl-text-sub);
  font-size: 13.5px;
  line-height: 1.6;
  overflow-wrap: anywhere;
}

body.cl-dashboard-redesign-page #notification-talk-home .notification-v2-section.is-collapsed .notification-v2-description {
  display: block;
}

body.cl-dashboard-redesign-page #notification-talk-home .notification-v2-section .notification-sms-row {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

body.cl-dashboard-redesign-page #notification-talk-home .notification-v2-section :is(.notification-sms-row-title, .notification-sms-control) {
  width: 100% !important;
  min-width: 0 !important;
  margin-left: 0 !important;
}

body.cl-dashboard-redesign-page #notification-talk-home .notification-v2-section :is(.notification-sms-switch, .notification-kakao-switch) .simple-switch-handle {
  top: 2px !important;
  left: 2px !important;
  width: 16px !important;
  height: 16px !important;
}

body.cl-dashboard-redesign-page #notification-talk-home .notification-v2-section :is(.notification-sms-switch, .notification-kakao-switch) .simple-switch-input:checked ~ .simple-switch-handle {
  left: 2px !important;
}

@media (max-width: 1180px) {
  body.cl-dashboard-redesign-page #notification-talk-home .notification-v2-section {
    grid-template-columns: minmax(0, 1fr) 36px;
  }

  body.cl-dashboard-redesign-page #notification-talk-home .notification-v2-section :is(.notification-sms-switch-row, .notification-kakao-switch-row) {
    grid-column: 2;
  }

  body.cl-dashboard-redesign-page #notification-talk-home .notification-v2-section :is(.notification-sms-detail-content, .notification-kakao-detail-content, .notification-v2-description) {
    grid-column: 1 / -1;
    grid-row: 2;
  }
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-card,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-settings-card,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-settings {
  width: 100% !important;
  box-sizing: border-box;
  margin: 0 0 20px !important;
  padding: 24px 26px 26px !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 14px !important;
  background: #fff !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-settings-card,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-settings {
  display: block !important;
  height: auto !important;
  min-height: 0 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-settings-card {
  display: grid !important;
  grid-template-columns: auto auto 1fr;
  column-gap: 12px;
  align-items: start;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-settings {
  display: grid !important;
  grid-template-columns: auto auto 1fr;
  column-gap: 12px;
  align-items: start;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-settings-card > #notification-sms-use-value {
  display: none !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-settings > input[type="hidden"] {
  display: none !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-settings-card .notification-sms-settings-title {
  grid-column: 1;
  grid-row: 1;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-settings .notification-kakao-head {
  grid-column: 1;
  grid-row: 1;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-settings-card .notification-sms-settings-body {
  display: contents !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-settings .notification-kakao-detail {
  display: contents !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-settings-card .notification-sms-switch-row {
  position: static !important;
  grid-column: 2;
  grid-row: 1;
  align-self: center;
  margin: 0 0 20px !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-settings .notification-kakao-switch-row {
  position: static !important;
  grid-column: 2;
  grid-row: 1;
  align-self: center;
  margin: 0 0 20px !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-settings-card .notification-sms-detail-content {
  grid-column: 1 / -1;
  grid-row: 2;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-settings .notification-kakao-detail-content {
  grid-column: 1 / -1;
  grid-row: 2;
  width: 100% !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-settings-card.is-collapsed,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-settings.is-collapsed {
  height: auto !important;
  min-height: 0 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-settings-card.is-onboarding-hidden,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-settings.is-onboarding-hidden,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-detail-content.is-hidden,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-detail-content.is-hidden,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-detail.is-hidden {
  display: none !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-card-sms {
  display: block !important;
  min-height: 0 !important;
  background: #eaf9f1 !important;
  border-color: #cdefdd !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-card-kakao {
  display: block !important;
  min-height: 0 !important;
  background: #fff !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-card.notification-onboarding-hidden {
  display: none !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-card-icon {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  float: none !important;
  width: 46px !important;
  height: 46px !important;
  margin: 0 14px 14px 0 !important;
  border-radius: 12px !important;
  background: #fff !important;
  box-shadow: 0 5px 14px rgba(20, 24, 32, .08) !important;
  vertical-align: top;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-card-icon img {
  width: 37px !important;
  height: 37px !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-card-body {
  display: inline-block !important;
  width: calc(100% - 66px);
  min-width: 0;
  vertical-align: top;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-card-eyebrow {
  margin: 0 0 2px !important;
  color: var(--cl-text-sub) !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  line-height: 18px !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-card-eyebrow strong {
  color: var(--cl-text) !important;
  font-weight: 800 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-card h3,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-title h3,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-title h3 {
  margin: 0 !important;
  color: var(--cl-text) !important;
  font-size: 17px !important;
  font-weight: 800 !important;
  line-height: 24px !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-card h3 {
  font-size: 19px !important;
  line-height: 26px !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-card p {
  clear: both;
  margin: 0 0 18px !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
  word-break: keep-all;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-card-actions {
  clear: both;
  display: flex !important;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-card-actions .notification-card-action,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-card-actions .notification-card-guide {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 40px !important;
  margin: 0 !important;
  padding: 0 22px !important;
  border-radius: 999px !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  line-height: 20px !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-card-actions .notification-card-action {
  border: 0 !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-card-actions .notification-card-action-blue {
  background: #3a7be0 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-card-actions .notification-card-action-dark {
  background: #191919 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-card-actions .notification-card-guide {
  border: 1px solid var(--cl-border) !important;
  background: #fff !important;
  color: var(--cl-text) !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-settings-title,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-head {
  display: flex !important;
  align-items: center;
  gap: 12px;
  margin: 0 0 20px !important;
  padding: 0 !important;
  border: 0 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-title,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-title {
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-settings-body,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-detail {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-switch-row,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-switch-row {
  position: absolute;
  top: 24px;
  right: 26px;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-row-sender .notification-sms-control {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 109px 80px;
  align-items: start;
  gap: 8px;
  width: 100% !important;
  max-width: none !important;
  box-sizing: border-box;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-row-sender .notification-sms-select-wrap {
  display: grid !important;
  grid-column: 1 / 3;
  grid-template-columns: minmax(0, 1fr) 109px;
  align-items: start;
  gap: 8px;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible;
  border: 0 !important;
  background: transparent !important;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-row-sender .notification-sms-select-wrap::after {
  display: none !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-row-sender .notification-sms-select {
  display: none !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-row-sender .notification-sms-selected-display {
  display: contents !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-row-sender .notification-sms-selected-number {
  position: relative;
  display: flex;
  align-items: center;
  grid-column: 1;
  grid-row: 1;
  width: 100% !important;
  min-width: 0;
  height: 40px;
  box-sizing: border-box;
  margin: 0 !important;
  padding: 0 34px 0 13px;
  overflow: hidden;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
  background: #fff;
  color: var(--cl-text);
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-row-sender .notification-sms-select-wrap:not(.is-disabled) .notification-sms-selected-number::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 14px;
  width: 0;
  height: 0;
  margin-top: -2px;
  border-top: 5px solid var(--cl-text-sub);
  border-right: 4px solid transparent;
  border-left: 4px solid transparent;
  transition: transform .15s;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-row-sender .notification-sms-select-wrap.is-open .notification-sms-selected-number {
  border-color: var(--cl-green);
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .12);
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-row-sender .notification-sms-select-wrap.is-open .notification-sms-selected-number::after {
  transform: rotate(180deg);
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-row-sender .notification-sms-select-wrap.is-disabled {
  cursor: default;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-row-sender .notification-sms-select-wrap.is-disabled .notification-sms-selected-number {
  background: #fff;
  color: var(--cl-text-muted);
  cursor: default;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-row-sender .notification-sms-select-wrap.is-disabled .notification-sms-dropdown {
  display: none !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-row-sender .notification-sms-status {
  display: inline-flex !important;
  align-items: center;
  justify-content: flex-start;
  grid-column: 2;
  grid-row: 1;
  width: 109px;
  min-width: 0;
  height: 40px;
  box-sizing: border-box;
  margin: 0 !important;
  padding: 0 42px 0 14px;
  border-radius: 8px;
  background: transparent;
  color: var(--cl-green-text) !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  line-height: 18px !important;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-row-sender .notification-sms-status::before {
  content: "";
  display: block;
  flex: 0 0 8px;
  width: 8px !important;
  height: 8px !important;
  margin-right: 5px;
  border-radius: 50%;
  background: currentColor;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-row-sender .notification-sms-count {
  position: static !important;
  z-index: 1;
  grid-column: 2;
  grid-row: 1;
  align-self: center;
  justify-self: end;
  padding-right: 12px;
  transform: none !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-row-sender .notification-sms-action {
  grid-column: 3;
  grid-row: 1;
  width: 80px !important;
  min-width: 80px !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-row-sender .notification-sms-help {
  grid-column: 1 / -1;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row:has(.notification-kakao-select-wrap) {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 109px 80px;
  align-items: start;
  gap: 8px;
  width: 100% !important;
  max-width: none !important;
  box-sizing: border-box;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row .notification-kakao-select-wrap {
  display: grid !important;
  grid-column: 1 / 3;
  grid-template-columns: minmax(0, 1fr) 109px;
  align-items: start;
  gap: 8px;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible;
  border: 0 !important;
  background: transparent !important;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row .notification-kakao-select-wrap::after,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row .notification-kakao-select-wrap .notification-sms-select {
  display: none !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row .notification-kakao-select-wrap .notification-sms-selected-display {
  display: contents !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row .notification-kakao-select-wrap .notification-sms-selected-number {
  position: relative;
  display: flex;
  align-items: center;
  grid-column: 1;
  grid-row: 1;
  width: 100% !important;
  min-width: 0;
  height: 40px;
  box-sizing: border-box;
  margin: 0 !important;
  padding: 0 34px 0 13px;
  overflow: hidden;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
  background: #fff;
  color: var(--cl-text);
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row .notification-kakao-select-wrap:not(.is-disabled) .notification-sms-selected-number::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 14px;
  width: 0;
  height: 0;
  margin-top: -2px;
  border-top: 5px solid var(--cl-text-sub);
  border-right: 4px solid transparent;
  border-left: 4px solid transparent;
  transition: transform .15s;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row .notification-kakao-select-wrap.is-open .notification-sms-selected-number {
  border-color: var(--cl-green);
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .12);
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row .notification-kakao-select-wrap.is-open .notification-sms-selected-number::after {
  transform: rotate(180deg);
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row .notification-kakao-select-wrap.is-disabled {
  cursor: default;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row .notification-kakao-select-wrap.is-disabled .notification-sms-selected-number {
  color: var(--cl-text-muted);
  cursor: default;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row .notification-kakao-select-wrap.is-disabled .notification-sms-dropdown {
  display: none !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row .notification-kakao-select-wrap .notification-sms-status {
  display: inline-flex !important;
  align-items: center;
  justify-content: flex-start;
  grid-column: 2;
  grid-row: 1;
  width: 109px;
  min-width: 0;
  height: 40px;
  box-sizing: border-box;
  margin: 0 !important;
  padding: 0 42px 0 14px;
  border-radius: 8px;
  background: transparent;
  color: var(--cl-green-text) !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  line-height: 18px !important;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row .notification-kakao-select-wrap .notification-sms-status::before {
  content: "";
  display: block;
  flex: 0 0 8px;
  width: 8px !important;
  height: 8px !important;
  margin-right: 5px;
  border-radius: 50%;
  background: currentColor;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row .notification-kakao-select-wrap .notification-sms-count {
  position: static !important;
  z-index: 1;
  grid-column: 2;
  grid-row: 1;
  align-self: center;
  justify-self: end;
  padding-right: 12px;
  transform: none !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row:has(.notification-kakao-select-wrap) .notification-kakao-btn {
  grid-column: 3;
  grid-row: 1;
  width: 80px !important;
  min-width: 80px !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-settings-card,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-settings {
  position: relative;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .simple-switch {
  position: relative !important;
  display: inline-block !important;
  flex: none;
  width: 36px !important;
  height: 20px !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  border: 0 !important;
  vertical-align: middle;
  line-height: 0 !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .simple-switch-input {
  position: absolute !important;
  inset: 0;
  z-index: 2;
  width: 36px !important;
  height: 20px !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  padding: 0 !important;
  opacity: 0;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .simple-switch-label {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 36px !important;
  height: 20px !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #d5d9e0 !important;
  background-color: #d5d9e0 !important;
  transition: background .18s;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .simple-switch-label::before,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .simple-switch-label::after {
  display: none !important;
  content: none !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .simple-switch-handle {
  position: absolute !important;
  top: 3px !important;
  left: 3px !important;
  right: auto !important;
  bottom: auto !important;
  z-index: 1;
  width: 14px !important;
  height: 14px !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 50%;
  background: #fff !important;
  background-color: #fff !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .2) !important;
  transform: translateX(0) !important;
  transition: transform .18s;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .simple-switch-input:checked ~ .simple-switch-label {
  border: 0 !important;
  background: var(--cl-green) !important;
  background-color: var(--cl-green) !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .simple-switch-input:checked ~ .simple-switch-handle {
  left: 3px !important;
  transform: translateX(16px) !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .simple-switch:hover .simple-switch-input:not(:disabled) ~ .simple-switch-label {
  border: 0 !important;
  background: #d5d9e0 !important;
  background-color: #d5d9e0 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .simple-switch:hover .simple-switch-input:checked:not(:disabled) ~ .simple-switch-label {
  border: 0 !important;
  background: var(--cl-green) !important;
  background-color: var(--cl-green) !important;
}

/* 비활성 체크박스가 클릭을 막지 않도록 안내 이벤트를 바깥 토글에 전달한다. */
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email .notification-kakao-switch.is-disabled .simple-switch-input:disabled,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email .notification-mail-switch.is-disabled .simple-switch-input:disabled {
  pointer-events: none;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .simple-switch-input:disabled {
  cursor: default;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .simple-switch-input:disabled ~ .simple-switch-label,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .simple-switch.is-disabled .simple-switch-label {
  background: #d6d9dc !important;
  background-color: #d6d9dc !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .simple-switch-input:disabled ~ .simple-switch-handle,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .simple-switch.is-disabled .simple-switch-handle {
  background: #f5f6f8 !important;
  background-color: #f5f6f8 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-row,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-field {
  width: 100% !important;
  box-sizing: border-box;
  margin: 0 0 20px !important;
  padding: 0 !important;
  border: 0 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-row:last-child,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-field:last-child {
  margin-bottom: 0 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-row-title,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-general-head .notification-sms-row-title,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-field > label,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-message-title {
  display: flex !important;
  align-items: center;
  gap: 5px;
  float: none !important;
  width: auto !important;
  margin: 0 0 9px !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  line-height: 20px !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-control,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-field {
  position: relative;
  display: flex !important;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row:not(:has(.notification-kakao-select-wrap)) {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 80px;
  align-items: start;
  gap: 8px;
  width: 100% !important;
  max-width: none !important;
  box-sizing: border-box;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row:not(:has(.notification-kakao-select-wrap)) > .notification-kakao-input,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row:not(:has(.notification-kakao-select-wrap)) > .notification-kakao-input-wrap {
  grid-column: 1;
  grid-row: 1;
  width: 100% !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row:not(:has(.notification-kakao-select-wrap)) > .notification-kakao-btn {
  grid-column: 2;
  grid-row: 1;
  width: 80px !important;
  min-width: 80px !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row.notification-kakao-channel-control,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row.notification-kakao-receiver-control {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 80px;
  align-items: start;
  gap: 8px;
  width: 100% !important;
  max-width: none !important;
  box-sizing: border-box;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row.notification-kakao-channel-control > .notification-kakao-input,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row.notification-kakao-receiver-control > .notification-kakao-input-wrap {
  grid-column: 1;
  grid-row: 1;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row.notification-kakao-channel-control > .notification-kakao-btn,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row.notification-kakao-receiver-control > .notification-kakao-btn {
  grid-column: 2;
  grid-row: 1;
  width: 80px !important;
  min-width: 80px !important;
  max-width: 80px !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row.notification-kakao-fallback-control {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 109px 80px;
  align-items: start;
  gap: 8px;
  width: 100% !important;
  max-width: none !important;
  box-sizing: border-box;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row.notification-kakao-fallback-control .notification-kakao-select-wrap {
  display: grid !important;
  grid-column: 1 / 3;
  grid-template-columns: minmax(0, 1fr) 109px;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row.notification-kakao-fallback-control > .notification-kakao-btn {
  grid-column: 3;
  grid-row: 1;
  width: 80px !important;
  min-width: 80px !important;
  max-width: 80px !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-input-wrap,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-input-wrap,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-input-wrap,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-select-wrap {
  position: relative;
  display: flex !important;
  align-items: center;
  flex: 1 1 0;
  min-width: 0;
  height: 40px !important;
  box-sizing: border-box;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  background: #fff !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-input,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-input,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-input {
  flex: 1 1 auto;
  min-width: 0;
  width: 100% !important;
  height: 38px !important;
  margin: 0 !important;
  padding: 0 13px !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  line-height: 38px !important;
  outline: none !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row > .notification-kakao-input {
  flex: 1 1 0;
  height: 40px !important;
  box-sizing: border-box;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  background: #fff !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-input::placeholder,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-input::placeholder,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-input::placeholder {
  color: var(--cl-text-muted) !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-input-wrap:focus-within,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-input-wrap:focus-within,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-input-wrap:focus-within,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-select-wrap:focus-within,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row > .notification-kakao-input:focus {
  border-color: var(--cl-green) !important;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .12) !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-input-wrap:has(> .notification-mail-email-input[aria-invalid="true"]) {
  border-color: var(--cl-danger) !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-input-wrap:has(> .notification-mail-email-input[aria-invalid="true"]):focus-within {
  box-shadow: 0 0 0 3px rgba(229, 72, 77, .13) !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-input[aria-invalid="true"]::placeholder {
  color: var(--cl-danger) !important;
  opacity: 1;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-selected-display {
  position: static !important;
  inset: auto !important;
  display: flex !important;
  align-items: center;
  gap: 8px;
  min-width: 0;
  width: 100%;
  height: 38px;
  box-sizing: border-box;
  padding: 0 74px 0 13px;
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  line-height: 38px;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-selected-number {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-status {
  flex: none;
  font-size: 12px !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-status.is-available {
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-status.is-unavailable {
  color: var(--cl-danger) !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-count,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-receiver-count,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-receiver-count,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-count {
  position: absolute !important;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--cl-text-muted) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 16px !important;
  pointer-events: none;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-select-wrap::after {
  right: 12px !important;
  border-top-color: var(--cl-text-sub) !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-select-wrap.is-open::after {
  border-bottom-color: var(--cl-green) !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-select-wrap .notification-sms-count {
  right: 28px !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-count-current:not(.is-zero) {
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-action,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-btn,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-add {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  flex: none;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 40px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: var(--cl-green) !important;
  color: #fff !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 18px !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-action.setting-sms-number,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-btn.setting-sms-number {
  background: #eaecef !important;
  color: var(--cl-text-sub) !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-action:hover,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-btn:hover,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-add:hover {
  background: var(--cl-green-hover) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-action.setting-sms-number:hover,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-btn.setting-sms-number:hover {
  background: #dee1e5 !important;
  color: var(--cl-text-sub) !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-action:disabled,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-btn:disabled,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-add:disabled,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-action.is-disabled,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-btn.is-disabled,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-add.is-disabled {
  background: #e6e9ee !important;
  color: var(--cl-text-muted) !important;
  cursor: default !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-help,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-help {
  flex: 1 1 100%;
  margin: -1px 0 0 !important;
  color: var(--cl-text-muted) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 18px !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-field > .notification-kakao-help {
  margin: 7px 0 0 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-help-required-icon {
  margin: 0 4px 0 0 !important;
  color: var(--cl-text-muted) !important;
  fill: currentColor !important;
  vertical-align: -2px;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-receiver-control {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 80px;
  align-items: start !important;
  gap: 8px;
  width: 100% !important;
  max-width: none !important;
  box-sizing: border-box;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-receiver-control .notification-sms-input-wrap {
  grid-column: 1;
  grid-row: 1;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  flex: none !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-receiver-control .notification-sms-action {
  grid-column: 2;
  grid-row: 1;
  width: 80px !important;
  min-width: 80px !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-generalnum-list,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-generalnum-list,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-list {
  display: flex !important;
  flex-wrap: wrap;
  align-content: flex-start;
  gap: 10px;
  flex: 1 1 100%;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  min-height: 120px;
  box-sizing: border-box;
  margin: 4px 0 0 !important;
  padding: 14px !important;
  overflow: auto;
  border: 1px solid var(--cl-border) !important;
  border-radius: 10px !important;
  background: #fff !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-receiver-control .notification-sms-generalnum-list {
  grid-column: 1 / -1;
  grid-row: 2;
  min-height: 120px !important;
  margin-top: 4px !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-field > .notification-kakao-generalnum-list {
  margin-top: 12px !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-generalnum-item,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-generalnum-item,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-item {
  display: inline-flex !important;
  align-items: center;
  gap: 8px;
  max-width: 100%;
  height: 38px !important;
  box-sizing: border-box;
  margin: 0 !important;
  padding: 0 10px 0 14px !important;
  border: 1px solid #cdefdd !important;
  border-radius: 9px !important;
  background: #eaf9f1 !important;
  color: var(--cl-text) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 18px !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-item {
  justify-content: space-between;
  gap: 10px;
  width: 100% !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-item.is-editing {
  display: flex !important;
  align-items: center !important;
  gap: 8px;
  width: 100% !important;
  height: auto !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-actions {
  display: inline-flex !important;
  align-items: center;
  gap: 2px;
  flex: none;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-generalnum-item > span,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-generalnum-item > span,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-item > span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-text {
  flex: 1 1 auto;
  padding: 0;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-generalnum-remove {
  position: static;
  flex: 0 0 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: #e5484d;
  transition: background .12s, color .12s;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-generalnum-remove:hover,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-generalnum-remove:focus-visible {
  background: #fdecee;
  color: #d92d3d;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-generalnum-remove:focus-visible {
  outline: 2px solid #e5484d !important;
  outline-offset: 2px;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-generalnum-remove svg {
  display: block;
  width: 12px;
  height: 12px;
  fill: currentColor;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-actions {
  flex: none;
  min-width: max-content;
  height: auto;
  padding: 0;
  overflow: visible;
  gap: 2px;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-edit,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-delete {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px !important;
  height: 22px !important;
  padding: 0;
  border: 0;
  border-radius: 6px !important;
  background: transparent;
  transition: background .12s, color .12s !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-edit {
  color: var(--cl-text-sub) !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-edit:is(:hover, :focus-visible) {
  background: var(--cl-bg-3) !important;
  color: var(--cl-text-sub) !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-delete {
  color: var(--cl-text-sub) !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-delete:is(:hover, :focus-visible) {
  background: var(--cl-bg-3) !important;
  color: var(--cl-text-sub) !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-edit svg,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-delete svg {
  display: block !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-edit svg {
  width: 16px !important;
  height: 16px !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-delete svg {
  width: 16px !important;
  height: 16px !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-edit svg,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-edit svg path {
  fill: none !important;
  stroke: currentColor !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-delete svg,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-delete:hover svg,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-delete svg path,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-delete:hover svg path {
  fill: none !important;
  stroke: currentColor !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-inline-input {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  height: 38px !important;
  box-sizing: border-box !important;
  padding: 0 12px !important;
  border: 1px solid var(--cl-green) !important;
  border-radius: 8px !important;
  background: #fff !important;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .12) !important;
  color: var(--cl-text) !important;
  font-family: inherit !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  line-height: 38px !important;
  outline: none !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-inline-cancel,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-inline-save {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 38px !important;
  width: 38px !important;
  height: 34px !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 8px !important;
  cursor: pointer !important;
  transition: background .12s, border-color .12s, color .12s !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-inline-cancel {
  border: 1px solid var(--cl-border) !important;
  background: #fff !important;
  color: var(--cl-text-muted) !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-inline-cancel:hover {
  border-color: var(--cl-border) !important;
  background: #f1f2f5 !important;
  color: var(--cl-text) !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-inline-save {
  border: 1px solid var(--cl-green) !important;
  background: var(--cl-green) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-inline-save:hover {
  border-color: var(--cl-green-hover) !important;
  background: var(--cl-green-hover) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-inline-cancel svg,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-inline-save svg {
  display: block !important;
  width: 16px !important;
  height: 16px !important;
  overflow: visible !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-inline-cancel svg path,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-inline-save svg path {
  fill: none !important;
  stroke: currentColor !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

body.cl-dashboard-redesign-page .notification-generalnum-tooltip {
  padding: 6px 9px !important;
  border: 0 !important;
  border-radius: 4px !important;
  background: #2d343e !important;
  box-shadow: 0 4px 12px rgba(20, 24, 32, .16) !important;
  color: #fff !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 17px !important;
}

body.cl-dashboard-redesign-page .notification-generalnum-tooltip::after {
  border: 0 !important;
  background: #2d343e !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-general-row {
  margin-bottom: 0 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-general-head {
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .kaNoticeGeneralTitle,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-general-options {
  display: flex !important;
  align-items: center;
  flex-wrap: wrap;
  gap: 16px 22px;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .newcheckbox {
  float: none !important;
  display: inline-flex !important;
  align-items: center;
  width: auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  opacity: 1 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .newcheckbox label {
  display: inline-flex !important;
  align-items: center;
  gap: 7px;
  margin: 0 !important;
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .newcheckbox.disabled label,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .newcheckbox.disabled label > span {
  color: var(--cl-text-muted) !important;
  cursor: default;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .newcheckboxSvg {
  position: relative !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 16px !important;
  height: 16px !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .newcheckboxSvg input {
  position: absolute !important;
  inset: 0;
  z-index: 2;
  width: 16px !important;
  height: 16px !important;
  margin: 0 !important;
  opacity: 0;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .newcheckboxSvg input:disabled {
  cursor: default;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .newcheckboxSvg svg {
  display: none !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .newcheckboxSvg::before {
  content: "";
  position: absolute;
  inset: 0;
  box-sizing: border-box;
  border: 1.5px solid #c9cdd4;
  border-radius: 4px;
  background: #fff;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 12px 12px;
  pointer-events: none;
  transition: background-color .12s, border-color .12s;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .newcheckboxSvg::after {
  content: "";
  position: absolute;
  display: none;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .newcheckboxSvg:has(input:checked)::before {
  border-color: var(--cl-green);
  background-color: var(--cl-green);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12.5l4.2 4.2L19 6.5' fill='none' stroke='%23ffffff' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .newcheckboxSvg:has(input:checked)::after {
  display: none;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .newcheckbox.disabled .newcheckboxSvg::before,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .newcheckboxSvg:has(input:disabled)::before {
  border-color: #d9dde4;
  background-color: #f4f5f7;
  background-image: none;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .newcheckbox.disabled .newcheckboxSvg:has(input:checked)::before,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .newcheckboxSvg:has(input:disabled:checked)::before {
  border-color: #c9ced6;
  background-color: #c9ced6;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12.5l4.2 4.2L19 6.5' fill='none' stroke='%23ffffff' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .newcheckbox.disabled .newcheckboxSvg::after,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .newcheckboxSvg:has(input:disabled)::after {
  display: none;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-admin-option {
  display: flex !important;
  align-items: center;
  justify-content: flex-start !important;
  gap: 10px;
  width: 100% !important;
  height: auto !important;
  box-sizing: border-box;
  margin: 16px 0 0 !important;
  padding: 16px 0 0 !important;
  border-top: 1px solid var(--cl-line) !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-admin-option > span {
  display: inline-flex !important;
  align-items: center;
  gap: 5px;
  order: 1;
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  line-height: 20px !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-admin-option .simple-switch {
  order: 2;
  margin-left: auto !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-settings-divider {
  display: none !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-link.template-button {
  display: inline-flex !important;
  align-items: center;
  gap: 3px;
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--cl-green-text) !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  line-height: 20px !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-link.template-button svg {
  width: 10px !important;
  height: 10px !important;
  color: var(--cl-green) !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-points,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-point-group,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-point-group-body {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-message-title + .notification-kakao-points {
  margin-top: 6px !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .setting-kakaoNoticePoint {
  display: flex !important;
  align-items: center;
  width: 100%;
  min-height: 0 !important;
  box-sizing: border-box;
  margin: 0 !important;
  padding: 13px 4px !important;
  border: 0 !important;
  border-top: 1px solid var(--cl-line) !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .setting-kakaoNoticePoint:first-child {
  border-top: 0 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .kaNoticePointTitle {
  flex: 1 1 auto;
  min-width: 0;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  line-height: 20px !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .kaNoticePointTitle span {
  color: inherit !important;
  font: inherit !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .kaNoticePointLists {
  display: flex !important;
  align-items: center;
  justify-content: flex-end;
  flex: 0 0 190px;
  gap: 22px;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .settingBtnSaveWrap {
  position: static !important;
  display: flex !important;
  justify-content: flex-end;
  width: 100% !important;
  box-sizing: border-box;
  margin: 0 !important;
  padding: 22px 28px 28px !important;
  overflow: visible !important;
  border: 0 !important;
  background: #fff !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy):not(.notification-kakao-active):not(.notification-mail-active) .settingBtnSaveWrap {
  display: none !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy).notification-mail-active.notification-mail-save-hidden .settingBtnSaveWrap,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy).notification-mail-active.notification-mail-save-hidden > .setting-saveMobile {
  display: none !important;
}

body.cl-dashboard-redesign-page .dashbottom-container.kakao-wrap-width:has(.shopping-dashboard.setting-email:not(.setting-email-legacy).notification-mail-active.notification-mail-save-hidden) .notification-mobile-title .setting-saveMobile {
  display: none !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .settingBtnSaveWrap .setting-button,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .settingBtnSaveWrap .kakao-btn-bottom {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: auto !important;
  min-width: 92px !important;
  max-width: none !important;
  height: 44px !important;
  margin: 0 !important;
  padding: 0 34px !important;
  border: 0 !important;
  border-radius: 9px !important;
  background: var(--cl-green) !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  line-height: 20px !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .settingBtnSaveWrap .setting-button:hover,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .settingBtnSaveWrap .kakao-btn-bottom:hover {
  background: var(--cl-green-hover) !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .pc-setting-btn.is-saving,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .pc-setting-btn:disabled {
  cursor: default !important;
  opacity: .58 !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-select-wrap.is-disabled,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-channel-locked,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-sender-locked {
  opacity: .56;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-general-options.notification-sms-sender-locked {
  opacity: 1;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-general-options.notification-sms-sender-locked .newcheckbox.disabled label,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-general-options.notification-sms-sender-locked .newcheckbox.disabled label > span {
  color: #a6acb6 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-general-options.notification-sms-sender-locked .newcheckbox.disabled .newcheckboxSvg::before,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-general-options.notification-sms-sender-locked .newcheckboxSvg:has(input:disabled)::before {
  border-color: #d5d9e0;
  background: #f8f9fb;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-dropdown {
  top: calc(100% + 6px) !important;
  right: 0 !important;
  left: 0 !important;
  z-index: 20;
  overflow: hidden;
  border: 1px solid var(--cl-border) !important;
  border-radius: 10px !important;
  background: #fff !important;
  box-shadow: var(--cl-shadow-drop) !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-option-row {
  display: flex !important;
  align-items: center;
  width: 100%;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-option {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  flex: 1 1 auto;
  min-width: 0;
  height: 40px !important;
  margin: 0 !important;
  padding: 0 12px !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--cl-text) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  text-align: left;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-option:hover,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-option.is-selected {
  background: var(--cl-green-tint) !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-home .setting-subInfoBox,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-home .setting-sub-content,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-home .setting-text-box {
  float: none !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-member-smtp {
  width: 100%;
  min-width: 0;
  max-width: none;
  margin: 0 0 24px;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-member-smtp .mng-panel {
  display: flex;
  flex-direction: column;
  gap: 9px;
  width: 100%;
  min-width: 0;
  margin: 0;
  padding: 0;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-member-smtp .mng-panel > :is(.mng-panel-label, .mng-panel-body) {
  float: none;
  flex: none;
  width: 100%;
  min-width: 0;
  max-width: none;
  margin: 0 !important;
  padding: 0;
}

.cl-dashboard-redesign#notification-mail-home .notification-mail-member-smtp .mng-panel-label {
  gap: 5px;
}

.cl-dashboard-redesign#notification-mail-home .notification-mail-member-smtp .smtp-tooltip {
  flex: none;
  width: 15px;
  height: 15px;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-member-smtp .email-smtp-settings {
  width: 100%;
  min-width: 0;
  margin: 0;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-member-smtp .email-smtp-settings__content {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-width: 0;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-member-smtp .email-smtp-settings__content > div:first-child {
  flex: 1 1 0;
  width: auto;
  min-width: 0;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-member-smtp .email-smtp-settings__content-input {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  height: 40px;
  margin: 0;
  padding: 0 13px;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
  font-size: 13.5px;
  line-height: normal;
  text-overflow: ellipsis;
}

.cl-dashboard-redesign#notification-mail-home .email-smtp-settings__content-input:not(.disabled) {
  color: var(--cl-text);
}

.cl-dashboard-redesign#notification-mail-home .email-smtp-settings__content-input::placeholder {
  color: var(--cl-text-muted) !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-member-smtp .email-smtp-settings__content-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: auto;
  height: 40px;
  margin: 0;
  padding: 0 16px;
  border: 0;
  border-radius: 8px;
  background: var(--cl-green);
  color: #fff;
  font: inherit;
  font-size: 13px;
  font-weight: 600;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-member-smtp .email-smtp-settings__content-btn:not(.disabled):hover {
  background: var(--cl-green-hover);
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-detail {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #fff !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-detail.is-disabled {
  opacity: .45;
  pointer-events: none;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-control,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-field {
  width: 100% !important;
  max-width: none !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-home .setting-sub-content.notification-mail-address-source {
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-home .setting-subInfoBox.notification-mail-points-source {
  margin: 22px 0 0 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-field {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 80px;
  align-items: start;
  flex-wrap: nowrap;
  gap: 8px;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-input-wrap {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-add {
  width: 80px !important;
  min-width: 80px !important;
  max-width: 80px !important;
  padding: 0 !important;
  font-weight: 600 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-email-list {
  min-height: 200px !important;
  margin-top: 12px !important;
}

@media (max-width: 600px) {
  .cl-dashboard-redesign#notification-mail-home .notification-mail-email-list {
    min-height: 120px !important;
  }
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-home .setting-sub-content-title,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-points-source > .setting-sub-title {
  margin: 0 0 9px !important;
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  line-height: normal !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-block-guide {
  display: flex !important;
  align-items: flex-start;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  box-sizing: border-box;
  gap: 8px;
  margin: 20px 0 0 !important;
  padding: 16px 18px !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: #fdf2f4 !important;
  color: #97565f !important;
  font-size: 12.5px !important;
  line-height: 1.6 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-block-guide-icon {
  flex: 0 0 16px;
  width: 16px !important;
  height: 16px !important;
  margin-top: 2px;
  color: var(--cl-danger) !important;
  fill: currentColor !important;
  stroke: none !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-block-guide-icon path,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-block-guide-icon rect {
  fill: currentColor !important;
  stroke: none !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-block-guide p {
  flex: 1 1 auto;
  min-width: 0;
  max-width: 100%;
  margin: 0 !important;
  padding: 0 !important;
  color: inherit;
  overflow-wrap: anywhere;
  word-break: keep-all;
}

@media (max-width: 432px) {
  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-points-source,
  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-points-source > .setting-sub-content,
  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-block-guide {
    min-width: 0 !important;
    max-width: 100% !important;
  }

  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-block-guide {
    gap: 6px;
    padding: 14px !important;
  }
}

/* 메일 설정은 v2 알림 섹션과 같은 3열 구조를 사용한다. */
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) #notification-mail-home.notification-mail-v2-section {
  --cl-mail-blue: #2f6bff;
  --cl-mail-blue-soft: #f3f9ff;
  --cl-mail-blue-line: #cfe6ff;
  grid-template-columns: 210px minmax(0, 1fr) 36px;
  column-gap: 14px;
  row-gap: 0;
  align-items: start;
  min-height: 96px;
  padding: 24px 28px 28px !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) #notification-mail-home .notification-mail-toggle-row {
  display: contents !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) #notification-mail-home .notification-mail-title {
  grid-column: 1;
  grid-row: 1;
  display: flex;
  align-items: center;
  gap: 11px;
  min-width: 0;
  color: var(--cl-text) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 20px !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) #notification-mail-home .notification-mail-icon {
  flex: none;
  width: 18px;
  height: 18px;
  color: var(--cl-mail-blue);
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) #notification-mail-home .notification-mail-email-item:not(.is-editing) {
  border-color: var(--cl-mail-blue-line) !important;
  background: var(--cl-mail-blue-soft) !important;
}

.cl-dashboard-redesign#notification-mail-home .notification-mail-email-count .notification-count-current {
  color: inherit !important;
}

.cl-dashboard-redesign#notification-mail-home .notification-mail-email-input {
  /* 개수 카운터는 입력 값과 겹치지 않도록 별도 공간을 확보한다. */
  padding-right: 48px !important;
  font-weight: 400 !important;
}

.cl-dashboard-redesign#notification-mail-home .notification-mail-points-source {
  --cl-mail-option-width: 92px;
}

.cl-dashboard-redesign#notification-mail-home .notification-mail-points-source .notification-kakao-message-title {
  font-size: 15px !important;
  font-weight: 600 !important;
  line-height: normal !important;
}

.cl-dashboard-redesign#notification-mail-home .notification-mail-points-source .notification-point-group {
  margin-top: 6px !important;
}

.cl-dashboard-redesign#notification-mail-home .notification-mail-points-source .setting-kakaoNoticePoint {
  flex-direction: row;
  align-items: center;
  gap: 0;
}

.cl-dashboard-redesign#notification-mail-home .notification-mail-points-source .kaNoticePointTitle {
  font-weight: 400 !important;
  line-height: normal !important;
}

.cl-dashboard-redesign#notification-mail-home .notification-mail-points-source .kaNoticePointLists {
  flex: 0 0 calc(var(--cl-mail-option-width) * 2);
  justify-content: flex-start;
  gap: 0;
}

.cl-dashboard-redesign#notification-mail-home .notification-mail-points-source .kaNoticePointLists > .newcheckbox {
  flex: 0 0 var(--cl-mail-option-width);
  min-height: 0;
}

.cl-dashboard-redesign#notification-mail-home .notification-mail-points-source .newcheckbox label {
  font-size: 13px !important;
  line-height: normal !important;
}

.cl-dashboard-redesign#notification-mail-home .notification-mail-points-source .newcheckbox label > span {
  color: inherit;
  font: inherit;
}

@media (max-width: 600px) {
  .cl-dashboard-redesign#notification-mail-home .notification-mail-points-source {
    --cl-mail-option-width: 78px;
  }
}

@media (pointer: coarse) {
  .cl-dashboard-redesign#notification-mail-home .notification-mail-points-source .setting-kakaoNoticePoint {
    padding: 0 4px !important;
  }

  .cl-dashboard-redesign#notification-mail-home .notification-mail-points-source .newcheckbox label {
    min-height: 44px;
  }
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) #notification-mail-home :is(.notification-mail-email-edit, .notification-mail-email-delete) {
  color: var(--cl-text-sub) !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) #notification-mail-home .notification-mail-description {
  display: none;
  grid-column: 2;
  grid-row: 1;
  min-width: 0;
  color: var(--cl-text-sub);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 1.6;
  width: 100%;
  text-align: right;
  word-break: keep-all;
  overflow-wrap: break-word;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) #notification-mail-home.is-collapsed .notification-mail-description {
  display: block;
  flex: 1 1 auto;
  width: auto;
  text-align: left;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) #notification-mail-home .notification-mail-switch {
  grid-column: 3;
  grid-row: 1;
  align-self: start;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) #notification-mail-home:not(.is-collapsed) :is(.notification-mail-title, .notification-mail-switch) {
  align-self: center;
}

.cl-dashboard-redesign#notification-mail-home .notification-mail-heading {
  grid-column: 2;
  grid-row: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
  min-width: 0;
}
.cl-dashboard-redesign#notification-mail-home.is-collapsed .notification-mail-heading {
  flex-direction: row;
  align-items: flex-start;
  gap: 14px;
}
.cl-dashboard-redesign#notification-mail-home.is-collapsed .notification-mail-guide {
  white-space: nowrap;
}
.cl-dashboard-redesign#notification-mail-home .notification-mail-guide {
  display: inline-flex;
  flex: none;
  align-items: baseline;
  gap: 3px;
  min-height: 20px;
  color: var(--cl-green-text);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.6;
  text-decoration: none;
}
.cl-dashboard-redesign#notification-mail-home:not(.is-collapsed) .notification-mail-heading {
  align-self: center;
}
.cl-dashboard-redesign#notification-mail-home:not(.is-collapsed) .notification-mail-guide {
  align-items: center;
}
.cl-dashboard-redesign#notification-mail-home .notification-mail-guide svg {
  width: 12px;
  height: 12px;
}
.cl-dashboard-redesign#notification-mail-home .notification-mail-guide:hover {
  text-decoration: underline;
  text-underline-offset: 3px;
}
.cl-dashboard-redesign#notification-mail-home :is(.notification-mail-guide, .email-smtp-settings__content-btn):focus-visible {
  outline: 2px solid var(--cl-green);
  outline-offset: 3px;
}
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) #notification-mail-home .notification-mail-member-smtp {
  grid-column: 2;
  grid-row: 2;
  margin: 20px 0 22px;
}
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) #notification-mail-home.is-collapsed .notification-mail-member-smtp {
  display: none;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) #notification-mail-home .notification-mail-detail {
  grid-column: 2;
  grid-row: 3;
  width: 100% !important;
  min-width: 0;
  margin: 0 !important;
}

@media (max-width: 768px) {
  body.cl-dashboard-redesign-page .dashbottom-wrap .dashbottom-container.kakao-wrap-width:has(.shopping-dashboard.setting-email:not(.setting-email-legacy)) {
    max-width: none !important;
  }

  body.cl-dashboard-redesign-page .dashbottom-container.kakao-wrap-width > .cl-source-notification-head {
    max-width: none;
    margin-bottom: 20px;
  }

  body.cl-dashboard-redesign-page .dashbottom-container.kakao-wrap-width > .cl-source-notification-layout {
    flex-direction: column;
    gap: 18px;
    max-width: none;
  }

  body.cl-dashboard-redesign-page .dashbottom-container.kakao-wrap-width .cl-source-notification-main,
  body.cl-dashboard-redesign-page .dashbottom-container.kakao-wrap-width .cl-source-notification-guide {
    width: 100%;
    max-width: none;
  }

  body.cl-dashboard-redesign-page .dashbottom-container.kakao-wrap-width .cl-source-notification-main {
    /* 세로 배치에서는 PC용 flex-basis가 패널 높이를 제한하지 않도록 한다. */
    flex: none;
  }

  body.cl-dashboard-redesign-page .dashbottom-container.kakao-wrap-width .cl-source-notification-guide {
    position: static;
  }

  body.cl-dashboard-redesign-page .dashbottom-container.kakao-wrap-width .cl-source-notification-main > .notification-tabs-wrap,
  body.cl-dashboard-redesign-page .dashbottom-container.kakao-wrap-width > .notification-tabs-wrap {
    max-width: none;
    margin-right: 16px !important;
    margin-left: 16px !important;
    padding: 0 !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }

  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) #notification-talk-home,
  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) #notification-mail-home {
    padding: 20px 16px 22px !important;
  }

  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) #notification-mail-home.notification-mail-v2-section {
    grid-template-columns: minmax(0, 1fr) 36px;
    row-gap: 0;
    padding: 20px 16px 22px !important;
  }

  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) #notification-mail-home .notification-mail-title {
    grid-column: 1;
    grid-row: 1;
  }

  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) #notification-mail-home .notification-mail-switch {
    grid-column: 2;
    grid-row: 1;
  }

  .cl-dashboard-redesign#notification-mail-home .notification-mail-heading {
    grid-column: 1 / -1;
    grid-row: 2;
    margin-top: 8px;
  }

  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) #notification-mail-home.notification-mail-v2-section:not(.is-collapsed) {
    grid-template-columns: minmax(0, 1fr) max-content 36px;
    column-gap: clamp(6px, 2vw, 14px);
  }

  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) #notification-mail-home:not(.is-collapsed) .notification-mail-title {
    gap: 8px;
  }

  .cl-dashboard-redesign#notification-mail-home:not(.is-collapsed) .notification-mail-title > span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) #notification-mail-home:not(.is-collapsed) .notification-mail-switch {
    grid-column: 3;
    grid-row: 1;
  }

  .cl-dashboard-redesign#notification-mail-home:not(.is-collapsed) .notification-mail-heading {
    grid-column: 2;
    grid-row: 1;
    margin-top: 0;
  }

  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) #notification-mail-home .notification-mail-member-smtp {
    grid-column: 1 / -1;
    grid-row: 3;
  }

  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) #notification-mail-home .notification-mail-detail {
    grid-column: 1 / -1;
    grid-row: 4;
  }

  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy).notification-kakao-active #notification-talk-home {
    padding-bottom: 0 !important;
  }

  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-home-head,
  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-mail-toggle-row,
  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-point-summary {
    align-items: flex-start;
    flex-wrap: wrap;
  }

  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .connect-guide.notification-mail-guide {
    width: 100% !important;
    margin-left: 0 !important;
  }

  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-point-actions {
    width: 100%;
    margin-left: 0 !important;
  }

  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-point-actions .friends-btn,
  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-point-actions .notification-outline-btn,
  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-point-actions .notification-blue-btn {
    flex: 1 1 auto;
    padding: 0 10px !important;
  }

  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-card,
  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-settings-card,
  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-settings {
    padding: 20px 16px 22px !important;
  }

  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-switch-row,
  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-switch-row {
    top: 20px;
    right: 16px;
  }

  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-control:not(.notification-sms-receiver-control),
  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row {
    display: flex !important;
    align-items: stretch;
    flex-direction: column;
  }

  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-input-wrap,
  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-input-wrap,
  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-select-wrap,
  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row > .notification-kakao-input,
  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-action,
  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-btn {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
  }

  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .setting-kakaoNoticePoint {
    align-items: flex-start;
    flex-direction: column;
    gap: 10px;
  }

  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .kaNoticePointLists {
    justify-content: flex-start;
    flex: 0 0 auto;
    width: 100% !important;
  }

  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row.notification-kakao-channel-control,
  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row.notification-kakao-receiver-control,
  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row.notification-kakao-fallback-control {
    display: flex !important;
    align-items: stretch;
    flex-direction: column;
  }

  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row.notification-kakao-channel-control > .notification-kakao-input,
  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row.notification-kakao-receiver-control > .notification-kakao-input-wrap,
  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row.notification-kakao-channel-control > .notification-kakao-btn,
  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row.notification-kakao-receiver-control > .notification-kakao-btn,
  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row.notification-kakao-fallback-control > .notification-kakao-btn {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
  }

  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row.notification-kakao-channel-control > .notification-kakao-input {
    flex: none;
  }

  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row:has(.notification-kakao-select-wrap) {
    display: flex !important;
    align-items: stretch;
    flex-direction: column;
  }

  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row:has(.notification-kakao-select-wrap) .notification-kakao-btn {
    align-self: flex-start;
    width: 80px !important;
    min-width: 80px !important;
    max-width: 80px !important;
  }

  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .settingBtnSaveWrap {
    padding: 18px 16px 22px !important;
  }

  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .settingBtnSaveWrap .setting-button,
  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .settingBtnSaveWrap .kakao-btn-bottom {
    width: 100% !important;
  }
}

:root {
  --cl-green-action: #03c75a;
  --cl-green: #03C75A;
  --cl-green-text: #13B059;
  --cl-green-hover: #02b351;
  --cl-green-soft: #eaf9f1;
  --cl-green-tint: #f3fcf7;
  --cl-green-line: #cdefdd;
  --cl-green-badge: #e4f7ec;
  --cl-accent-blue: #03C75A;
  --cl-blue-help: #4789e7;
  --cl-page-bg: #f4f5f9;
  --cl-surface: #fff;
  --cl-border: #e5e7eb;
  --cl-border-hover: #d5d9e0;
  --cl-line: #eef0f4;
  --cl-bg-subtle: #fafbfc;
  --cl-bg-2: #fafbfc;
  --cl-bg-3: #f1f2f5;
  --cl-text: #222428;
  --cl-text-sub: #8a8f98;
  --cl-text-muted: #b4b8bf;
  --cl-danger: #e5484d;
  --cl-danger-soft: #fdecee;
  --cl-card-danger: #9cacc3;
  --cl-card-danger-text: #8897ab;
  --cl-radius-sm: 6px;
  --cl-radius-md: 10px;
  --cl-radius-lg: 14px;
  --cl-shadow-card: 0 1px 2px rgba(20, 24, 32, .04), 0 4px 10px rgba(20, 24, 32, .06);
  --cl-shadow-panel: 0 1px 3px rgba(20, 24, 32, .05);
  --cl-shadow-drop: 0 12px 34px rgba(20, 24, 32, .17);
  --cl-content-max: 1240px;
  --cl-content-pad: 32px;
  --cl-source-font: "CreatorlinkSansKR", "Apple SD Gothic Neo", "Malgun Gothic", -apple-system, BlinkMacSystemFont, sans-serif;
  --cl-font: var(--cl-source-font);
  --cl-motion-fast: .12s;
}

body.cl-dashboard-redesign-page {
  background: var(--cl-page-bg);
  color: var(--cl-text);
  font-family: var(--cl-source-font) !important;
  letter-spacing: 0;
}

/* 모든 대시보드의 카드·고정 표 위에 표시하고, 모달·메뉴 레이어 아래에 둔다. */
body.cl-dashboard-redesign-page #goto-top-m,
body.cl-dashboard-redesign-page #goto-top-s {
  z-index: 1030;
}


body.cl-dashboard-redesign-page:not(.cl-source-product-detail-frame) *,
body.cl-source-product-detail-frame .cl-source-product-add-modal *,
body.cl-source-product-detail-frame .cl-source-product-workflow-wrap * {
  font-family: var(--cl-source-font) !important;
  letter-spacing: 0;
}

body.cl-dashboard-redesign-page .btn-primary,
body.cl-dashboard-redesign-page .btn.btn-primary {
  background: var(--cl-green) !important;
  border-color: var(--cl-green) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .btn-primary:hover,
body.cl-dashboard-redesign-page .btn-primary:focus,
body.cl-dashboard-redesign-page .btn.btn-primary:hover,
body.cl-dashboard-redesign-page .btn.btn-primary:focus {
  background: var(--cl-green-hover) !important;
  border-color: var(--cl-green-hover) !important;
  color: #fff !important;
}

html:has(body.cl-dashboard-redesign-page)::-webkit-scrollbar,
body.cl-dashboard-redesign-page::-webkit-scrollbar,
body.cl-dashboard-redesign-page *::-webkit-scrollbar {
  width: 9px;
  height: 9px;
}

html:has(body.cl-dashboard-redesign-page)::-webkit-scrollbar-thumb,
body.cl-dashboard-redesign-page::-webkit-scrollbar-thumb,
body.cl-dashboard-redesign-page *::-webkit-scrollbar-thumb {
  background: #d1d3d5;
  border: 2px solid transparent;
  border-radius: 6px;
  background-clip: padding-box;
}

html:has(body.cl-dashboard-redesign-page)::-webkit-scrollbar-thumb:hover,
body.cl-dashboard-redesign-page::-webkit-scrollbar-thumb:hover,
body.cl-dashboard-redesign-page *::-webkit-scrollbar-thumb:hover {
  background: #d1d3d5;
}

html:has(body.cl-dashboard-redesign-page)::-webkit-scrollbar-button,
body.cl-dashboard-redesign-page::-webkit-scrollbar-button,
body.cl-dashboard-redesign-page *::-webkit-scrollbar-button {
  display: none !important;
  width: 0 !important;
  min-width: 0 !important;
  max-width: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  max-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}

html:has(body.cl-dashboard-redesign-page)::-webkit-scrollbar-button:single-button,
body.cl-dashboard-redesign-page::-webkit-scrollbar-button:single-button,
body.cl-dashboard-redesign-page *::-webkit-scrollbar-button:single-button,
html:has(body.cl-dashboard-redesign-page)::-webkit-scrollbar-button:double-button,
body.cl-dashboard-redesign-page::-webkit-scrollbar-button:double-button,
body.cl-dashboard-redesign-page *::-webkit-scrollbar-button:double-button,
html:has(body.cl-dashboard-redesign-page)::-webkit-scrollbar-button:start,
body.cl-dashboard-redesign-page::-webkit-scrollbar-button:start,
body.cl-dashboard-redesign-page *::-webkit-scrollbar-button:start,
html:has(body.cl-dashboard-redesign-page)::-webkit-scrollbar-button:end,
body.cl-dashboard-redesign-page::-webkit-scrollbar-button:end,
body.cl-dashboard-redesign-page *::-webkit-scrollbar-button:end,
html:has(body.cl-dashboard-redesign-page)::-webkit-scrollbar-button:start:decrement,
body.cl-dashboard-redesign-page::-webkit-scrollbar-button:start:decrement,
body.cl-dashboard-redesign-page *::-webkit-scrollbar-button:start:decrement,
html:has(body.cl-dashboard-redesign-page)::-webkit-scrollbar-button:end:increment,
body.cl-dashboard-redesign-page::-webkit-scrollbar-button:end:increment,
body.cl-dashboard-redesign-page *::-webkit-scrollbar-button:end:increment,
html:has(body.cl-dashboard-redesign-page)::-webkit-scrollbar-button:decrement,
body.cl-dashboard-redesign-page::-webkit-scrollbar-button:decrement,
body.cl-dashboard-redesign-page *::-webkit-scrollbar-button:decrement,
html:has(body.cl-dashboard-redesign-page)::-webkit-scrollbar-button:increment,
body.cl-dashboard-redesign-page::-webkit-scrollbar-button:increment,
body.cl-dashboard-redesign-page *::-webkit-scrollbar-button:increment,
html:has(body.cl-dashboard-redesign-page)::-webkit-scrollbar-button:vertical:decrement,
body.cl-dashboard-redesign-page::-webkit-scrollbar-button:vertical:decrement,
body.cl-dashboard-redesign-page *::-webkit-scrollbar-button:vertical:decrement,
html:has(body.cl-dashboard-redesign-page)::-webkit-scrollbar-button:vertical:increment,
body.cl-dashboard-redesign-page::-webkit-scrollbar-button:vertical:increment,
body.cl-dashboard-redesign-page *::-webkit-scrollbar-button:vertical:increment,
html:has(body.cl-dashboard-redesign-page)::-webkit-scrollbar-button:vertical:start:decrement,
body.cl-dashboard-redesign-page::-webkit-scrollbar-button:vertical:start:decrement,
body.cl-dashboard-redesign-page *::-webkit-scrollbar-button:vertical:start:decrement,
html:has(body.cl-dashboard-redesign-page)::-webkit-scrollbar-button:vertical:end:increment,
body.cl-dashboard-redesign-page::-webkit-scrollbar-button:vertical:end:increment,
body.cl-dashboard-redesign-page *::-webkit-scrollbar-button:vertical:end:increment {
  display: none !important;
  width: 0 !important;
  min-width: 0 !important;
  max-width: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  max-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}

body.cl-dashboard-redesign-page::-webkit-scrollbar-button,
body.cl-dashboard-redesign-page *::-webkit-scrollbar-button,
body.cl-dashboard-redesign-page::-webkit-scrollbar-button:single-button,
body.cl-dashboard-redesign-page *::-webkit-scrollbar-button:single-button,
body.cl-dashboard-redesign-page::-webkit-scrollbar-button:double-button,
body.cl-dashboard-redesign-page *::-webkit-scrollbar-button:double-button,
body.cl-dashboard-redesign-page::-webkit-scrollbar-button:start,
body.cl-dashboard-redesign-page *::-webkit-scrollbar-button:start,
body.cl-dashboard-redesign-page::-webkit-scrollbar-button:end,
body.cl-dashboard-redesign-page *::-webkit-scrollbar-button:end,
body.cl-dashboard-redesign-page::-webkit-scrollbar-button:start:decrement,
body.cl-dashboard-redesign-page *::-webkit-scrollbar-button:start:decrement,
body.cl-dashboard-redesign-page::-webkit-scrollbar-button:end:increment,
body.cl-dashboard-redesign-page *::-webkit-scrollbar-button:end:increment,
body.cl-dashboard-redesign-page::-webkit-scrollbar-button:decrement,
body.cl-dashboard-redesign-page *::-webkit-scrollbar-button:decrement,
body.cl-dashboard-redesign-page::-webkit-scrollbar-button:increment,
body.cl-dashboard-redesign-page *::-webkit-scrollbar-button:increment,
body.cl-dashboard-redesign-page::-webkit-scrollbar-button:vertical:decrement,
body.cl-dashboard-redesign-page *::-webkit-scrollbar-button:vertical:decrement,
body.cl-dashboard-redesign-page::-webkit-scrollbar-button:vertical:increment,
body.cl-dashboard-redesign-page *::-webkit-scrollbar-button:vertical:increment,
body.cl-dashboard-redesign-page::-webkit-scrollbar-button:vertical:start:decrement,
body.cl-dashboard-redesign-page *::-webkit-scrollbar-button:vertical:start:decrement,
body.cl-dashboard-redesign-page::-webkit-scrollbar-button:vertical:end:increment,
body.cl-dashboard-redesign-page *::-webkit-scrollbar-button:vertical:end:increment,
body.cl-dashboard-redesign-page [class*="modal"]::-webkit-scrollbar-button,
body.cl-dashboard-redesign-page [class*="modal"] *::-webkit-scrollbar-button,
body.cl-dashboard-redesign-page [id*="modal"]::-webkit-scrollbar-button,
body.cl-dashboard-redesign-page [id*="modal"] *::-webkit-scrollbar-button,
body.cl-dashboard-redesign-page .guide-wrap::-webkit-scrollbar-button,
body.cl-dashboard-redesign-page .guide-wrap *::-webkit-scrollbar-button,
body.cl-dashboard-redesign-page .domain-buy-form-wrap::-webkit-scrollbar-button,
body.cl-dashboard-redesign-page .domain-buy-form-wrap *::-webkit-scrollbar-button {
  display: none !important;
  width: 0 !important;
  min-width: 0 !important;
  max-width: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  max-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}

html:has(body.cl-dashboard-redesign-page),
body.cl-dashboard-redesign-page,
body.cl-dashboard-redesign-page * {
  scrollbar-width: thin;
  scrollbar-color: #d1d3d5 transparent;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-dialog,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-content,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-body,
body.cl-dashboard-redesign-page #billingCardModalRoot,
body.cl-dashboard-redesign-page #billingCardModalRoot .modal-content,
body.cl-dashboard-redesign-page #billingCardModalRoot .modal-body,
body.cl-dashboard-redesign-page .cl-source-social-guide-modal,
body.cl-dashboard-redesign-page .cl-source-social-guide-modal .modal-content,
body.cl-dashboard-redesign-page .cl-source-social-guide-modal .modal-body,
body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guide-wrap,
body.cl-dashboard-redesign-page .cl-source-uadmin-modal,
body.cl-dashboard-redesign-page .cl-source-uadmin-modal .modal-content,
body.cl-dashboard-redesign-page .cl-source-uadmin-modal .modal-body {
  scrollbar-width: thin !important;
  scrollbar-color: #d1d3d5 transparent !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal::-webkit-scrollbar,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default::-webkit-scrollbar,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-dialog::-webkit-scrollbar,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-content::-webkit-scrollbar,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-body::-webkit-scrollbar,
body.cl-dashboard-redesign-page #billingCardModalRoot::-webkit-scrollbar,
body.cl-dashboard-redesign-page #billingCardModalRoot .modal-content::-webkit-scrollbar,
body.cl-dashboard-redesign-page #billingCardModalRoot .modal-body::-webkit-scrollbar,
body.cl-dashboard-redesign-page .cl-source-social-guide-modal::-webkit-scrollbar,
body.cl-dashboard-redesign-page .cl-source-social-guide-modal .modal-content::-webkit-scrollbar,
body.cl-dashboard-redesign-page .cl-source-social-guide-modal .modal-body::-webkit-scrollbar,
body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guide-wrap::-webkit-scrollbar,
body.cl-dashboard-redesign-page .cl-source-uadmin-modal::-webkit-scrollbar,
body.cl-dashboard-redesign-page .cl-source-uadmin-modal .modal-content::-webkit-scrollbar,
body.cl-dashboard-redesign-page .cl-source-uadmin-modal .modal-body::-webkit-scrollbar {
  width: 9px !important;
  height: 9px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal::-webkit-scrollbar-thumb,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default::-webkit-scrollbar-thumb,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-dialog::-webkit-scrollbar-thumb,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-content::-webkit-scrollbar-thumb,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-body::-webkit-scrollbar-thumb,
body.cl-dashboard-redesign-page #billingCardModalRoot::-webkit-scrollbar-thumb,
body.cl-dashboard-redesign-page #billingCardModalRoot .modal-content::-webkit-scrollbar-thumb,
body.cl-dashboard-redesign-page #billingCardModalRoot .modal-body::-webkit-scrollbar-thumb,
body.cl-dashboard-redesign-page .cl-source-social-guide-modal::-webkit-scrollbar-thumb,
body.cl-dashboard-redesign-page .cl-source-social-guide-modal .modal-content::-webkit-scrollbar-thumb,
body.cl-dashboard-redesign-page .cl-source-social-guide-modal .modal-body::-webkit-scrollbar-thumb,
body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guide-wrap::-webkit-scrollbar-thumb,
body.cl-dashboard-redesign-page .cl-source-uadmin-modal::-webkit-scrollbar-thumb,
body.cl-dashboard-redesign-page .cl-source-uadmin-modal .modal-content::-webkit-scrollbar-thumb,
body.cl-dashboard-redesign-page .cl-source-uadmin-modal .modal-body::-webkit-scrollbar-thumb {
  background: #d1d3d5 !important;
  border: 2px solid transparent !important;
  border-radius: 6px !important;
  background-clip: padding-box !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal::-webkit-scrollbar-thumb:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default::-webkit-scrollbar-thumb:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-dialog::-webkit-scrollbar-thumb:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-content::-webkit-scrollbar-thumb:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-body::-webkit-scrollbar-thumb:hover,
body.cl-dashboard-redesign-page #billingCardModalRoot::-webkit-scrollbar-thumb:hover,
body.cl-dashboard-redesign-page #billingCardModalRoot .modal-content::-webkit-scrollbar-thumb:hover,
body.cl-dashboard-redesign-page #billingCardModalRoot .modal-body::-webkit-scrollbar-thumb:hover,
body.cl-dashboard-redesign-page .cl-source-social-guide-modal::-webkit-scrollbar-thumb:hover,
body.cl-dashboard-redesign-page .cl-source-social-guide-modal .modal-content::-webkit-scrollbar-thumb:hover,
body.cl-dashboard-redesign-page .cl-source-social-guide-modal .modal-body::-webkit-scrollbar-thumb:hover,
body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guide-wrap::-webkit-scrollbar-thumb:hover,
body.cl-dashboard-redesign-page .cl-source-uadmin-modal::-webkit-scrollbar-thumb:hover,
body.cl-dashboard-redesign-page .cl-source-uadmin-modal .modal-content::-webkit-scrollbar-thumb:hover,
body.cl-dashboard-redesign-page .cl-source-uadmin-modal .modal-body::-webkit-scrollbar-thumb:hover {
  background: #d1d3d5 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal::-webkit-scrollbar-track,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default::-webkit-scrollbar-track,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-dialog::-webkit-scrollbar-track,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-content::-webkit-scrollbar-track,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-body::-webkit-scrollbar-track,
body.cl-dashboard-redesign-page #billingCardModalRoot::-webkit-scrollbar-track,
body.cl-dashboard-redesign-page #billingCardModalRoot .modal-content::-webkit-scrollbar-track,
body.cl-dashboard-redesign-page #billingCardModalRoot .modal-body::-webkit-scrollbar-track,
body.cl-dashboard-redesign-page .cl-source-social-guide-modal::-webkit-scrollbar-track,
body.cl-dashboard-redesign-page .cl-source-social-guide-modal .modal-content::-webkit-scrollbar-track,
body.cl-dashboard-redesign-page .cl-source-social-guide-modal .modal-body::-webkit-scrollbar-track,
body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guide-wrap::-webkit-scrollbar-track,
body.cl-dashboard-redesign-page .cl-source-uadmin-modal::-webkit-scrollbar-track,
body.cl-dashboard-redesign-page .cl-source-uadmin-modal .modal-content::-webkit-scrollbar-track,
body.cl-dashboard-redesign-page .cl-source-uadmin-modal .modal-body::-webkit-scrollbar-track {
  background: transparent !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal::-webkit-scrollbar-button,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default::-webkit-scrollbar-button,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-dialog::-webkit-scrollbar-button,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-content::-webkit-scrollbar-button,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-body::-webkit-scrollbar-button,
body.cl-dashboard-redesign-page #billingCardModalRoot::-webkit-scrollbar-button,
body.cl-dashboard-redesign-page #billingCardModalRoot .modal-content::-webkit-scrollbar-button,
body.cl-dashboard-redesign-page #billingCardModalRoot .modal-body::-webkit-scrollbar-button,
body.cl-dashboard-redesign-page .cl-source-social-guide-modal::-webkit-scrollbar-button,
body.cl-dashboard-redesign-page .cl-source-social-guide-modal .modal-content::-webkit-scrollbar-button,
body.cl-dashboard-redesign-page .cl-source-social-guide-modal .modal-body::-webkit-scrollbar-button,
body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guide-wrap::-webkit-scrollbar-button,
body.cl-dashboard-redesign-page .cl-source-uadmin-modal::-webkit-scrollbar-button,
body.cl-dashboard-redesign-page .cl-source-uadmin-modal .modal-content::-webkit-scrollbar-button,
body.cl-dashboard-redesign-page .cl-source-uadmin-modal .modal-body::-webkit-scrollbar-button {
  display: none !important;
  width: 0 !important;
  min-width: 0 !important;
  max-width: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  max-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}

body.cl-dashboard-redesign-page .fa,
body.cl-dashboard-redesign-page .fa::before,
body.cl-dashboard-redesign-page .fa::after {
  font-family: FontAwesome !important;
}

body.cl-dashboard-redesign-page .glyphicon,
body.cl-dashboard-redesign-page .glyphicon::before,
body.cl-dashboard-redesign-page .glyphicon::after {
  font-family: "Glyphicons Halflings" !important;
}

/* 리디자인 공통 셀렉트: 소스의 pp-dd/member-select 규격을 단일 기준으로 사용한다. */
body.cl-dashboard-redesign-page .cl-redesign-select {
  position: relative;
  display: inline-block;
  vertical-align: middle;
}

body.cl-dashboard-redesign-page .cl-redesign-select-trigger,
body.cl-dashboard-redesign-page .cl-source-plan-page #site-select.cl-redesign-select > .cl-redesign-select-trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-width: 112px;
  padding: 6px 10px 6px 12px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: var(--cl-radius-sm);
  color: var(--cl-text-sub);
  font-size: 12.5px;
  font-weight: 600;
  line-height: 18px;
  text-decoration: none;
  cursor: pointer;
  transition: background-color .12s, border-color .12s;
}

body.cl-dashboard-redesign-page .cl-redesign-select-trigger:hover,
body.cl-dashboard-redesign-page .cl-redesign-select-trigger:focus,
body.cl-dashboard-redesign-page .cl-redesign-select.bootstrap-select > .cl-redesign-select-trigger:is(:hover, :focus),
body.cl-dashboard-redesign-page .cl-source-plan-page #site-select.cl-redesign-select > .cl-redesign-select-trigger:hover,
body.cl-dashboard-redesign-page .cl-source-plan-page #site-select.cl-redesign-select > .cl-redesign-select-trigger:focus {
  background: #fafbfc;
  border-color: #d5d9e0;
  color: var(--cl-text-sub);
  text-decoration: none;
  outline: 0;
}

body.cl-dashboard-redesign-page .cl-redesign-select-arrow,
body.cl-dashboard-redesign-page .cl-source-plan-page #site-select.cl-redesign-select .cl-redesign-select-arrow {
  display: block;
  flex: none;
  width: 14px;
  height: 14px;
  margin: 0;
  fill: none;
  stroke: currentColor;
  color: var(--cl-text-muted);
  transform: none;
  transition: transform .15s;
}

body.cl-dashboard-redesign-page .cl-redesign-select.open .cl-redesign-select-arrow,
body.cl-dashboard-redesign-page .cl-source-plan-page #site-select.cl-redesign-select.open .cl-redesign-select-arrow {
  transform: rotate(180deg);
}

body.cl-dashboard-redesign-page .cl-redesign-select-menu,
body.cl-dashboard-redesign-page .cl-source-plan-page #site-select.cl-redesign-select > .cl-redesign-select-menu {
  position: absolute;
  z-index: 1000;
  display: none;
  top: var(--cl-select-menu-top, calc(100% + 4px));
  left: 0;
  min-width: 100%;
  margin: 0;
  padding: 4px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(20, 24, 32, .14);
}

body.cl-dashboard-redesign-page .cl-redesign-select.open > .cl-redesign-select-menu,
body.cl-dashboard-redesign-page .cl-source-plan-page #site-select.cl-redesign-select.open > .cl-redesign-select-menu {
  display: block;
}

body.cl-dashboard-redesign-page .cl-redesign-select-menu li,
body.cl-dashboard-redesign-page .cl-source-plan-page #site-select.cl-redesign-select > .cl-redesign-select-menu li {
  padding: 8px 12px;
  border-radius: var(--cl-radius-sm);
  color: var(--cl-text);
  font-size: 12.5px;
  font-weight: 400;
  line-height: 18px;
  white-space: nowrap;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .cl-redesign-select-menu li + li,
body.cl-dashboard-redesign-page .cl-source-plan-page #site-select.cl-redesign-select > .cl-redesign-select-menu li + li {
  margin-top: 2px;
}

body.cl-dashboard-redesign-page .cl-redesign-select-menu li:hover,
body.cl-dashboard-redesign-page .cl-redesign-select-menu li:focus,
body.cl-dashboard-redesign-page .cl-redesign-select-menu li.active,
body.cl-dashboard-redesign-page .cl-source-plan-page #site-select.cl-redesign-select > .cl-redesign-select-menu li:hover,
body.cl-dashboard-redesign-page .cl-source-plan-page #site-select.cl-redesign-select > .cl-redesign-select-menu li:focus,
body.cl-dashboard-redesign-page .cl-source-plan-page #site-select.cl-redesign-select > .cl-redesign-select-menu li.active {
  background: #e4f7ec;
  color: var(--cl-green-text);
}

body.cl-dashboard-redesign-page .cl-redesign-select-menu li.active,
body.cl-dashboard-redesign-page .cl-source-plan-page #site-select.cl-redesign-select > .cl-redesign-select-menu li.active {
  font-weight: 700;
}

/* Bootstrap-select uses the same trigger and a single menu shell. */
/* 원본 select는 값·폼 전송용이다. 투명한 입력의 최소 너비가 버튼 밖까지
   확장되어도 기본 옵션창이 열리지 않도록 조작은 커스텀 버튼으로만 받는다. */
body.cl-dashboard-redesign-page .bootstrap-select > select {
  pointer-events: none;
}

/* 화면 아래에서는 플러그인의 위쪽 열림 방향을 페이지별 위치 규칙에도 적용한다. */
body.cl-dashboard-redesign-page .bootstrap-select.dropup > .dropdown-menu {
  --cl-select-menu-top: auto;
  bottom: calc(100% + 4px);
}

body.cl-dashboard-redesign-page .cl-redesign-select.bootstrap-select > .cl-redesign-select-trigger {
  height: 35px;
  width: 100%;
  box-shadow: none;
}

body.cl-dashboard-redesign-page .cl-redesign-select.bootstrap-select > .cl-redesign-select-trigger:focus {
  outline: 0 !important;
  outline-offset: 0;
}

body.cl-dashboard-redesign-page .cl-redesign-select.bootstrap-select > .cl-redesign-select-trigger:focus-visible {
  border-color: var(--cl-green);
}

body.cl-dashboard-redesign-page .cl-redesign-select.bootstrap-select .cl-redesign-select-trigger .filter-option {
  position: static;
  width: auto;
  height: auto;
  padding: 0;
  flex: 1;
  min-width: 0;
  text-align: left;
}

body.cl-dashboard-redesign-page .cl-redesign-select.bootstrap-select .filter-option-inner {
  padding: 0;
}

body.cl-dashboard-redesign-page .cl-redesign-select.bootstrap-select .bs-caret,
body.cl-dashboard-redesign-page .cl-redesign-select.bootstrap-select > .dropdown-toggle::after {
  display: none;
}

body.cl-dashboard-redesign-page .cl-redesign-select.bootstrap-select > .cl-redesign-select-menu .dropdown-menu.inner {
  position: static;
  border: 0;
  border-radius: 0;
  margin: 0;
  padding: 0;
  background: transparent;
  box-shadow: none;
}

body.cl-dashboard-redesign-page .cl-redesign-select.bootstrap-select .cl-redesign-select-menu li {
  padding: 0;
}

body.cl-dashboard-redesign-page .cl-redesign-select.bootstrap-select .cl-redesign-select-menu li > a {
  padding: 8px 12px;
  border-radius: inherit;
  background: transparent;
  color: inherit;
  font: inherit;
}

body.cl-dashboard-redesign-page .cl-redesign-select.bootstrap-select .cl-redesign-select-menu li:focus-within {
  background: #e4f7ec;
  color: var(--cl-green-text);
}

body.cl-dashboard-redesign-page select.cl-redesign-native-select {
  height: 35px;
  margin: 0;
  padding: 0 30px 0 12px;
  appearance: none;
  -webkit-appearance: none;
  background-color: #fff;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238A8F98' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-position: right 8px center;
  background-repeat: no-repeat;
  background-size: 14px;
  border: 1px solid var(--cl-border);
  border-radius: var(--cl-radius-sm);
  box-shadow: none;
  outline: 0;
  color: var(--cl-text);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 35px;
  cursor: pointer;
}

body.cl-dashboard-redesign-page select.cl-redesign-native-select:hover,
body.cl-dashboard-redesign-page select.cl-redesign-native-select:focus {
  background-color: #fafbfc;
  border-color: #d5d9e0;
  box-shadow: none;
  outline: 0;
}

body.cl-dashboard-redesign-page select.cl-redesign-native-select option {
  color: var(--cl-text);
  font-weight: 400;
}

/* 리디자인 업그레이드 안내 모달 */
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.site-upgrade-notice) {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  z-index: 1000002 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.site-upgrade-notice) > .modal-default {
  position: fixed !important;
  inset: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100vw !important;
  height: 100vh !important;
  margin: 0 !important;
  padding: 24px 16px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  background: rgba(0, 0, 0, .45) !important;
  z-index: 1000002 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.site-upgrade-notice) + .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.site-upgrade-notice) .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.site-upgrade-notice) + .modal-backdrop.fade.in,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.site-upgrade-notice) .modal-backdrop.fade.in {
  background: transparent !important;
  opacity: 0 !important;
  z-index: 1000001 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal:has(.site-upgrade-notice) {
  width: min(460px, calc(100vw - 32px)) !important;
  max-width: min(460px, calc(100vw - 32px)) !important;
  transform: none !important;
  margin-right: auto !important;
  margin-left: auto !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal:has(.site-upgrade-notice) .modal-content {
  width: 100% !important;
  min-height: 0 !important;
  padding: 38px 40px 30px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 18px !important;
  box-shadow: 0 20px 50px rgba(20, 24, 32, .24) !important;
  color: var(--cl-text) !important;
  font-family: var(--cl-font);
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal:has(.site-upgrade-notice) .modal-body {
  width: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text-sub) !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal:has(.site-upgrade-notice) .modal-title {
  margin: 0 34px 22px !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-size: 22px !important;
  font-weight: 800 !important;
  line-height: 30px !important;
  letter-spacing: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal:has(.site-upgrade-notice) .modal-content > .close.close-button-dialog {
  position: absolute !important;
  top: 14px !important;
  right: 14px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub) !important;
  opacity: 1 !important;
  transition: background-color .12s, transform .18s cubic-bezier(.34, 1.56, .64, 1);
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal:has(.site-upgrade-notice) .modal-content > .close.close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal:has(.site-upgrade-notice) .modal-content > .close.close-button-dialog:focus {
  background: #f1f2f5 !important;
  color: var(--cl-text) !important;
  outline: 0 !important;
  transform: rotate(90deg);
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal:has(.site-upgrade-notice) .modal-content > .close.close-button-dialog svg {
  display: block !important;
  width: 9px !important;
  height: 9px !important;
  fill: currentColor !important;
  stroke: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal:has(.site-upgrade-notice) .site-upgrade-notice {
  width: 100% !important;
  margin: 0 !important;
  color: var(--cl-text-sub) !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal:has(.site-upgrade-notice) .site-upgrade-notice p {
  margin: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 22px !important;
  letter-spacing: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal:has(.site-upgrade-notice) .site-upgrade-notice .text-centermodal {
  display: block !important;
  width: 320px !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  color: inherit !important;
  text-align: center !important;
  word-break: keep-all !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal:has(.site-upgrade-notice) .site-upgrade-notice .btn-box {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  width: 320px !important;
  max-width: 100% !important;
  margin: 32px auto 0 !important;
  padding: 0 !important;
  gap: 12px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal:has(.site-upgrade-notice) .site-upgrade-notice .btn-box .btn,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal:has(.site-upgrade-notice) .site-upgrade-notice .btn-box .btn:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal:has(.site-upgrade-notice) .site-upgrade-notice .btn-box .btn:focus {
  float: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  box-shadow: none !important;
  text-decoration: none !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal:has(.site-upgrade-notice) .site-upgrade-notice #upgrade-usemember-link {
  float: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 46px !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 18px !important;
  background: var(--cl-green) !important;
  border: 1px solid var(--cl-green) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  text-align: center !important;
  text-decoration: none !important;
  text-transform: none !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal:has(.site-upgrade-notice) .site-upgrade-notice .npay-setting-link {
  float: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 46px !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 18px !important;
  background: var(--cl-green) !important;
  border: 1px solid var(--cl-green) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  text-align: center !important;
  text-decoration: none !important;
  text-transform: none !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal:has(.site-upgrade-notice) .site-upgrade-notice #upgrade-usemember-link:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal:has(.site-upgrade-notice) .site-upgrade-notice #upgrade-usemember-link:focus,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal:has(.site-upgrade-notice) .site-upgrade-notice .npay-setting-link:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal:has(.site-upgrade-notice) .site-upgrade-notice .npay-setting-link:focus {
  background: var(--cl-green-hover) !important;
  border-color: var(--cl-green-hover) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal:has(.site-upgrade-notice) .site-upgrade-notice #upgrade-usemember-link svg {
  width: 18px !important;
  height: 18px !important;
  margin-right: 8px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal:has(.site-upgrade-notice) .site-upgrade-notice #upgrade-usemember-link[href="/shopping/setting/N"] svg {
  position: static !important;
  top: auto !important;
  flex: 0 0 auto !important;
  width: 8px !important;
  height: 10px !important;
  margin: 0 0 0 8px !important;
  fill: currentColor !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal:has(.site-upgrade-notice) .site-upgrade-notice .npay-setting-link svg {
  position: static !important;
  top: auto !important;
  flex: 0 0 auto !important;
  width: 8px !important;
  height: 10px !important;
  margin: 0 0 0 8px !important;
  fill: currentColor !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal:has(.site-upgrade-notice) .site-upgrade-notice .close-button-dialog {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 46px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 9px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal:has(.site-upgrade-notice) .site-upgrade-notice .close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal:has(.site-upgrade-notice) .site-upgrade-notice .close-button-dialog:focus {
  background: #eaf9f1 !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.shopping-upgrade-modal:has(.site-upgrade-notice) {
  width: min(440px, calc(100vw - 32px)) !important;
  max-width: min(440px, calc(100vw - 32px)) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.shopping-upgrade-modal:has(.site-upgrade-notice) .modal-content {
  padding-right: 27px !important;
  padding-left: 27px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.shopping-upgrade-modal:has(.site-upgrade-notice) .modal-body {
  max-width: 100% !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.shopping-upgrade-modal:has(.site-upgrade-notice) .site-upgrade-notice .btn-box {
  width: 384px !important;
}

/* 알림 메일 업그레이드 안내의 본문과 하단 버튼 폭을 공통 모달 기준으로 맞춘다. */
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.notification-mail-upgrade-modal .modal-content {
  border-radius: 14px !important;
  box-shadow: 0 24px 64px rgba(0, 0, 0, .28) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.notification-mail-upgrade-modal .site-upgrade-notice .text-centermodal,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.notification-mail-upgrade-modal .site-upgrade-notice .btn-box {
  width: 100% !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.notification-mail-upgrade-modal .site-upgrade-notice #upgrade-usemember-link {
  font-size: 15px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.notification-mail-upgrade-modal .site-upgrade-notice .close-button-dialog {
  font-weight: 600 !important;
}

/* 알림 업그레이드 안내는 카드 안의 공통 X 버튼만 사용한다. */
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal > .modal-default:has(> .notification-mail-upgrade-modal, > .notification-kakao-upgrade-modal) > .cl-mobile-btn.close {
  display: none !important;
}

/* 마케팅 무료요금제 안내 모달 */
body.cl-dashboard-redesign-page .flat-modal.cl-source-marketing-freeplan-modal-wrap > .modal-default > .cl-mobile-btn.close {
  display: none;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-marketing-freeplan-modal-wrap {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  z-index: 1000002 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-marketing-freeplan-modal-wrap > .modal-default {
  position: fixed !important;
  inset: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100vw !important;
  height: 100vh !important;
  margin: 0 !important;
  padding: 24px 16px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  background: rgba(0, 0, 0, .45) !important;
  z-index: 1000002 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-marketing-freeplan-modal-wrap + .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-marketing-freeplan-modal-wrap .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-marketing-freeplan-modal-wrap + .modal-backdrop.fade.in,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-marketing-freeplan-modal-wrap .modal-backdrop.fade.in {
  background: transparent !important;
  opacity: 0 !important;
  z-index: 1000001 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-marketing-freeplan-modal-wrap > .modal-default > .modal-dialog.cl-cmmodal.cl-source-marketing-freeplan-modal {
  width: min(440px, calc(100vw - 32px)) !important;
  max-width: min(440px, calc(100vw - 32px)) !important;
  height: auto;
  min-height: 0;
  margin: 0 auto !important;
  padding: 0 !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-marketing-freeplan-modal-wrap > .modal-default > .modal-dialog.cl-cmmodal.cl-source-marketing-freeplan-modal .modal-content {
  width: 100% !important;
  height: auto;
  min-height: 0 !important;
  max-height: calc(100vh - 48px);
  padding: 38px 28px 26px !important;
  background: #fff !important;
  border: 0 !important;
  border-radius: var(--r-xl, 14px) !important;
  box-shadow: 0 20px 50px rgba(20, 24, 32, .24) !important;
  color: var(--cl-text) !important;
  font-family: var(--cl-font);
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-marketing-freeplan-modal-wrap > .modal-default > .modal-dialog.cl-cmmodal.cl-source-marketing-freeplan-modal .modal-body {
  width: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text-sub) !important;
  font-family: var(--cl-font);
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-marketing-freeplan-modal-wrap > .modal-default > .modal-dialog.cl-cmmodal.cl-source-marketing-freeplan-modal .modal-title {
  margin: 0 34px 22px !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  line-height: 28px !important;
  letter-spacing: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-marketing-freeplan-modal-wrap > .modal-default > .modal-dialog.cl-cmmodal.cl-source-marketing-freeplan-modal .modal-content > .close.close-button-dialog {
  position: absolute !important;
  top: 14px !important;
  right: 14px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub) !important;
  opacity: 1 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-marketing-freeplan-modal-wrap > .modal-default > .modal-dialog.cl-cmmodal.cl-source-marketing-freeplan-modal .modal-content > .close.close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-marketing-freeplan-modal-wrap > .modal-default > .modal-dialog.cl-cmmodal.cl-source-marketing-freeplan-modal .modal-content > .close.close-button-dialog:focus {
  background: #f1f2f5 !important;
  color: var(--cl-text) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-marketing-freeplan-modal-wrap > .modal-default > .modal-dialog.cl-cmmodal.cl-source-marketing-freeplan-modal .modal-content > .close.close-button-dialog svg {
  display: block !important;
  width: 15px !important;
  height: 15px !important;
  fill: currentColor !important;
  stroke: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-marketing-freeplan-modal-wrap > .modal-default > .modal-dialog.cl-cmmodal.cl-source-marketing-freeplan-modal .site-upgrade-notice p {
  margin: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 22px !important;
  letter-spacing: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-marketing-freeplan-modal-wrap > .modal-default > .modal-dialog.cl-cmmodal.cl-source-marketing-freeplan-modal .site-upgrade-notice .text-centermodal {
  display: block !important;
  width: 320px !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  color: inherit !important;
  text-align: center !important;
  word-break: keep-all !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-marketing-freeplan-modal-wrap > .modal-default > .modal-dialog.cl-cmmodal.cl-source-marketing-freeplan-modal .site-upgrade-notice .btn-box {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 32px auto 0 !important;
  padding: 0 !important;
  gap: 14px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-marketing-freeplan-modal-wrap > .modal-default > .modal-dialog.cl-cmmodal.cl-source-marketing-freeplan-modal .site-upgrade-notice #upgrade-usemember-link,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-marketing-freeplan-modal-wrap > .modal-default > .modal-dialog.cl-cmmodal.cl-source-marketing-freeplan-modal .site-upgrade-notice .close-button-dialog {
  float: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 46px !important;
  min-height: 46px !important;
  margin: 0 !important;
  padding: 0 18px !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  font-size: 14px !important;
  line-height: 1 !important;
  text-align: center !important;
  text-decoration: none !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-marketing-freeplan-modal-wrap > .modal-default > .modal-dialog.cl-cmmodal.cl-source-marketing-freeplan-modal .site-upgrade-notice #upgrade-usemember-link {
  background: var(--cl-green) !important;
  border: 1px solid var(--cl-green) !important;
  color: #fff !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-marketing-freeplan-modal-wrap > .modal-default > .modal-dialog.cl-cmmodal.cl-source-marketing-freeplan-modal .site-upgrade-notice #upgrade-usemember-link:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-marketing-freeplan-modal-wrap > .modal-default > .modal-dialog.cl-cmmodal.cl-source-marketing-freeplan-modal .site-upgrade-notice #upgrade-usemember-link:focus {
  background: var(--cl-green-hover) !important;
  border-color: var(--cl-green-hover) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-marketing-freeplan-modal-wrap > .modal-default > .modal-dialog.cl-cmmodal.cl-source-marketing-freeplan-modal .site-upgrade-notice #upgrade-usemember-link svg {
  width: 18px !important;
  height: 18px !important;
  margin-right: 8px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-marketing-freeplan-modal-wrap > .modal-default > .modal-dialog.cl-cmmodal.cl-source-marketing-freeplan-modal .site-upgrade-notice .close-button-dialog {
  background: transparent !important;
  border: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-marketing-freeplan-modal-wrap > .modal-default > .modal-dialog.cl-cmmodal.cl-source-marketing-freeplan-modal .site-upgrade-notice .close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-marketing-freeplan-modal-wrap > .modal-default > .modal-dialog.cl-cmmodal.cl-source-marketing-freeplan-modal .site-upgrade-notice .close-button-dialog:focus {
  background: #eaf9f1 !important;
  color: var(--cl-green-text) !important;
}

/* 무료 요금제의 사이트 설명·키워드 업그레이드 안내 */
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-marketing-seo-field-modal-wrap > .modal-default.fade,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-marketing-seo-field-modal-wrap > .modal-default.fade > .modal-dialog {
  transition: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-marketing-seo-field-modal-wrap > .modal-default > .modal-dialog.cl-cmmodal.cl-source-marketing-freeplan-modal.cl-source-marketing-seo-field-modal .modal-title {
  margin-bottom: 14px !important;
  font-size: 21px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-marketing-seo-field-modal-wrap > .modal-default > .modal-dialog.cl-cmmodal.cl-source-marketing-freeplan-modal.cl-source-marketing-seo-field-modal .site-upgrade-notice .btn-box {
  margin-top: 28px !important;
  gap: 14px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-marketing-seo-field-modal-wrap > .modal-default > .modal-dialog.cl-cmmodal.cl-source-marketing-freeplan-modal.cl-source-marketing-seo-field-modal .site-upgrade-notice #upgrade-usemember-link {
  height: 51px !important;
  min-height: 51px !important;
  font-size: 15px !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-marketing-seo-field-modal-wrap > .modal-default > .modal-dialog.cl-cmmodal.cl-source-marketing-freeplan-modal.cl-source-marketing-seo-field-modal .site-upgrade-notice .close-button-dialog {
  font-size: 14px !important;
}

/* 마케팅 SEO 일괄 적용 확인 모달 */
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.marketing-seo-default-apply-modal) {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  z-index: 1000002 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.marketing-seo-default-apply-modal) > .modal-default {
  position: fixed !important;
  inset: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100vw !important;
  height: 100vh !important;
  margin: 0 !important;
  padding: 24px 16px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  background: rgba(0, 0, 0, .45) !important;
  z-index: 1000002 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.marketing-seo-default-apply-modal) + .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.marketing-seo-default-apply-modal) .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.marketing-seo-default-apply-modal) + .modal-backdrop.fade.in,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.marketing-seo-default-apply-modal) .modal-backdrop.fade.in {
  background: transparent !important;
  opacity: 0 !important;
  z-index: 1000001 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.marketing-seo-default-apply-modal) > .modal-default > .cl-mobile-btn.close {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.marketing-seo-default-apply-modal {
  width: 92% !important;
  max-width: 560px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  overflow: visible !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.marketing-seo-default-apply-modal .modal-content {
  --border: #E5E7EB;
  --text-primary: #222428;
  --text-secondary: #8A8F98;
  --brand-blue: #03C75A;
  --brand-blue-hover: #02B351;
  position: relative !important;
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 44px 8% 34px !important;
  float: none !important;
  overflow: visible !important;
  background: #fff !important;
  border: 0 !important;
  border-radius: 18px !important;
  box-shadow: 0 20px 50px rgba(20, 24, 32, .25) !important;
  box-sizing: border-box !important;
  color: var(--text-primary) !important;
  font-family: var(--cl-source-font) !important;
  letter-spacing: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.marketing-seo-default-apply-modal .modal-content > .close.close-button-dialog {
  position: absolute !important;
  top: 14px !important;
  right: 16px !important;
  z-index: 2 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--text-secondary) !important;
  font-size: 0 !important;
  line-height: 0 !important;
  opacity: 1 !important;
  transition: background-color .12s, color .12s, transform .18s cubic-bezier(.34, 1.56, .64, 1) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.marketing-seo-default-apply-modal .modal-content > .close.close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.marketing-seo-default-apply-modal .modal-content > .close.close-button-dialog:focus {
  background: #F1F2F5 !important;
  color: var(--text-primary) !important;
  outline: 0 !important;
  transform: rotate(90deg) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.marketing-seo-default-apply-modal .modal-content > .close.close-button-dialog span,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.marketing-seo-default-apply-modal .modal-content > .close.close-button-dialog svg {
  display: block !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.marketing-seo-default-apply-modal .modal-content > .close.close-button-dialog svg {
  width: 15px !important;
  height: 15px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.marketing-seo-default-apply-modal .modal-body {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  box-sizing: border-box !important;
  color: var(--text-secondary) !important;
  font-family: inherit !important;
  font-size: 15px !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  word-break: keep-all !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.marketing-seo-default-apply-modal .modal-title {
  display: block !important;
  width: auto !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 0 22px !important;
  padding: 0 !important;
  color: var(--text-primary) !important;
  font-family: inherit !important;
  font-size: 21px !important;
  font-weight: 700 !important;
  font-style: normal !important;
  line-height: normal !important;
  letter-spacing: normal !important;
  text-align: center !important;
  text-shadow: none !important;
  text-transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.marketing-seo-default-apply-modal .modal-footer {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 10px !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 26px 0 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-sizing: border-box !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.marketing-seo-default-apply-modal .modal-footer > .btn {
  float: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: 48px !important;
  min-height: 48px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  border-radius: 9px !important;
  box-shadow: none !important;
  font-family: inherit !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  text-decoration: none !important;
  text-shadow: none !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.marketing-seo-default-apply-modal .modal-footer > .ok-button-dialog {
  order: 1 !important;
  background: var(--brand-blue) !important;
  border: 1px solid var(--brand-blue) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.marketing-seo-default-apply-modal .modal-footer > .ok-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.marketing-seo-default-apply-modal .modal-footer > .ok-button-dialog:focus {
  background: var(--brand-blue-hover) !important;
  border-color: var(--brand-blue-hover) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.marketing-seo-default-apply-modal .modal-footer > .close-button-dialog:not(.ok-button-dialog) {
  order: 2 !important;
  height: 48px !important;
  min-height: 48px !important;
  background: transparent !important;
  border: 0 !important;
  color: var(--text-secondary) !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.marketing-seo-default-apply-modal .modal-footer > .close-button-dialog:not(.ok-button-dialog):hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.marketing-seo-default-apply-modal .modal-footer > .close-button-dialog:not(.ok-button-dialog):focus {
  height: 48px !important;
  min-height: 48px !important;
  background: #F1FBF5 !important;
  color: var(--cl-green-text) !important;
  font-size: 15px !important;
  line-height: 1 !important;
}

/* 공통 모달 상단 X: v2 .modal-close의 30px 버튼 / 15px stroke SVG.
   레거시 filled SVG·아이콘 폰트·두 선 X는 유지하되 투명 처리하여 기존 클릭/접근성 이름을 보존한다.
   앞선 important 레이어에서 한 번만 그려 후속 팝업별 important 규칙과의 충돌을 막는다.
   하단 닫기/취소 버튼, 색상 피커, 사용자 사이트 콘텐츠는 대상이 아니다. */
@layer cl-modal-close {
  :is(body.cl-dashboard-redesign-page, body.cl-dashboard-plan-payment-result-page, body.cl-source-card-add-modal-open, .cl-dashboard-redesign) :is(
    .modal-content > :is(.close, .close-button-dialog, .modal-close),
    .modal-header > :is(.close, .close-button-dialog, .modal-close),
    .cl-basic-site-screen-close, .cl-source-site-add-close, .cl-source-notice-delete-close,
    .cl-source-site-mgmt-close, #site-select .create-site-close,
    .cl-coupon-modal-close, .cl-source-product-category-close, .cl-product-template-close,
    .join-style-preview-close, .options-info-modal-close, .payment-box > .close-btn-box,
    #kcpGuideOverlay .kg-close, #info-process .upload-header .upload-close
  ):not(:where(.site *, .blk *, .cred *)) {
    position: absolute !important;
    inset: 16px 16px auto auto !important;
    box-sizing: border-box !important;
    float: none !important;
    flex-shrink: 0 !important;
    width: 30px !important;
    min-width: 30px !important;
    max-width: 30px !important;
    height: 30px !important;
    min-height: 30px !important;
    max-height: 30px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 8px !important;
    background: transparent !important;
    color: var(--cl-text-sub, #8a8f98) !important;
    opacity: 1 !important;
    font-size: 0 !important;
    line-height: 0 !important;
    box-shadow: none !important;
    text-shadow: none !important;
    text-decoration: none !important;
    overflow: hidden !important;
    cursor: pointer !important;
    transform: none !important;
    transform-origin: center !important;
    transition: color .15s, background .15s, transform .18s cubic-bezier(.34,1.56,.64,1) !important;

    /* flex/grid 헤더의 자리와 긴 업로드 창의 헤더 기준 위치는 그대로 유지한다. */
    &:not(.cl-source-site-mgmt-close, .create-site-close, .cl-product-template-close, .kg-close) {
      margin: 0 !important;
    }
    &:is(.cl-source-site-mgmt-close, .create-site-close, .cl-product-template-close, .kg-close) {
      position: relative !important;
      inset: auto !important;
    }
    &.upload-close { top: -16px !important; right: -16px !important; }

    & > * { opacity: 0 !important; }
    &::before {
      content: "" !important;
      display: block !important;
      position: absolute !important;
      inset: 50% auto auto 50% !important;
      width: 30px !important;
      height: 30px !important;
      margin: 0 !important;
      padding: 0 !important;
      border: 0 !important;
      border-radius: 0 !important;
      background: currentColor !important;
      opacity: 1 !important;
      box-shadow: none !important;
      transform: translate(-50%, -50%) !important;
      /* 버튼 전체 캔버스 중앙에 15px 원본 SVG를 배치한다. */
      -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E") center / 15px 15px no-repeat !important;
      mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E") center / 15px 15px no-repeat !important;
      pointer-events: none !important;
    }
    &::after { content: none !important; display: none !important; }

    &:is(:hover, :focus-visible):not(:disabled, [aria-disabled="true"]) {
      background: var(--cl-bg-3, #f1f2f5) !important;
      color: var(--cl-text, #222428) !important;
      transform: rotate(90deg) !important;
    }
    &:focus-visible { outline: 0 !important; }
    &:is(:disabled, [aria-disabled="true"]) { cursor: default !important; }

    @media (prefers-reduced-motion: reduce) {
      &, &:is(:hover, :focus-visible):not(:disabled, [aria-disabled="true"]) {
        transition: none !important;
        transform: none !important;
      }
    }
  }
}

/* 공통 모달 크기: 실제 디자인 폭을 기준으로 등록하며, 다른 폭의 변형은 제외한다.
   560px cover 유형도 공통 규칙을 사용하며, cover 여부만으로 제외하지 않는다.
   440px: 좌우 28px / 버튼 384px, 560px: 34px / 492px, 660px: 40px / 580px.
   모바일에서도 해당 패딩을 유지하고 버튼만 가용 폭에 맞게 줄인다. */
@layer cl-modal-size {
  :is(body.cl-dashboard-redesign-page, body.cl-dashboard-plan-payment-result-page, body.cl-source-card-add-modal-open, .cl-dashboard-redesign) :is(
    .modal-dialog.w560:not(:is(
      #domainSetModal *, .formname-Edit, .form-date2, .img-ratio-modal,
      .cl-source-form-delete-modal, .cl-source-form-delete-empty-modal,
      :has(.site-upgrade-notice), .cl-source-marketing-freeplan-modal, .cl-publish-confirm, .cl-basic-profile-modal,
      .cl-screenUpload, .cl-screen-refresh-error-modal, .cl-source-plan-result-modal, .cl-source-plan-schedule-modal,
      .cl-source-notice-link-alert, .cl-source-call-history-modal, .cl-source-charge-history-modal,
      .domain-flow-order-modal, .domain-flow-payment-modal, .domain-flow-disconnect-flat-modal,
      .shopgrade-setting-modal, .shopgrade-add-modal, .cl-source-member-info-modal, .memberinfo-modal,
      .cl-source-social-guide-modal *, .sms-number-guide-modal, .cl-source-uadmin-admin-setup-modal *, .cl-source-uadmin-modal *,
      .cl-source-product-gallery-notice-wrap *, .cl-source-product-price-modal, .cl-source-product-badge-wrap *,
      .confirm-resource-folder-delete, .modal-resourcebox, .cl-product-option-delete-confirm, .cl-download-limit-alert,
      .cl-source-delivery-edit-modal, .cl-source-order-search-modal, .cl-point-info, .coupon-add-modal, .coupon-manage-modal,
      #cl-coupon-delete-modal *, .cl-delivery-condition-delete, .cl-naverpay-notice, .cl-source-notification-guard-notice,
      .cl-s-vcnt-guide, .cl-vcnt-escrow-info, .cl-source-download-limit-alert, .cl-source-etc-exclude-date-modal,
      .cl-source-etc-term-date-modal, .cl-source-product-sale-datetime-modal,
      body:has(.cl-profile-myinfo-page) *, .cl-source-message-notice, .cl-source-identity-modal, .cl-source-log-detail-wide,
      .cl-source-smtp-guide-wrap *, .cl-basic-seo-guide-modal, .cl-marketing-seo-lock-modal, .cl-site-add-limit-modal,
      .cl-source-kakao-template-wrap *, .pg-modal, .pg-apply-clmodal, .cl-source-pg-process-wrap *
    )),
    .modal-dialog.cl-source-template-dialog,
    .modal-dialog.shopping-upgrade-modal:has(.site-upgrade-notice),
    .modal-dialog.marketing-seo-default-apply-modal,
    .modal-dialog:is(.cl-basic-site-clone-modal, .cl-basic-site-transfer-modal, .cl-basic-site-delete-modal, .cl-basic-site-delete-countdown-modal),
    .modal-dialog.cl-source-plan-action-modal:not(.cl-source-plan-result-modal, .cl-source-plan-schedule-modal),
    .modal-dialog.cl-s-talkPayCharge, .modal-dialog.domain-flow-external-connect-flat-modal,
    .modal-dialog.cl-source-member-workflow-modal:not(.cl-source-member-info-modal, .memberinfo-modal, .shopgrade-setting-modal, .shopgrade-add-modal),
    .modal-dialog.cl-source-coupon-confirm-modal, .modal-dialog.shopgrade-setting-modal, .modal-dialog.shopgrade-delete-confirm-modal, .modal-dialog.jcol-selecttype-modal,
    .cl-source-uadmin-admin-modal > .modal-dialog, .cl-source-uadmin-dialog.cl-source-uadmin-admin-dialog,
    body.cl-member-uadmin-page-active .modal-dialog._admin.add-modal.cl-p130,
    .cl-source-product-workflow-wrap:not(.cl-source-product-price-modal-wrap, .cl-source-product-badge-wrap) .modal-dialog.cl-source-product-workflow-modal,
    .cl-source-order-workflow-wrap .modal-dialog.cl-source-order-workflow-modal:not(.cl-source-order-search-modal),
    .modal-dialog.shopping-listitem-modal, .modal-dialog.delivery-template-modal, .modal-dialog.cl-source-sms-register-modal,
    .modal-dialog.cl-source-etc-time-modal,
    body:has(.cl-profile-myinfo-page) .flat-modal .modal-dialog:not(.cl-profileAlert, .cl-profileConfirm, .cl-alert, .cl-nonProfile, .cl-removeAccConfirm),
    .cl-source-log-detail-wrap .modal-dialog.cl-source-log-detail-modal:not(.cl-source-log-detail-wide),
    .cl-source-settings-dialog-wrap:not(.cl-source-smtp-guide-wrap, .cl-source-kakao-template-wrap, .cl-source-pg-process-wrap) .modal-dialog.cl-source-settings-dialog:not(.cl-basic-seo-guide-modal, .cl-marketing-seo-lock-modal, .cl-site-add-limit-modal, .pg-modal, .pg-apply-clmodal),
    .modal-dialog.cl-source-plan-payment-notice, .modal-dialog.cl-plan-vbank-cancel-modal, .modal-dialog.cl-plan-card-select-modal,
    body.cl-source-product-detail-frame .cl-source-information-modal-wrap:not(.cl-source-product-workflow-wrap) .modal-dialog.cl-source-information-modal,
    body:has(#cl-notice-write-page) .note-image-dialog .modal-dialog,
    .cl-source-site-add-modal, #cl-notice-page .cl-source-notice-delete-modal,
    .cl-coupon-issue-dialog, .cl-coupon-issue-confirm-dialog
  ) {
    --cl-modal-inline-padding: 34px;
    --cl-modal-button-width: 492px;

    &:is(
      .shopping-upgrade-modal, .cl-basic-site-clone-modal, .cl-basic-site-transfer-modal,
      .cl-basic-site-delete-modal, .cl-basic-site-delete-countdown-modal, .shopgrade-delete-confirm-modal,
      .shopping-listitem-modal, .cl-order-compact-alert, .cl-coupon-issue-confirm-dialog, .cl-shopping-legal-modal, .cl-delivery-copy-confirm, .cl-delivery-delete-confirm, .cl-naverpay-use-check,
      .cl-source-plan-payment-notice, .cl-plan-vbank-cancel-modal,
      .cl-source-plan-disconnect-modal, .cl-source-plan-cancel-modal, .cl-source-plan-paypal-notice-modal,
      .cl-source-member-workflow-modal:is(.cl-member-list-leave-modal, .cl-member-list-leave-empty-modal, .cl-member-list-block-modal, .cl-member-list-level-modal, .cl-member-list-shopgrade-modal, .cl-member-list-block, .cl-member-collection-delete-modal),
      :is(#billingCardEditModalRoot, #billingCardDeleteModalRoot) .cl-source-plan-action-modal,
      body.cl-source-product-detail-frame :is(.cl-source-product-workflow-modal, .cl-source-information-modal)
    ) {
      --cl-modal-inline-padding: 28px;
      --cl-modal-button-width: 384px;
    }

    &.delivery-template-modal {
      --cl-modal-inline-padding: 40px;
      --cl-modal-button-width: 580px;
    }

    & > .modal-content,
    &:is(.cl-source-site-add-modal, .cl-source-notice-delete-modal, .cl-coupon-issue-dialog, .cl-coupon-issue-confirm-dialog) {
      padding-right: var(--cl-modal-inline-padding) !important;
      padding-left: var(--cl-modal-inline-padding) !important;
    }

    & > .modal-content > :is(.modal-header, .modal-body, .modal-footer) {
      padding-right: 0 !important;
      padding-left: 0 !important;
    }

    & > .modal-content > .modal-body {
      width: 100% !important;
      max-width: none !important;
    }

    /* 1px 카드 보더 유무와 무관하게 지정한 버튼 폭을 카드 중앙에 맞춘다. */
    & > .modal-content > .modal-footer,
    & > .modal-content > .modal-body > .site-upgrade-notice > .btn-box,
    & > .cl-coupon-issue-actions,
    & > :is(.cl-source-site-add-create, .cl-source-site-add-cancel, .cl-source-notice-delete-confirm, .cl-source-notice-delete-cancel) {
      box-sizing: border-box !important;
      width: min(var(--cl-modal-button-width), calc(100% + 2px)) !important;
      min-width: 0 !important;
      max-width: none !important;
      margin-right: calc((100% - min(var(--cl-modal-button-width), calc(100% + 2px))) / 2) !important;
      margin-left: calc((100% - min(var(--cl-modal-button-width), calc(100% + 2px))) / 2) !important;
    }

    & > .modal-content > .modal-footer > :is(.btn, button, input[type="button"], input[type="submit"]),
    & > .modal-content > .modal-body > .site-upgrade-notice > .btn-box > .btn,
    & > .cl-coupon-issue-actions > button {
      box-sizing: border-box !important;
      width: 100% !important;
      min-width: 0 !important;
      max-width: none !important;
    }
  }
}

/* Layered important spacing overrides legacy per-dialog important margins. */
:is(body.cl-dashboard-redesign-page, body.cl-redesign-scroll-page) :is(.modal-footer, .point-modal-actions):not(.hide):not([hidden]) {
  display: flex;
}

@layer cl-modal-action-spacing {
  :is(body.cl-dashboard-redesign-page, body.cl-redesign-scroll-page) :is(.modal-footer, .point-modal-actions, .cl-notification-upgrade-actions) {
    flex-direction: column !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 14px !important;
  }

  :is(body.cl-dashboard-redesign-page, body.cl-redesign-scroll-page) :is(.modal-footer, .point-modal-actions, .cl-notification-upgrade-actions) > :is(.btn, button, input[type="button"], input[type="submit"], [role="button"]) {
    margin: 0 !important;
  }

  :is(body.cl-dashboard-redesign-page, body.cl-redesign-scroll-page) :is(.modal-footer, .point-modal-actions, .cl-notification-upgrade-actions)::before,
  :is(body.cl-dashboard-redesign-page, body.cl-redesign-scroll-page) :is(.modal-footer, .point-modal-actions, .cl-notification-upgrade-actions)::after {
    content: none !important;
    display: none !important;
  }
}

/* 리디자인 모달 하단 닫기/취소 버튼 */
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog .modal-footer :is(.close-button-dialog, .cancel-button-dialog, .cancel-btn, .cancel-button, .btn-cancel, .btn-cancel-dialog):not(.ok-button-dialog),
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog .modal-footer :is(.close-button-dialog, .cancel-button-dialog, .cancel-btn, .cancel-button, .btn-cancel, .btn-cancel-dialog):not(.ok-button-dialog):hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog .modal-footer :is(.close-button-dialog, .cancel-button-dialog, .cancel-btn, .cancel-button, .btn-cancel, .btn-cancel-dialog):not(.ok-button-dialog):focus,
body.cl-dashboard-redesign-page .flat-modal .modal-footer :is(.close-button-dialog, .cancel-button-dialog, .cancel-btn, .cancel-button, .btn-cancel, .btn-cancel-dialog):not(.ok-button-dialog),
body.cl-dashboard-redesign-page .flat-modal .modal-footer :is(.close-button-dialog, .cancel-button-dialog, .cancel-btn, .cancel-button, .btn-cancel, .btn-cancel-dialog):not(.ok-button-dialog):hover,
body.cl-dashboard-redesign-page .flat-modal .modal-footer :is(.close-button-dialog, .cancel-button-dialog, .cancel-btn, .cancel-button, .btn-cancel, .btn-cancel-dialog):not(.ok-button-dialog):focus {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: none !important;
  height: 46px !important;
  min-height: 46px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 9px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog .modal-footer :is(.close-button-dialog, .cancel-button-dialog, .cancel-btn, .cancel-button, .btn-cancel, .btn-cancel-dialog):not(.ok-button-dialog):hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog .modal-footer :is(.close-button-dialog, .cancel-button-dialog, .cancel-btn, .cancel-button, .btn-cancel, .btn-cancel-dialog):not(.ok-button-dialog):focus,
body.cl-dashboard-redesign-page .flat-modal .modal-footer :is(.close-button-dialog, .cancel-button-dialog, .cancel-btn, .cancel-button, .btn-cancel, .btn-cancel-dialog):not(.ok-button-dialog):hover,
body.cl-dashboard-redesign-page .flat-modal .modal-footer :is(.close-button-dialog, .cancel-button-dialog, .cancel-btn, .cancel-button, .btn-cancel, .btn-cancel-dialog):not(.ok-button-dialog):focus {
  background: #eaf9f1 !important;
  color: var(--cl-green-text) !important;
}

/* 리디자인 사이트 게시 확인 모달 */
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.cl-publish-confirm),
body:has(#cl-shopping-product-page) .flat-modal.cl-common-modal:has(.cl-publish-confirm),
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-publish-confirm-wrap,
body:has(#cl-shopping-product-page) .flat-modal.cl-common-modal.cl-publish-confirm-wrap {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  overflow: hidden !important;
  z-index: 1000003 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.cl-publish-confirm) > .modal-default,
body:has(#cl-shopping-product-page) .flat-modal.cl-common-modal:has(.cl-publish-confirm) > .modal-default,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-publish-confirm-wrap > .modal-default,
body:has(#cl-shopping-product-page) .flat-modal.cl-common-modal.cl-publish-confirm-wrap > .modal-default {
  position: fixed !important;
  inset: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100vw !important;
  height: 100vh !important;
  margin: 0 !important;
  padding: 24px 16px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  background: rgba(0, 0, 0, .45) !important;
  z-index: 1000003 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.cl-publish-confirm) + .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.cl-publish-confirm) .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.cl-publish-confirm) + .modal-backdrop.fade.in,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.cl-publish-confirm) .modal-backdrop.fade.in,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-publish-confirm-wrap + .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-publish-confirm-wrap .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-publish-confirm-wrap + .modal-backdrop.fade.in,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-publish-confirm-wrap .modal-backdrop.fade.in,
body:has(#cl-shopping-product-page) .flat-modal.cl-common-modal:has(.cl-publish-confirm) + .modal-backdrop,
body:has(#cl-shopping-product-page) .flat-modal.cl-common-modal:has(.cl-publish-confirm) .modal-backdrop,
body:has(#cl-shopping-product-page) .flat-modal.cl-common-modal:has(.cl-publish-confirm) + .modal-backdrop.fade.in,
body:has(#cl-shopping-product-page) .flat-modal.cl-common-modal:has(.cl-publish-confirm) .modal-backdrop.fade.in,
body:has(#cl-shopping-product-page) .flat-modal.cl-common-modal.cl-publish-confirm-wrap + .modal-backdrop,
body:has(#cl-shopping-product-page) .flat-modal.cl-common-modal.cl-publish-confirm-wrap .modal-backdrop,
body:has(#cl-shopping-product-page) .flat-modal.cl-common-modal.cl-publish-confirm-wrap + .modal-backdrop.fade.in,
body:has(#cl-shopping-product-page) .flat-modal.cl-common-modal.cl-publish-confirm-wrap .modal-backdrop.fade.in {
  background: transparent !important;
  opacity: 0 !important;
  z-index: 1000002 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.cl-publish-confirm,
body:has(#cl-shopping-product-page) .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.cl-publish-confirm {
  width: min(460px, calc(100vw - 32px)) !important;
  max-width: min(460px, calc(100vw - 32px)) !important;
  margin: 0 auto !important;
  padding: 0 !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default.in .modal-dialog.cl-cmmodal.cl-publish-confirm,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default.fade .modal-dialog.cl-cmmodal.cl-publish-confirm,
body:has(#cl-shopping-product-page) .flat-modal.cl-common-modal .modal-default.in .modal-dialog.cl-cmmodal.cl-publish-confirm,
body:has(#cl-shopping-product-page) .flat-modal.cl-common-modal .modal-default.fade .modal-dialog.cl-cmmodal.cl-publish-confirm {
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.cl-publish-confirm .modal-content,
body:has(#cl-shopping-product-page) .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.cl-publish-confirm .modal-content {
  position: relative !important;
  width: 100% !important;
  min-height: 0 !important;
  padding: 38px 40px 30px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 18px !important;
  box-shadow: 0 20px 50px rgba(20, 24, 32, .24) !important;
  color: var(--cl-text) !important;
  font-family: var(--cl-font) !important;
  letter-spacing: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.cl-publish-confirm .modal-body,
body:has(#cl-shopping-product-page) .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.cl-publish-confirm .modal-body {
  width: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 22px !important;
  letter-spacing: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.cl-publish-confirm .modal-title,
body:has(#cl-shopping-product-page) .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.cl-publish-confirm .modal-title {
  margin: 0 34px 24px !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-size: 22px !important;
  font-weight: 800 !important;
  line-height: 30px !important;
  letter-spacing: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.cl-publish-confirm p,
body:has(#cl-shopping-product-page) .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.cl-publish-confirm p {
  margin: 0 !important;
  color: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  line-height: inherit !important;
  letter-spacing: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.cl-publish-confirm p.publish-site-link,
body:has(#cl-shopping-product-page) .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.cl-publish-confirm p.publish-site-link {
  padding: 6px 0 4px !important;
  border: 0 !important;
  margin: 0 !important;
  color: var(--cl-text) !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.cl-publish-confirm .modal-content > .close.close-button-dialog,
body:has(#cl-shopping-product-page) .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.cl-publish-confirm .modal-content > .close.close-button-dialog {
  position: absolute !important;
  top: 16px !important;
  right: 14px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub) !important;
  opacity: 1 !important;
  transition: background-color .12s, transform .18s cubic-bezier(.34, 1.56, .64, 1);
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.cl-publish-confirm .modal-content > .close.close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.cl-publish-confirm .modal-content > .close.close-button-dialog:focus,
body:has(#cl-shopping-product-page) .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.cl-publish-confirm .modal-content > .close.close-button-dialog:hover,
body:has(#cl-shopping-product-page) .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.cl-publish-confirm .modal-content > .close.close-button-dialog:focus {
  background: #f1f2f5 !important;
  color: var(--cl-text) !important;
  outline: 0 !important;
  transform: rotate(90deg);
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.cl-publish-confirm .modal-content > .close.close-button-dialog svg,
body:has(#cl-shopping-product-page) .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.cl-publish-confirm .modal-content > .close.close-button-dialog svg {
  display: block !important;
  width: 11px !important;
  height: 11px !important;
  fill: currentColor !important;
  stroke: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.cl-publish-confirm .modal-footer,
body:has(#cl-shopping-product-page) .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.cl-publish-confirm .modal-footer {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  width: 250px !important;
  max-width: 100% !important;
  margin: 32px auto 0 !important;
  padding: 0 !important;
  border: 0 !important;
  text-align: center !important;
  gap: 12px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.cl-publish-confirm .modal-footer > .ok-button-dialog,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.cl-publish-confirm .modal-footer > .ok-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.cl-publish-confirm .modal-footer > .ok-button-dialog:focus,
body:has(#cl-shopping-product-page) .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.cl-publish-confirm .modal-footer > .ok-button-dialog,
body:has(#cl-shopping-product-page) .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.cl-publish-confirm .modal-footer > .ok-button-dialog:hover,
body:has(#cl-shopping-product-page) .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.cl-publish-confirm .modal-footer > .ok-button-dialog:focus {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 46px !important;
  margin: 0 !important;
  padding: 0 18px !important;
  background: var(--cl-green) !important;
  border: 1px solid var(--cl-green) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.cl-publish-confirm .modal-footer > .ok-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.cl-publish-confirm .modal-footer > .ok-button-dialog:focus,
body:has(#cl-shopping-product-page) .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.cl-publish-confirm .modal-footer > .ok-button-dialog:hover,
body:has(#cl-shopping-product-page) .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.cl-publish-confirm .modal-footer > .ok-button-dialog:focus {
  background: var(--cl-green-hover) !important;
  border-color: var(--cl-green-hover) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.cl-publish-confirm .modal-footer > .close-button-dialog,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.cl-publish-confirm .modal-footer > .close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.cl-publish-confirm .modal-footer > .close-button-dialog:focus,
body:has(#cl-shopping-product-page) .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.cl-publish-confirm .modal-footer > .close-button-dialog,
body:has(#cl-shopping-product-page) .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.cl-publish-confirm .modal-footer > .close-button-dialog:hover,
body:has(#cl-shopping-product-page) .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.cl-publish-confirm .modal-footer > .close-button-dialog:focus {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 46px !important;
  min-height: 46px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 9px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.cl-publish-confirm .modal-footer > .close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.cl-publish-confirm .modal-footer > .close-button-dialog:focus,
body:has(#cl-shopping-product-page) .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.cl-publish-confirm .modal-footer > .close-button-dialog:hover,
body:has(#cl-shopping-product-page) .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal.cl-publish-confirm .modal-footer > .close-button-dialog:focus {
  background: #eaf9f1 !important;
  color: var(--cl-green-text) !important;
}

/* 리디자인 사이트 프로필 수정 팝업 */
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-basic-profile-modal) {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  overflow: auto !important;
  background: rgba(0, 0, 0, .45) !important;
  z-index: 999999 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-basic-profile-modal) + .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-basic-profile-modal) + .modal-backdrop.fade,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-basic-profile-modal) + .modal-backdrop.in,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-basic-profile-modal) + .modal-backdrop.fade.in {
  background: transparent !important;
  opacity: 0 !important;
  z-index: 999998 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-basic-profile-modal) > .modal-default {
  box-sizing: border-box !important;
  position: fixed !important;
  inset: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100vw !important;
  height: 100vh !important;
  height: 100dvh !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 16px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  background: transparent !important;
  z-index: inherit !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-basic-profile-modal) > .modal-default > .cl-mobile-btn.close {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal {
  width: min(460px, calc(100vw - 32px)) !important;
  max-width: min(460px, calc(100vw - 32px)) !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 auto !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal .modal-content {
  position: relative !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 34px 36px 30px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 14px !important;
  box-shadow: 0 24px 64px rgba(0, 0, 0, .28) !important;
  color: var(--cl-text) !important;
  font-family: var(--cl-source-font) !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal .modal-body {
  width: 100% !important;
  max-width: none !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal .modal-title {
  margin: 0 34px 26px !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-size: 20px !important;
  font-weight: 800 !important;
  line-height: 28px !important;
  letter-spacing: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal .modal-content > .close.close-button-dialog {
  position: absolute !important;
  top: 18px !important;
  right: 18px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text-muted) !important;
  opacity: 1 !important;
  transition: color .15s, background .15s, transform .18s cubic-bezier(.34, 1.56, .64, 1) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal .modal-content > .close.close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal .modal-content > .close.close-button-dialog:focus {
  background: #f1f2f5 !important;
  color: var(--cl-text) !important;
  outline: 0 !important;
  transform: rotate(90deg) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal .modal-content > .close.close-button-dialog svg {
  display: block !important;
  width: 18px !important;
  height: 18px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal .dashboard-profile {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal .dashboard-userimg,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal .dashboard-userimg.dashboard-user-wrap {
  float: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 112px !important;
  min-width: 112px !important;
  max-width: 112px !important;
  height: 112px !important;
  min-height: 112px !important;
  max-height: 112px !important;
  margin: 0 auto 16px !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: #e9ecf0 !important;
  border-radius: 50% !important;
  color: #b4bac3 !important;
  cursor: default !important;
  z-index: auto !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal .dashboard-userimg svg {
  display: block !important;
  width: 112px !important;
  height: 112px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal .fileinput-button.profile-text-box {
  float: none !important;
  display: inline-block !important;
  width: auto !important;
  height: auto !important;
  margin: 0 auto !important;
  padding: 0 !important;
  overflow: hidden !important;
  vertical-align: top !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal .fileinput-button.profile-text-box label {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: 0 !important;
  height: 38px !important;
  margin: 0 !important;
  padding: 0 20px !important;
  background: #fff !important;
  border: 1px solid #b7c7e8 !important;
  border-radius: 8px !important;
  color: #3a7be0 !important;
  cursor: pointer !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  transition: background .12s, border-color .12s !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal .fileinput-button.profile-text-box:hover label,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal .fileinput-button.profile-text-box:focus-within label {
  background: #f4f8fe !important;
  border-color: #9db3df !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal .fileinput-button.profile-text-box input[type="file"],
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal #siteProfilefileupload.modal-upload-button {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  opacity: 0 !important;
  cursor: pointer !important;
  clip: auto !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal .modal-body .p-text {
  margin: 10px 0 0 !important;
  padding: 0 !important;
  color: var(--cl-text-muted) !important;
  font-size: 12.5px !important;
  font-weight: 400 !important;
  line-height: 18px !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal .section-username {
  float: none !important;
  display: block !important;
  width: 100% !important;
  margin: 22px 0 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal .section-username .input-group,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal .section-username .cl-common-form-wrap,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal .section-username .cl-common-form-group {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal .section-username > .input-group,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal .section-username > .cl-common-form-wrap {
  margin-bottom: 20px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal .section-username .input-userNickname {
  display: block !important;
  width: 100% !important;
  height: 46px !important;
  margin: 0 !important;
  padding: 0 14px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 44px !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal .section-username .input-userNickname:focus {
  border-color: var(--cl-green) !important;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .12) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal .section-username .input-userNickname.has-error {
  border-color: var(--cl-danger) !important;
  box-shadow: 0 0 0 3px rgba(255, 77, 79, .12) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal .section-username .change-username-label,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal .section-username .input-userNickname:focus ~ .change-username-label,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal .section-username .input-userNickname:valid ~ .change-username-label {
  position: absolute !important;
  top: -8px !important;
  left: 12px !important;
  display: inline-flex !important;
  align-items: center !important;
  width: auto !important;
  height: 16px !important;
  margin: 0 !important;
  padding: 0 5px !important;
  background: #fff !important;
  color: var(--cl-text-muted) !important;
  font-size: 11.5px !important;
  font-weight: 400 !important;
  line-height: 16px !important;
  letter-spacing: 0 !important;
  text-align: left !important;
  pointer-events: none !important;
  transform: none !important;
  z-index: 2 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal .section-username .siteprofileImg_notice,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal.modal-dialog .section-username p.siteprofileImg_notice {
  float: none !important;
  display: flex !important;
  align-items: flex-start !important;
  width: 100% !important;
  margin: 0 2px !important;
  padding: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 12.5px !important;
  font-weight: 400 !important;
  line-height: 1.7 !important;
  text-align: left !important;
  word-break: keep-all !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal .section-username .profilenotice_icon {
  float: none !important;
  flex: 0 0 auto !important;
  width: auto !important;
  margin: 0 4px 0 0 !important;
  color: var(--cl-text-sub) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal .section-username .profilenotice_txt {
  float: none !important;
  flex: 1 1 auto !important;
  width: auto !important;
  min-width: 0 !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal .modal-footer {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  width: 100% !important;
  max-width: none !important;
  margin: 26px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  gap: 14px !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal .modal-footer > .btn {
  float: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: none !important;
  height: 46px !important;
  min-height: 46px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  border-radius: 9px !important;
  box-shadow: none !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  text-decoration: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal .modal-footer > .ok-button-dialog,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal .modal-footer > .ok-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal .modal-footer > .ok-button-dialog:focus {
  order: 1 !important;
  background: var(--cl-green) !important;
  border: 1px solid var(--cl-green) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal .modal-footer > .ok-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal .modal-footer > .ok-button-dialog:focus {
  background: var(--cl-green-hover) !important;
  border-color: var(--cl-green-hover) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal .modal-footer > .close-button-dialog,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal .modal-footer > .close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal .modal-footer > .close-button-dialog:focus {
  order: 2 !important;
  background: transparent !important;
  border: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal .modal-footer > .close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal .modal-footer > .close-button-dialog:focus {
  background: #eaf9f0 !important;
  color: var(--cl-green-text) !important;
  outline: 0 !important;
}

@media (max-width: 640px), (max-height: 700px) {
  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-basic-profile-modal),
  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-basic-profile-modal) > .modal-default {
    box-sizing: border-box !important;
    height: 100vh !important;
    height: 100dvh !important;
    min-height: 0 !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-basic-profile-modal) > .modal-default {
    align-items: center !important;
    padding: 16px 12px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal {
    width: min(460px, calc(100vw - 24px)) !important;
    max-width: min(460px, calc(100vw - 24px)) !important;
    max-height: calc(100vh - 32px) !important;
    max-height: calc(100dvh - 32px) !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal .modal-content {
    max-height: calc(100vh - 32px) !important;
    max-height: calc(100dvh - 32px) !important;
    padding: 28px 20px 20px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-profile-modal .modal-title {
    margin: 0 34px 20px !important;
  }
}

/* 기본설정 사이트 대표 이미지 팝업 */
body.cl-dashboard-redesign-page.cl-basic-site-screen-modal-open {
  overflow: hidden !important;
}

body.cl-dashboard-redesign-page .cl-basic-site-screen-modal {
  box-sizing: border-box !important;
  position: fixed !important;
  inset: 0 !important;
  display: none !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100vw !important;
  height: 100vh !important;
  padding: 60px 16px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  background: rgba(20, 24, 32, .45) !important;
  z-index: 999999 !important;
}

body.cl-dashboard-redesign-page .cl-basic-site-screen-modal.is-open {
  display: flex !important;
}

body.cl-dashboard-redesign-page .cl-basic-site-screen-dialog {
  box-sizing: border-box !important;
  position: relative !important;
  width: 460px !important;
  max-width: 94vw !important;
  margin: 0 !important;
  padding: 34px 36px 30px !important;
  background: #fff !important;
  border: 0 !important;
  border-radius: 14px !important;
  box-shadow: 0 24px 64px rgba(20, 24, 32, .28) !important;
  color: var(--cl-text) !important;
}

body.cl-dashboard-redesign-page .cl-basic-site-screen-dialog *,
body.cl-dashboard-redesign-page .cl-basic-site-screen-dialog *::before,
body.cl-dashboard-redesign-page .cl-basic-site-screen-dialog *::after {
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .cl-basic-site-screen-close {
  position: absolute !important;
  top: 18px !important;
  right: 18px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  min-width: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px !important;
  color: var(--cl-text-sub) !important;
  cursor: pointer !important;
  font-size: 0 !important;
  line-height: 0 !important;
  transition: color .15s, background .15s, transform .18s cubic-bezier(.34, 1.56, .64, 1) !important;
}

body.cl-dashboard-redesign-page .cl-basic-site-screen-close:hover,
body.cl-dashboard-redesign-page .cl-basic-site-screen-close:focus {
  background: #f1f2f5 !important;
  color: var(--cl-text) !important;
  outline: 0 !important;
  transform: rotate(90deg) !important;
}

body.cl-dashboard-redesign-page .cl-basic-site-screen-close svg {
  display: block !important;
  width: 15px !important;
  height: 15px !important;
  overflow: visible !important;
  fill: currentColor !important;
  stroke: none !important;
}

body.cl-dashboard-redesign-page .cl-basic-site-screen-close svg path {
  fill: currentColor !important;
  stroke: none !important;
}

body.cl-dashboard-redesign-page .cl-basic-site-screen-title {
  margin: 0 0 26px !important;
  padding: 0 36px !important;
  color: var(--cl-text) !important;
  font-size: 20px !important;
  font-weight: 800 !important;
  line-height: 28px !important;
  letter-spacing: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .cl-basic-site-screen-preview-frame {
  display: block !important;
  width: 100% !important;
  aspect-ratio: 650 / 370 !important;
  margin: 0 0 20px !important;
  overflow: hidden !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .cl-basic-site-screen-preview-frame .cl-basic-site-screen-preview {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: 100% !important;
  min-height: 100% !important;
  margin: 0 !important;
  object-fit: contain !important;
  background: #fff !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .cl-basic-site-screen-option {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  min-height: 58px !important;
  padding: 16px 2px !important;
}

body.cl-dashboard-redesign-page .cl-basic-site-screen-option + .cl-basic-site-screen-option {
  border-top: 1px solid var(--cl-border) !important;
}

body.cl-dashboard-redesign-page .cl-basic-site-screen-option-main {
  display: flex !important;
  flex: 1 1 auto !important;
  align-items: flex-start !important;
  min-width: 0 !important;
  gap: 11px !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .cl-basic-site-screen-radio {
  display: inline-grid !important;
  place-content: center !important;
  flex: 0 0 20px !important;
  width: 20px !important;
  height: 20px !important;
  min-width: 20px !important;
  margin: 1px 0 0 !important;
  padding: 0 !important;
  background: #fff !important;
  border: 2px solid var(--cl-border) !important;
  border-radius: 50% !important;
  color: var(--cl-green) !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .cl-basic-site-screen-option.is-active .cl-basic-site-screen-radio,
body.cl-dashboard-redesign-page .cl-basic-site-screen-radio[aria-checked="true"] {
  border-color: var(--cl-green) !important;
}

body.cl-dashboard-redesign-page .cl-basic-site-screen-option.is-active .cl-basic-site-screen-radio::after,
body.cl-dashboard-redesign-page .cl-basic-site-screen-radio[aria-checked="true"]::after {
  content: "" !important;
  display: block !important;
  width: 10px !important;
  height: 10px !important;
  background: var(--cl-green) !important;
  border-radius: 50% !important;
}

body.cl-dashboard-redesign-page .cl-basic-site-screen-option-title {
  display: flex !important;
  align-items: center !important;
  gap: 5px !important;
  color: var(--cl-text) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 20px !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-basic-site-screen-help {
  display: block !important;
  flex: 0 0 13px !important;
  width: 13px !important;
  height: 13px !important;
  fill: #287ff4 !important;
  cursor: default !important;
}

body.cl-dashboard-redesign-page .cl-basic-site-screen-option-desc {
  margin: 3px 0 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 17px !important;
}

body.cl-dashboard-redesign-page .cl-basic-site-screen-ghost {
  display: inline-flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 9px 15px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  color: var(--cl-text-sub) !important;
  cursor: pointer !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 18px !important;
  letter-spacing: 0 !important;
  white-space: nowrap !important;
  transition: background .12s, border-color .12s, color .12s !important;
}

body.cl-dashboard-redesign-page .cl-basic-site-screen-ghost:hover,
body.cl-dashboard-redesign-page .cl-basic-site-screen-ghost:focus {
  background: #fafbfc !important;
  border-color: var(--cl-border) !important;
  color: var(--cl-text) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .cl-basic-site-screen-ghost:disabled,
body.cl-dashboard-redesign-page .cl-basic-site-screen-ghost.is-loading {
  background: #f6f7f9 !important;
  border-color: var(--cl-border) !important;
  color: var(--cl-text-muted) !important;
  cursor: default !important;
  opacity: 1 !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .cl-basic-site-screen-ghost svg {
  display: block !important;
  flex: 0 0 15px !important;
  width: 15px !important;
  height: 15px !important;
  fill: none !important;
  stroke: currentColor !important;
}

body.cl-dashboard-redesign-page .cl-basic-site-screen-refresh svg,
body.cl-dashboard-redesign-page .cl-basic-site-screen-refresh svg path {
  fill: none !important;
  stroke: currentColor !important;
}

body.cl-dashboard-redesign-page .cl-basic-site-screen-upload svg {
  flex-basis: 18px !important;
  width: 18px !important;
  height: 18px !important;
  fill: currentColor !important;
  stroke: none !important;
  transform: translateY(1px) !important;
}

body.cl-dashboard-redesign-page .cl-basic-site-screen-upload svg path {
  fill: currentColor !important;
  stroke: none !important;
}

body.cl-dashboard-redesign-page .cl-basic-site-screen-file {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .cl-basic-site-screen-actions {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: stretch;
  gap: 14px;
  width: 100%;
  margin: 20px 0 0;
  padding: 0;
}

body.cl-dashboard-redesign-page .cl-basic-site-screen-cancel,
body.cl-dashboard-redesign-page .cl-basic-site-screen-primary {
  display: inline-flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 46px !important;
  min-height: 46px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  border-radius: 9px !important;
  box-shadow: none !important;
  cursor: pointer !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  transition: background .13s !important;
}

body.cl-dashboard-redesign-page .cl-basic-site-screen-cancel,
body.cl-dashboard-redesign-page .cl-basic-site-screen-cancel:hover,
body.cl-dashboard-redesign-page .cl-basic-site-screen-cancel:focus {
  order: 2 !important;
  width: 100% !important;
  height: 46px !important;
  min-height: 46px !important;
  padding: 0 16px !important;
  background: transparent !important;
  border: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-basic-site-screen-cancel:hover,
body.cl-dashboard-redesign-page .cl-basic-site-screen-cancel:focus {
  background: var(--cl-green-soft) !important;
  color: var(--cl-green-text) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .cl-basic-site-screen-primary {
  order: 1 !important;
  background: var(--cl-green) !important;
  border: 1px solid var(--cl-green) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .cl-basic-site-screen-primary:hover,
body.cl-dashboard-redesign-page .cl-basic-site-screen-primary:focus {
  background: var(--cl-green-hover) !important;
  border-color: var(--cl-green-hover) !important;
  outline: 0 !important;
}

@media (max-width: 540px) {
  body.cl-dashboard-redesign-page .cl-basic-site-screen-modal {
    padding: 40px 12px !important;
  }

  body.cl-dashboard-redesign-page .cl-basic-site-screen-dialog {
    padding: 32px 20px 24px !important;
  }

  body.cl-dashboard-redesign-page .cl-basic-site-screen-option {
    align-items: flex-start !important;
    flex-direction: column !important;
  }
}

/* 대시보드 대표 이미지 변경 팝업 */
body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  overflow: hidden !important;
  z-index: 999999 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap > .modal-default,
body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap > .modal-default.in,
body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap > .modal-default.show {
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  inset: 0 !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
  width: 100vw !important;
  min-height: 100vh !important;
  margin: 0 !important;
  padding: 60px 16px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  background: rgba(20, 24, 32, .45) !important;
  z-index: 999999 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap + .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap + .modal-backdrop.fade.in {
  background: transparent !important;
  opacity: 0 !important;
  z-index: 999998 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap > .modal-default > .cl-mobile-btn.close {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-default.fade .modal-dialog.cl-screenUpload,
body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-default.in .modal-dialog.cl-screenUpload,
body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-default.show .modal-dialog.cl-screenUpload,
body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload {
  box-sizing: border-box !important;
  width: 460px !important;
  max-width: 94vw !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload *,
body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload *::before,
body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload *::after {
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .modal-content {
  position: relative !important;
  width: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 34px 36px 30px !important;
  overflow: visible !important;
  background: #fff !important;
  border: 0 !important;
  border-radius: 14px !important;
  box-shadow: 0 24px 64px rgba(20, 24, 32, .28) !important;
  color: var(--cl-text) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .modal-content > .close.close-button-dialog {
  position: absolute !important;
  top: 18px !important;
  right: 18px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  min-width: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub) !important;
  cursor: pointer !important;
  font-size: 0 !important;
  line-height: 0 !important;
  opacity: 1 !important;
  text-shadow: none !important;
  transition: color .15s, background .15s, transform .18s cubic-bezier(.34, 1.56, .64, 1) !important;
  z-index: 2 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .modal-content > .close.close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .modal-content > .close.close-button-dialog:focus {
  background: #f1f2f5 !important;
  color: var(--cl-text) !important;
  outline: 0 !important;
  transform: rotate(90deg) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .modal-content > .close.close-button-dialog span,
body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .modal-content > .close.close-button-dialog svg {
  display: block !important;
  width: 15px !important;
  height: 15px !important;
  font-size: 0 !important;
  line-height: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .modal-content > .close.close-button-dialog svg path {
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .modal-body {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: left !important;
  text-indent: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .modal-body h3.modal-title {
  margin: 0 0 26px !important;
  padding: 0 36px !important;
  color: var(--cl-text) !important;
  font-family: var(--cl-source-font) !important;
  font-size: 20px !important;
  font-weight: 800 !important;
  line-height: 28px !important;
  letter-spacing: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .screen-content.cl-source-screen-content {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  list-style: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .screen-content.cl-source-screen-content > .screen-type {
  float: none !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .screen-content.cl-source-screen-content > .cl-source-screen-preview {
  position: relative !important;
  display: block !important;
  margin: 0 0 20px !important;
  overflow: hidden !important;
  aspect-ratio: 650 / 370 !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .cl-source-screen-preview .screen-shot {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: 100% !important;
  min-height: 100% !important;
  margin: 0 !important;
  object-fit: contain !important;
  background: #fff !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .screen-content.cl-source-screen-content > .cl-source-screen-option {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  min-height: 58px !important;
  padding: 16px 2px !important;
  position: relative !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .screen-content.cl-source-screen-content > .cl-source-screen-option + .cl-source-screen-option {
  border-top: 1px solid var(--cl-border) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .cl-source-screen-option-main {
  display: flex !important;
  flex: 1 1 auto !important;
  align-items: flex-start !important;
  gap: 5px !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .cl-source-screen-option-check {
  position: static !important;
  top: auto !important;
  display: flex !important;
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .cl-source-screen-option-check label {
  position: static !important;
  top: auto !important;
  display: flex !important;
  align-items: flex-start !important;
  gap: 11px !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .newcheckboxSvgRadio.cl-source-screen-radio {
  position: relative !important;
  display: inline-grid !important;
  place-content: center !important;
  flex: 0 0 20px !important;
  width: 20px !important;
  height: 20px !important;
  min-width: 20px !important;
  margin: 1px 0 0 !important;
  padding: 0 !important;
  background: #fff !important;
  border: 2px solid var(--cl-border) !important;
  border-radius: 50% !important;
  color: var(--cl-green) !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .newcheckboxSvgRadio.cl-source-screen-radio input {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  opacity: 0 !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .newcheckboxSvgRadio.cl-source-screen-radio svg {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .cl-source-screen-option.active .newcheckboxSvgRadio.cl-source-screen-radio {
  border-color: var(--cl-green) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .cl-source-screen-option.active .newcheckboxSvgRadio.cl-source-screen-radio::after {
  content: "" !important;
  display: block !important;
  width: 10px !important;
  height: 10px !important;
  background: var(--cl-green) !important;
  border-radius: 50% !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .screenshotType {
  display: block !important;
  float: none !important;
  margin: 0 !important;
  color: var(--cl-text) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 20px !important;
  letter-spacing: 0 !important;
  text-align: left !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .screenshotType .recommendImg {
  display: block !important;
  margin: 3px 0 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 17px !important;
  white-space: normal !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .capture-tooltip.cl-source-screen-help {
  display: block !important;
  flex: 0 0 13px !important;
  width: 13px !important;
  height: 13px !important;
  margin: 4px 0 0 !important;
  padding: 0 !important;
  fill: var(--cl-green) !important;
  cursor: default !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .screenshot-filebtn {
  position: relative !important;
  display: inline-flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 9px 15px !important;
  overflow: hidden !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub) !important;
  cursor: pointer !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 18px !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  transition: background .12s, border-color .12s, color .12s !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .screenshot-filebtn:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .screenshot-filebtn:focus {
  background: #fafbfc !important;
  border-color: var(--cl-border) !important;
  color: var(--cl-text) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .screenshot-filebtn > svg {
  position: static !important;
  display: block !important;
  float: none !important;
  flex: 0 0 15px !important;
  width: 15px !important;
  height: 15px !important;
  margin: 0 !important;
  fill: none !important;
  stroke: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .screenshot-filebtn > svg path {
  fill: none !important;
  stroke: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .screenshot-filebtn .fileUpload-icon {
  flex-basis: 18px !important;
  width: 18px !important;
  height: 18px !important;
  fill: currentColor !important;
  stroke: none !important;
  transform: translateY(1px) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .screenshot-filebtn .fileUpload-icon path {
  fill: currentColor !important;
  stroke: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .siteImg-upload-button {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  opacity: 0 !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .modal-footer {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: stretch;
  gap: 14px;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  border: 0;
  text-align: center;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .modal-footer > .btn {
  display: inline-flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 46px !important;
  min-height: 46px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  border-radius: 9px !important;
  box-shadow: none !important;
  cursor: pointer !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  text-decoration: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .modal-footer > .close-button-dialog,
body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .modal-footer > .close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .modal-footer > .close-button-dialog:focus {
  order: 2 !important;
  width: 100% !important;
  height: 46px !important;
  min-height: 46px !important;
  padding: 0 16px !important;
  background: transparent !important;
  border: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .modal-footer > .close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .modal-footer > .close-button-dialog:focus {
  background: var(--cl-green-soft) !important;
  color: var(--cl-green-text) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .modal-footer > .ok-button-dialog,
body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .modal-footer > .ok-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .modal-footer > .ok-button-dialog:focus {
  order: 1 !important;
  background: var(--cl-green) !important;
  border: 1px solid var(--cl-green) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .modal-footer > .ok-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .modal-footer > .ok-button-dialog:focus {
  background: var(--cl-green-hover) !important;
  border-color: var(--cl-green-hover) !important;
  outline: 0 !important;
}

@media (max-width: 540px) {
  body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap > .modal-default,
  body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap > .modal-default.in,
  body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap > .modal-default.show {
    padding: 40px 12px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .modal-content {
    padding: 32px 20px 24px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .modal-body h3.modal-title {
    padding: 0 32px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .screen-content.cl-source-screen-content > .cl-source-screen-option {
    align-items: stretch !important;
    flex-direction: column !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .screenshot-filebtn {
    width: 100% !important;
  }
}

/* 대표 이미지 갱신/업로드 오류 팝업 */
body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-refresh-error-wrap {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  overflow: hidden !important;
  z-index: 1000010 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-refresh-error-wrap > .modal-default,
body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-refresh-error-wrap > .modal-default.in,
body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-refresh-error-wrap > .modal-default.show {
  position: fixed !important;
  inset: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100vw !important;
  min-height: 100vh !important;
  margin: 0 !important;
  padding: 20px !important;
  overflow: auto !important;
  background: rgba(20, 24, 32, .45) !important;
  z-index: 1000010 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-refresh-error-wrap + .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-refresh-error-wrap + .modal-backdrop.fade.in {
  background: transparent !important;
  opacity: 0 !important;
  z-index: 1000009 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-refresh-error-wrap > .modal-default > .cl-mobile-btn.close {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-refresh-error-wrap .modal-default.fade .modal-dialog.cl-screen-refresh-error-modal,
body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-refresh-error-wrap .modal-default.in .modal-dialog.cl-screen-refresh-error-modal,
body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-refresh-error-wrap .modal-default.show .modal-dialog.cl-screen-refresh-error-modal,
body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-refresh-error-wrap .modal-dialog.cl-screen-refresh-error-modal {
  box-sizing: border-box !important;
  width: 420px !important;
  max-width: calc(100vw - 32px) !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-refresh-error-wrap .modal-dialog.cl-screen-refresh-error-modal *,
body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-refresh-error-wrap .modal-dialog.cl-screen-refresh-error-modal *::before,
body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-refresh-error-wrap .modal-dialog.cl-screen-refresh-error-modal *::after {
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-refresh-error-wrap .modal-dialog.cl-screen-refresh-error-modal .modal-content {
  position: relative !important;
  width: 100% !important;
  min-height: 212px !important;
  margin: 0 !important;
  padding: 42px 36px 30px !important;
  overflow: visible !important;
  background: #fff !important;
  border: 0 !important;
  border-radius: 14px !important;
  box-shadow: 0 24px 64px rgba(20, 24, 32, .28) !important;
  color: var(--cl-text) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-refresh-error-wrap .modal-dialog.cl-screen-refresh-error-modal .modal-body {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text-sub) !important;
  font-family: var(--cl-source-font) !important;
  text-align: center !important;
  text-indent: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-refresh-error-wrap .modal-dialog.cl-screen-refresh-error-modal .modal-title {
  margin: 0 34px 18px !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-family: var(--cl-source-font) !important;
  font-size: 20px !important;
  font-weight: 800 !important;
  line-height: 28px !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  text-transform: none !important;
  word-break: keep-all !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-refresh-error-wrap .modal-dialog.cl-screen-refresh-error-modal .cl-screen-refresh-error-message {
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text-sub) !important;
  font-family: var(--cl-source-font) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 22px !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  word-break: keep-all !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-refresh-error-wrap .modal-dialog.cl-screen-refresh-error-modal .modal-footer {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: none !important;
  margin: 30px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-refresh-error-wrap .modal-dialog.cl-screen-refresh-error-modal .modal-footer > .btn,
body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-refresh-error-wrap .modal-dialog.cl-screen-refresh-error-modal .modal-footer > .btn:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-refresh-error-wrap .modal-dialog.cl-screen-refresh-error-modal .modal-footer > .btn:focus {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: none !important;
  height: 46px !important;
  min-height: 46px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  background: var(--cl-green) !important;
  border: 1px solid var(--cl-green) !important;
  border-radius: 9px !important;
  box-shadow: none !important;
  color: #fff !important;
  cursor: pointer !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  text-decoration: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-refresh-error-wrap .modal-dialog.cl-screen-refresh-error-modal .modal-footer > .btn:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-refresh-error-wrap .modal-dialog.cl-screen-refresh-error-modal .modal-footer > .btn:focus {
  background: var(--cl-green-hover) !important;
  border-color: var(--cl-green-hover) !important;
  color: #fff !important;
  outline: 0 !important;
}

@media (max-width: 540px) {
  body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-refresh-error-wrap > .modal-default,
  body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-refresh-error-wrap > .modal-default.in,
  body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-refresh-error-wrap > .modal-default.show {
    align-items: flex-start !important;
    padding: 48px 16px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-refresh-error-wrap .modal-dialog.cl-screen-refresh-error-modal .modal-content {
    padding: 40px 24px 26px !important;
  }
}

/* 리디자인 사이트 복제·이전·삭제 팝업 */
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal:is(.cl-basic-site-clone-modal, .cl-basic-site-transfer-modal) {
  width: 440px !important;
  min-width: 0 !important;
  max-width: calc(100vw - 32px) !important;
  height: auto !important;
  min-height: 0 !important;
  flex-shrink: 0;
  margin: auto !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal:is(.cl-basic-site-clone-modal, .cl-basic-site-transfer-modal) .modal-content {
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  padding-right: 28px !important;
  padding-left: 28px !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal:is(.cl-basic-site-clone-modal, .cl-basic-site-transfer-modal) .modal-body {
  width: 100% !important;
  max-width: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal:is(.cl-basic-site-clone-modal, .cl-basic-site-transfer-modal) :is(.modal-footer, .site-upgrade-notice .btn-box) {
  width: 384px !important;
  max-width: calc(100% + 2px) !important;
  margin-right: auto !important;
  margin-left: auto !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal:is(.cl-basic-site-clone-modal, .cl-basic-site-transfer-modal) :is(.modal-footer > .btn, .site-upgrade-notice .btn-box > .btn) {
  width: 100% !important;
  max-width: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-basic-site-clone-modal-wrap {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  overflow: auto !important;
  background: rgba(0, 0, 0, .45) !important;
  z-index: 999999 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-basic-site-clone-modal-wrap + .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-basic-site-clone-modal-wrap + .modal-backdrop.fade.in {
  background: transparent !important;
  opacity: 0 !important;
  z-index: 999998 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-basic-site-clone-modal-wrap > .modal-default {
  position: fixed !important;
  inset: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100vw !important;
  min-height: 100vh !important;
  margin: 0 !important;
  padding: 24px 16px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  background: transparent !important;
  z-index: inherit !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-basic-site-clone-modal-wrap > .modal-default > .cl-mobile-btn.close,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal > .modal-default:has(> .cl-basic-site-transfer-modal) > .cl-mobile-btn.close {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-basic-site-clone-modal-wrap .modal-dialog.cl-basic-site-clone-modal {
  box-sizing: border-box !important;
  width: min(440px, calc(100vw - 32px)) !important;
  min-width: 0 !important;
  max-width: min(440px, calc(100vw - 32px)) !important;
  height: auto !important;
  min-height: 0 !important;
  margin: auto !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  border-radius: 0 !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-basic-site-clone-modal-wrap .modal-dialog.cl-basic-site-clone-modal .modal-content {
  position: relative !important;
  float: none !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 44px 28px 32px !important;
  overflow: visible !important;
  background: var(--cl-surface, #fff) !important;
  border: 1px solid var(--cl-border, #e5e7eb) !important;
  border-radius: 18px !important;
  box-shadow: 0 20px 50px rgba(20, 24, 32, .25) !important;
  color: var(--cl-text, #222428) !important;
  font-family: var(--cl-source-font) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-basic-site-clone-modal-wrap .modal-dialog.cl-basic-site-clone-modal .modal-body {
  display: block !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text-sub, #8a8f98) !important;
  font-family: var(--cl-source-font) !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-basic-site-clone-modal-wrap .modal-dialog.cl-basic-site-clone-modal .modal-title {
  margin: 0 0 26px !important;
  padding: 0 !important;
  color: var(--cl-text, #222428) !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  line-height: 1.45 !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  word-break: keep-all !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-basic-site-clone-modal-wrap .modal-dialog.cl-basic-site-clone-modal .modal-content > .close.close-button-dialog {
  position: absolute !important;
  top: 16px !important;
  right: 16px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub, #8a8f98) !important;
  opacity: 1 !important;
  transition: color .12s, background-color .12s, transform .18s cubic-bezier(.34, 1.56, .64, 1) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-basic-site-clone-modal-wrap .modal-dialog.cl-basic-site-clone-modal .modal-content > .close.close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-basic-site-clone-modal-wrap .modal-dialog.cl-basic-site-clone-modal .modal-content > .close.close-button-dialog:focus {
  background: var(--cl-bg-3, #f1f2f5) !important;
  color: var(--cl-text, #222428) !important;
  outline: 0 !important;
  transform: rotate(90deg) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-basic-site-clone-modal-wrap .modal-dialog.cl-basic-site-clone-modal .modal-content > .close.close-button-dialog svg {
  display: block !important;
  width: 16px !important;
  height: 16px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-basic-site-clone-modal-wrap .modal-dialog.cl-basic-site-clone-modal .form-horizontal,
body.cl-dashboard-redesign-page .flat-modal.cl-basic-site-clone-modal-wrap .modal-dialog.cl-basic-site-clone-modal .form-group {
  box-sizing: border-box !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-basic-site-clone-modal-wrap .modal-dialog.cl-basic-site-clone-modal .input-group {
  display: flex !important;
  align-items: stretch !important;
  box-sizing: border-box !important;
  width: 100% !important;
  height: 48px !important;
  margin: 0 !important;
  overflow: hidden !important;
  background: var(--cl-surface, #fff) !important;
  border: 1px solid var(--cl-border, #e5e7eb) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  transition: border-color .12s, box-shadow .12s !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-basic-site-clone-modal-wrap .modal-dialog.cl-basic-site-clone-modal .input-group:focus-within {
  border-color: var(--cl-green-action, #03c75a) !important;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .13) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-basic-site-clone-modal-wrap .modal-dialog.cl-basic-site-clone-modal .form-control.input-url-box {
  flex: 1 1 auto !important;
  box-sizing: border-box !important;
  width: 1% !important;
  min-width: 0 !important;
  height: 46px !important;
  margin: 0 !important;
  padding: 0 12px !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: var(--cl-text, #222428) !important;
  font-family: var(--cl-source-font) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 46px !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-basic-site-clone-modal-wrap .modal-dialog.cl-basic-site-clone-modal .form-control.input-url-box::placeholder {
  color: var(--cl-text-muted, #b4b8bf) !important;
  opacity: 1 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-basic-site-clone-modal-wrap .modal-dialog.cl-basic-site-clone-modal .input-group-addon.site {
  position: static !important;
  flex: 0 0 auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  width: auto !important;
  height: 46px !important;
  margin: 0 !important;
  padding: 0 12px 0 8px !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: var(--cl-text-sub, #8a8f98) !important;
  font-family: var(--cl-source-font) !important;
  font-size: 18px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-basic-site-clone-modal-wrap .modal-dialog.cl-basic-site-clone-modal #msg_site {
  min-height: 0 !important;
  margin: 8px 0 0 !important;
  color: var(--cl-danger, #e5484d) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 1.5 !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-basic-site-clone-modal-wrap .modal-dialog.cl-basic-site-clone-modal #msg_site:empty {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-basic-site-clone-modal-wrap .modal-dialog.cl-basic-site-clone-modal .sub-text.site {
  margin: 14px 0 0 !important;
  color: var(--cl-text-sub, #8a8f98) !important;
  font-size: 12.5px !important;
  font-weight: 400 !important;
  line-height: 1.55 !important;
  letter-spacing: 0 !important;
  text-align: left !important;
  word-break: keep-all !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-basic-site-clone-modal-wrap .modal-dialog.cl-basic-site-clone-modal .sub-text.site > span {
  display: block !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-basic-site-clone-modal-wrap .modal-dialog.cl-basic-site-clone-modal .sub-text.site .point {
  margin: 0 0 6px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-basic-site-clone-modal-wrap .modal-dialog.cl-basic-site-clone-modal .modal-footer {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  box-sizing: border-box !important;
  width: 384px !important;
  max-width: calc(100% + 2px) !important;
  margin: 30px auto 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  gap: 12px !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-basic-site-clone-modal-wrap .modal-dialog.cl-basic-site-clone-modal .modal-footer::before,
body.cl-dashboard-redesign-page .flat-modal.cl-basic-site-clone-modal-wrap .modal-dialog.cl-basic-site-clone-modal .modal-footer::after {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-basic-site-clone-modal-wrap .modal-dialog.cl-basic-site-clone-modal .modal-footer > .btn {
  float: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  height: 46px !important;
  min-height: 46px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  border: 1px solid transparent !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  font-family: var(--cl-source-font) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  text-decoration: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-basic-site-clone-modal-wrap .modal-dialog.cl-basic-site-clone-modal .modal-footer > .ok-button-dialog,
body.cl-dashboard-redesign-page .flat-modal.cl-basic-site-clone-modal-wrap .modal-dialog.cl-basic-site-clone-modal .modal-footer > .ok-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-basic-site-clone-modal-wrap .modal-dialog.cl-basic-site-clone-modal .modal-footer > .ok-button-dialog:focus {
  background: var(--cl-green-action, #03c75a) !important;
  border-color: var(--cl-green-action, #03c75a) !important;
  color: #fff !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-basic-site-clone-modal-wrap .modal-dialog.cl-basic-site-clone-modal .modal-footer > .ok-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-basic-site-clone-modal-wrap .modal-dialog.cl-basic-site-clone-modal .modal-footer > .ok-button-dialog:focus {
  background: var(--cl-green-hover, #02b351) !important;
  border-color: var(--cl-green-hover, #02b351) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-basic-site-clone-modal-wrap .modal-dialog.cl-basic-site-clone-modal .modal-footer > .btn.btn-default.close-button-dialog,
body.cl-dashboard-redesign-page .flat-modal.cl-basic-site-clone-modal-wrap .modal-dialog.cl-basic-site-clone-modal .modal-footer > .btn.btn-default.close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-basic-site-clone-modal-wrap .modal-dialog.cl-basic-site-clone-modal .modal-footer > .btn.btn-default.close-button-dialog:focus {
  background: transparent !important;
  border-color: transparent !important;
  color: var(--cl-text-sub, #8a8f98) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-basic-site-clone-modal-wrap .modal-dialog.cl-basic-site-clone-modal .modal-footer > .btn.btn-default.close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-basic-site-clone-modal-wrap .modal-dialog.cl-basic-site-clone-modal .modal-footer > .btn.btn-default.close-button-dialog:focus {
  background: var(--cl-green-soft, #eaf9f1) !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-basic-site-delete-modal),
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-basic-site-delete-countdown-modal) {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  overflow: auto !important;
  background: rgba(0, 0, 0, .45) !important;
  z-index: 999999 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-basic-site-delete-countdown-modal) {
  z-index: 1000000 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-basic-site-delete-modal) + .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-basic-site-delete-countdown-modal) + .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-basic-site-delete-modal) + .modal-backdrop.fade.in,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-basic-site-delete-countdown-modal) + .modal-backdrop.fade.in {
  background: transparent !important;
  opacity: 0 !important;
  z-index: 999998 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-basic-site-delete-countdown-modal) + .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-basic-site-delete-countdown-modal) + .modal-backdrop.fade.in {
  z-index: 999999 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-basic-site-delete-modal) > .modal-default,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-basic-site-delete-countdown-modal) > .modal-default {
  position: fixed !important;
  inset: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100vw !important;
  min-height: 100vh !important;
  margin: 0 !important;
  padding: 24px 16px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  background: transparent !important;
  z-index: inherit !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-basic-site-delete-modal) > .modal-default > .cl-mobile-btn.close,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-basic-site-delete-countdown-modal) > .modal-default > .cl-mobile-btn.close {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-modal,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-countdown-modal {
  width: min(440px, calc(100vw - 32px)) !important;
  max-width: min(440px, calc(100vw - 32px)) !important;
  height: auto !important;
  min-height: 0 !important;
  flex-shrink: 0;
  margin: auto !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-blocked-modal,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-countdown-modal {
  width: min(440px, calc(100vw - 32px)) !important;
  max-width: min(440px, calc(100vw - 32px)) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-modal .modal-content,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-countdown-modal .modal-content {
  position: relative !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 44px 28px 32px !important;
  overflow: visible !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 18px !important;
  box-shadow: 0 20px 50px rgba(20, 24, 32, .25) !important;
  color: var(--cl-text) !important;
  font-family: var(--cl-font) !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-countdown-modal .modal-content {
  padding: 38px 28px 30px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-modal .modal-body,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-countdown-modal .modal-body {
  width: 100% !important;
  max-width: none !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text-sub) !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-modal .modal-title,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-countdown-modal .modal-title {
  margin: 0 34px 22px !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-size: 21px !important;
  font-weight: 800 !important;
  line-height: 30px !important;
  letter-spacing: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-modal .modal-content > .close.close-button-dialog,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-countdown-modal .modal-content > .close.close-button-dialog {
  position: absolute !important;
  top: 16px !important;
  right: 16px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub) !important;
  opacity: 1 !important;
  transition: color .15s, background .15s, transform .18s cubic-bezier(.34, 1.56, .64, 1) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-modal .modal-content > .close.close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-modal .modal-content > .close.close-button-dialog:focus,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-countdown-modal .modal-content > .close.close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-countdown-modal .modal-content > .close.close-button-dialog:focus {
  background: #f1f2f5 !important;
  color: var(--cl-text) !important;
  outline: 0 !important;
  transform: rotate(90deg) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-modal .modal-content > .close.close-button-dialog svg,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-countdown-modal .modal-content > .close.close-button-dialog svg {
  display: block !important;
  width: 18px !important;
  height: 18px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-modal .site-delete,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-modal .site-not-delete {
  width: 100% !important;
  margin: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.7 !important;
  text-align: center !important;
  word-break: keep-all !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-modal .site-delete .top-sub-text {
  margin: 0 0 16px !important;
  color: var(--cl-text) !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  line-height: 1.7 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-modal .site-delete .top-sub-text strong {
  color: var(--cl-text) !important;
  font-weight: 800 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-modal .site-delete .guide-text,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-modal .site-not-delete {
  display: block !important;
  margin: 0 !important;
  padding: 14px 16px !important;
  background: #fff5f5 !important;
  border: 1px solid #ffe1e4 !important;
  border-radius: 10px !important;
  color: var(--cl-danger) !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  line-height: 1.65 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-modal .site-delete .guide-text strong,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-modal .site-not-delete strong {
  color: var(--cl-danger) !important;
  font-weight: 800 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-modal .site-delete hr.divider {
  width: 100% !important;
  height: 1px !important;
  margin: 22px 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-top: 1px solid #f0f1f4 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-modal .site-delete .agreement-info {
  margin: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 1.7 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-modal .site-delete .agreement-info strong,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-modal .site-delete .agreement-info .point {
  color: var(--cl-text) !important;
  font-weight: 800 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-modal .site-delete .agreement-info .site-delete-agreement-keyword {
  display: inline-block;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-modal .site-delete .agreement-box {
  margin: 14px 0 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-modal .site-delete .agreement-input {
  display: block !important;
  width: 100% !important;
  height: 44px !important;
  margin: 0 !important;
  padding: 0 13px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 42px !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-modal .site-delete .agreement-input:focus {
  border-color: var(--cl-green) !important;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .13) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-modal .site-delete .agreement-box .error {
  display: none;
  min-height: 18px !important;
  margin: 8px 0 0 !important;
  color: var(--cl-danger) !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  line-height: 18px !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-modal .modal-footer,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-countdown-modal .modal-footer {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  width: 384px !important;
  max-width: calc(100% + 2px) !important;
  margin: 30px auto 0 !important;
  padding: 0 !important;
  border: 0 !important;
  gap: 12px !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-modal .modal-footer > .btn,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-countdown-modal .modal-footer > .btn {
  float: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: none !important;
  height: 46px !important;
  min-height: 46px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  border-radius: 10px !important;
  box-shadow: none !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  text-decoration: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-confirm-modal .modal-footer > .ok-button-dialog,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-confirm-modal .modal-footer > .ok-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-confirm-modal .modal-footer > .ok-button-dialog:focus {
  order: 1 !important;
  background: var(--cl-danger) !important;
  border: 1px solid var(--cl-danger) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-confirm-modal .modal-footer > .ok-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-confirm-modal .modal-footer > .ok-button-dialog:focus {
  background: #d93f44 !important;
  border-color: #d93f44 !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-blocked-modal .modal-footer > .ok-button-dialog,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-blocked-modal .modal-footer > .ok-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-blocked-modal .modal-footer > .ok-button-dialog:focus {
  order: 1 !important;
  background: var(--cl-green) !important;
  border: 1px solid var(--cl-green) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-blocked-modal .modal-footer > .ok-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-blocked-modal .modal-footer > .ok-button-dialog:focus {
  background: var(--cl-green-hover) !important;
  border-color: var(--cl-green-hover) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-modal .modal-footer > .close-button-dialog,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-modal .modal-footer > .close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-modal .modal-footer > .close-button-dialog:focus,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-countdown-modal .modal-footer > .close-button-dialog,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-countdown-modal .modal-footer > .close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-countdown-modal .modal-footer > .close-button-dialog:focus {
  order: 2 !important;
  background: transparent !important;
  border: 0 !important;
  color: var(--cl-text-sub) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-modal .modal-footer > .close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-modal .modal-footer > .close-button-dialog:focus,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-countdown-modal .modal-footer > .close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-countdown-modal .modal-footer > .close-button-dialog:focus {
  background: #eaf9f1 !important;
  color: var(--cl-green-text) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-countdown-modal .site-deleting {
  width: 100% !important;
  margin: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-countdown-modal .site-deleting .deleting-info {
  margin: 0 0 12px !important;
  color: var(--cl-text-sub) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 22px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-countdown-modal .site-deleting .point {
  color: var(--cl-danger) !important;
  font-size: 36px !important;
  font-weight: 800 !important;
  line-height: 44px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-basic-site-delete-countdown-modal .site-deleting span {
  color: var(--cl-text) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 24px !important;
}

/* 리디자인 사이트 게시 진행 팝업 */
body.cl-dashboard-redesign-page .progressModal.cl-site-publish-progress {
  position: fixed !important;
  inset: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  z-index: 99999999 !important;
  width: 100vw !important;
  height: 100vh !important;
  min-height: 100vh !important;
  padding: 24px 16px !important;
  overflow: hidden !important;
  background: rgba(0, 0, 0, .45) !important;
  color: var(--cl-text) !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .progressModal.cl-site-publish-progress .progress-wrap {
  position: relative !important;
  width: min(460px, calc(100vw - 32px)) !important;
  max-width: min(460px, calc(100vw - 32px)) !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 38px 40px 34px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 18px !important;
  box-shadow: 0 20px 50px rgba(20, 24, 32, .24) !important;
}

body.cl-dashboard-redesign-page .progressModal.cl-site-publish-progress .progress-header {
  padding: 0 !important;
  background: transparent !important;
  color: var(--cl-text-sub) !important;
  font-weight: 400 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .progressModal.cl-site-publish-progress .progress-header h1 {
  margin: 0 0 24px !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-size: 22px !important;
  font-weight: 800 !important;
  line-height: 30px !important;
  letter-spacing: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .progressModal.cl-site-publish-progress #file-upload-progress {
  width: 100% !important;
  height: 8px !important;
  margin: 0 0 16px !important;
  overflow: hidden !important;
  background: #eef0f4 !important;
  border-radius: 999px !important;
}

body.cl-dashboard-redesign-page .progressModal.cl-site-publish-progress .progress-bar {
  height: 100% !important;
  background: var(--cl-green) !important;
  border-radius: inherit !important;
  box-shadow: none !important;
  transition: width .2s ease;
}

body.cl-dashboard-redesign-page .progressModal.cl-site-publish-progress .progress-header .info1,
body.cl-dashboard-redesign-page .progressModal.cl-site-publish-progress .progress-header .info2 {
  float: none !important;
  min-height: 20px !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  line-height: 20px !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .progressModal.cl-site-publish-progress .progress-header .info1 {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
}

body.cl-dashboard-redesign-page .progressModal.cl-site-publish-progress .progress-header .info1 i {
  flex: none !important;
  width: 16px !important;
  height: 16px !important;
  color: var(--cl-green) !important;
  font-size: 14px !important;
  line-height: 16px !important;
}

body.cl-dashboard-redesign-page .progressModal.cl-site-publish-progress .progress-header p {
  display: none !important;
}

body.cl-dashboard-redesign-page .progressModal.cl-site-publish-progress .progress-content {
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .progressModal.cl-site-publish-progress .progress-cancel {
  margin-top: 24px !important;
}

body.cl-dashboard-redesign-page .progressModal.cl-site-publish-progress .progress-cancel .btn,
body.cl-dashboard-redesign-page .progressModal.cl-site-publish-progress .progress-cancel .btn:hover,
body.cl-dashboard-redesign-page .progressModal.cl-site-publish-progress .progress-cancel .btn:focus {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: none !important;
  height: 46px !important;
  min-height: 46px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 9px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .progressModal.cl-site-publish-progress .progress-cancel .btn:hover,
body.cl-dashboard-redesign-page .progressModal.cl-site-publish-progress .progress-cancel .btn:focus {
  background: #eaf9f1 !important;
  color: var(--cl-green-text) !important;
}

@media (max-width: 640px) {
  body.cl-dashboard-redesign-page .progressModal.cl-site-publish-progress .progress-wrap {
    padding: 34px 24px 30px !important;
    border-radius: 16px !important;
  }

  body.cl-dashboard-redesign-page .progressModal.cl-site-publish-progress .progress-header h1 {
    font-size: 20px !important;
    line-height: 28px !important;
  }
}

/* ===== 요금제 관리 > 요금제 이전 팝업 ===== */
body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap,
body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap * {
  box-sizing: border-box;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap {
  --green: #03c75a;
  --green-hover: #02b351;
  --green-text: var(--cl-green-text);
  --green-tint: #f6fdf9;
  --green-soft: #f1fbf5;
  --green-line: #b7e7c9;
  --ink: #222428;
  --ink-2s: #5c616b;
  --ink-2: #8a8f98;
  --ink-3: #b4b8bf;
  --surface: #fff;
  --bg-2: #fafbfc;
  --bg-3: #f1f2f5;
  --border: #e5e7eb;
  --line: #eef0f4;
  --danger: #e5484d;
  --shadow-modal: 0 20px 50px rgba(20, 24, 32, .25);
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  overflow: hidden !important;
  background: rgba(0, 0, 0, .45) !important;
  z-index: 1000003 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap > .modal-default,
body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap > .modal-default.in,
body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap > .modal-default.show {
  position: fixed !important;
  inset: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100vw !important;
  height: 100vh !important;
  margin: 0 !important;
  padding: 24px 16px !important;
  overflow: auto !important;
  background: transparent !important;
  z-index: 1000003 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap + .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap + .modal-backdrop.fade,
body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap + .modal-backdrop.in,
body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .modal-backdrop {
  background: transparent !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap > .modal-default > .cl-mobile-btn.close {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .modal-dialog.cl-source-plan-action-modal,
body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .modal-default.fade .modal-dialog.cl-source-plan-action-modal,
body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .modal-default.in .modal-dialog.cl-source-plan-action-modal,
body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .modal-default.show .modal-dialog.cl-source-plan-action-modal {
  position: relative !important;
  flex: none !important;
  width: min(560px, calc(100vw - 32px)) !important;
  max-width: min(560px, calc(100vw - 32px)) !important;
  height: auto !important;
  max-height: calc(100vh - 48px) !important;
  margin: auto !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .modal-content {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  max-height: calc(100vh - 48px) !important;
  margin: 0 !important;
  padding: 36px 40px 30px !important;
  overflow: hidden !important;
  background: var(--surface) !important;
  border: 1px solid var(--border) !important;
  border-radius: 14px !important;
  box-shadow: var(--shadow-modal) !important;
  color: var(--ink) !important;
  font-family: var(--cl-source-font) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .modal-body {
  display: flex !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  color: var(--ink-2s) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .modal-title {
  flex: none !important;
  height: auto !important;
  margin: 0 36px 18px !important;
  padding: 0 !important;
  color: var(--ink) !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  letter-spacing: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .site-plan-move,
body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .site-plan-connect {
  display: flex !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
  min-height: 0 !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .top-sub-text {
  flex: none !important;
  margin: 0 0 20px !important;
  color: var(--ink-2s) !important;
  font-size: 13.5px !important;
  line-height: 1.6 !important;
  text-align: center !important;
  word-break: keep-all !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .site-list {
  flex: 1 1 auto !important;
  width: 100% !important;
  max-height: 280px !important;
  margin: 0 !important;
  padding: 6px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  background: var(--bg-2) !important;
  border: 1px solid var(--border) !important;
  border-radius: 10px !important;
  list-style: none !important;
  scrollbar-color: #d1d3d5 transparent !important;
  scrollbar-width: thin !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .site-list li {
  width: 100% !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 8px !important;
  transition: background-color .12s ease, box-shadow .12s ease !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .site-list li + li {
  margin-top: 2px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .site-list li:hover {
  background: var(--green-tint) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .site-list li.active {
  background: var(--green-soft) !important;
  box-shadow: inset 0 0 0 1px var(--green-line) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .site-list > li.text-center {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 12px !important;
  color: var(--ink-2) !important;
  font-size: 13px !important;
  line-height: 18px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .site-list .newcheckbox {
  display: block !important;
  width: 100% !important;
  min-height: 40px !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .site-list label {
  display: flex !important;
  float: none !important;
  align-items: center !important;
  gap: 8px !important;
  width: 100% !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 9px 12px !important;
  color: var(--ink-2s) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 18px !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .site-list li.active label {
  color: var(--ink) !important;
  font-weight: 500 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .newcheckboxSvgRadio {
  position: relative !important;
  display: block !important;
  flex: 0 0 18px !important;
  float: none !important;
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .newcheckboxSvgRadio input[type="radio"] {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
  opacity: 0 !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .newcheckboxSvgRadio svg {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  display: block !important;
  width: 18px !important;
  height: 18px !important;
  color: #dbdcdf !important;
  opacity: 1 !important;
  transition: opacity .12s ease !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .newcheckboxSvgRadio svg.active {
  opacity: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .newcheckboxSvgRadio input:checked ~ svg:not(.active) {
  opacity: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .newcheckboxSvgRadio input:checked ~ svg.active {
  opacity: 1 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .newcheckboxSvgRadio:has(input:focus-visible) {
  border-radius: 50% !important;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .13) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .newcheckboxSvgRadio svg circle:first-child {
  fill: none !important;
  stroke: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .newcheckboxSvgRadio svg.active,
body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .newcheckboxSvgRadio svg.active circle {
  color: var(--green) !important;
  stroke: var(--green) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .newcheckboxSvgRadio svg.active circle:last-child {
  fill: var(--green) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .site-list li span {
  float: none !important;
  min-width: 0 !important;
  margin: 0 !important;
  color: inherit !important;
  overflow-wrap: anywhere !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .bottom-text {
  display: flex !important;
  flex: none !important;
  align-items: flex-start !important;
  gap: 6px !important;
  width: 100% !important;
  margin: 18px 0 0 !important;
  padding: 12px 14px !important;
  background: var(--bg-2) !important;
  border: 1px solid var(--line) !important;
  border-radius: 8px !important;
  color: var(--ink-2s) !important;
  font-size: 12px !important;
  line-height: 1.55 !important;
  text-align: left !important;
  word-break: keep-all !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .bottom-text .plannotice_icon,
body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .bottom-text .plannotice_txt {
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  color: inherit !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .bottom-text .plannotice_icon {
  flex: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .error-box {
  display: flex !important;
  float: none !important;
  align-items: flex-start !important;
  gap: 6px !important;
  width: 100% !important;
  margin: 8px 0 0 !important;
  color: var(--danger) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .error-box .error-icon {
  flex: none !important;
  float: none !important;
  margin-top: 2px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .error-box .site-plan-error {
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  color: inherit !important;
  font-size: 12px !important;
  line-height: 18px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .modal-footer {
  display: flex !important;
  flex: none !important;
  flex-direction: column !important;
  gap: 10px !important;
  width: 100% !important;
  max-width: none !important;
  margin: 24px 0 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .modal-footer::before,
body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .modal-footer::after {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .modal-footer > .btn {
  display: flex !important;
  float: none !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 46px !important;
  min-height: 46px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  text-align: center !important;
  text-shadow: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .modal-footer > .ok-button-dialog {
  order: 1 !important;
  background: var(--green) !important;
  border: 1px solid var(--green) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .modal-footer > .ok-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .modal-footer > .ok-button-dialog:focus {
  background: var(--green-hover) !important;
  border-color: var(--green-hover) !important;
  color: #fff !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .modal-footer > .close-button-dialog:not(.ok-button-dialog) {
  order: 2 !important;
  background: transparent !important;
  border: 0 !important;
  color: var(--ink-2s) !important;
  font-weight: 500 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .modal-footer > .close-button-dialog:not(.ok-button-dialog):hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .modal-footer > .close-button-dialog:not(.ok-button-dialog):focus {
  background: var(--green-soft) !important;
  color: var(--cl-green-text) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .modal-content > .close.close-button-dialog {
  position: absolute !important;
  top: 20px !important;
  right: 22px !important;
  z-index: 2 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  appearance: none !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--ink-2) !important;
  font-size: 0 !important;
  line-height: 0 !important;
  opacity: 1 !important;
  transition: background-color .12s ease, color .12s ease, transform .18s cubic-bezier(.34, 1.56, .64, 1) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .modal-content > .close.close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .modal-content > .close.close-button-dialog:focus {
  background: var(--bg-3) !important;
  color: var(--ink) !important;
  outline: 0 !important;
  transform: rotate(90deg) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .modal-content > .close.close-button-dialog span,
body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .modal-content > .close.close-button-dialog svg {
  display: block !important;
  width: 15px !important;
  height: 15px !important;
  fill: currentColor !important;
}

@media (max-width: 640px) {
  body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap > .modal-default,
  body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap > .modal-default.in,
  body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap > .modal-default.show {
    padding: 16px 12px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .modal-dialog.cl-source-plan-action-modal {
    width: calc(100vw - 24px) !important;
    max-width: calc(100vw - 24px) !important;
    max-height: calc(100vh - 32px) !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .modal-content {
    max-height: calc(100vh - 32px) !important;
    padding: 30px 20px 22px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .modal-title {
    margin-bottom: 14px !important;
    font-size: 18px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .top-sub-text {
    margin-bottom: 16px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .site-list {
    max-height: clamp(112px, calc(100vh - 390px), 260px) !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .bottom-text {
    margin-top: 14px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .modal-footer {
    margin-top: 18px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-action-modal-wrap .cl-source-plan-action-modal .modal-content > .close.close-button-dialog {
    top: 14px !important;
    right: 14px !important;
  }
}

/* 요금제 연결 끊기 확인·완료 */
body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-disconnect-modal-wrap .modal-dialog.cl-source-plan-disconnect-modal {
  min-height: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-disconnect-modal-wrap .cl-source-plan-disconnect-modal .site-plan-disconnect {
  width: 100% !important;
  margin: 0 !important;
  color: var(--ink-2s) !important;
  text-align: left !important;
  word-break: keep-all !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-disconnect-modal-wrap .cl-source-plan-disconnect-modal .site-plan-disconnect > ul {
  width: 100% !important;
  margin: 0 !important;
  padding: 6px !important;
  background: var(--bg-2) !important;
  border: 1px solid var(--border) !important;
  border-radius: 10px !important;
  list-style: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-disconnect-modal-wrap .cl-source-plan-disconnect-modal .site-plan-disconnect > ul > li {
  display: flex !important;
  align-items: flex-start !important;
  gap: 8px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 12px 14px !important;
  color: var(--ink-2s) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 1.65 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-disconnect-modal-wrap .cl-source-plan-disconnect-modal .site-plan-disconnect > ul > li + li {
  border-top: 1px solid var(--line) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-disconnect-modal-wrap .cl-source-plan-disconnect-modal .site-plan-disconnect .icon {
  display: block !important;
  flex: 0 0 auto !important;
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  color: var(--ink-2) !important;
  line-height: inherit !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-disconnect-modal-wrap .cl-source-plan-disconnect-modal .site-plan-disconnect .cancel-text {
  display: block !important;
  flex: 1 1 auto !important;
  float: none !important;
  width: auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  color: inherit !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-disconnect-modal-wrap .cl-source-plan-disconnect-modal .site-plan-disconnect .cancel-confirm {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  float: none !important;
  width: 100% !important;
  min-height: 54px !important;
  margin: 18px 0 0 !important;
  padding: 14px 16px !important;
  background: var(--surface) !important;
  border: 1px solid var(--border) !important;
  border-radius: 8px !important;
  color: var(--ink) !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  line-height: 1.55 !important;
  text-align: center !important;
  word-break: keep-all !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-result-modal-wrap .modal-default .modal-dialog.cl-source-plan-action-modal.cl-source-plan-result-modal,
body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-result-modal-wrap .modal-default.fade .modal-dialog.cl-source-plan-action-modal.cl-source-plan-result-modal,
body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-result-modal-wrap .modal-default.in .modal-dialog.cl-source-plan-action-modal.cl-source-plan-result-modal,
body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-result-modal-wrap .modal-default.show .modal-dialog.cl-source-plan-action-modal.cl-source-plan-result-modal,
body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-schedule-modal-wrap .modal-default .modal-dialog.cl-source-plan-action-modal.cl-source-plan-schedule-modal,
body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-schedule-modal-wrap .modal-default.fade .modal-dialog.cl-source-plan-action-modal.cl-source-plan-schedule-modal,
body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-schedule-modal-wrap .modal-default.in .modal-dialog.cl-source-plan-action-modal.cl-source-plan-schedule-modal,
body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-schedule-modal-wrap .modal-default.show .modal-dialog.cl-source-plan-action-modal.cl-source-plan-schedule-modal {
  width: min(430px, calc(100vw - 32px)) !important;
  max-width: min(430px, calc(100vw - 32px)) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-result-modal-wrap .cl-source-plan-result-modal .modal-body,
body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-paypal-notice-modal-wrap .cl-source-plan-paypal-notice-modal .modal-body,
body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-schedule-modal-wrap .cl-source-plan-schedule-modal .modal-body {
  overflow: visible !important;
  color: var(--ink-2s) !important;
  font-size: 13.5px !important;
  line-height: 1.65 !important;
  text-align: center !important;
  word-break: keep-all !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-result-modal-wrap .cl-source-plan-result-modal .modal-title,
body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-paypal-notice-modal-wrap .cl-source-plan-paypal-notice-modal .modal-title,
body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-schedule-modal-wrap .cl-source-plan-schedule-modal .modal-title {
  margin-bottom: 16px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-result-modal-wrap .cl-source-plan-result-modal .modal-footer,
body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-paypal-notice-modal-wrap .cl-source-plan-paypal-notice-modal .modal-footer,
body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-schedule-modal-wrap .cl-source-plan-schedule-modal .modal-footer {
  margin-top: 24px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-schedule-modal-wrap .cl-source-plan-schedule-modal .modal-footer {
  gap: 14px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-paypal-notice-modal-wrap .cl-source-plan-paypal-notice-modal .modal-footer > .btn,
body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-schedule-modal-wrap .cl-source-plan-schedule-modal .modal-footer > .btn {
  font-size: 15px !important;
}

/* 요금제 연결 끊기·해지·PAYPAL 안내: 공통 440px 카드 */
body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-paypal-notice-modal-wrap .modal-default .modal-dialog.cl-source-plan-action-modal.cl-source-plan-paypal-notice-modal,
body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-disconnect-modal-wrap .modal-default .modal-dialog.cl-source-plan-action-modal.cl-source-plan-disconnect-modal,
body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-disconnect-modal-wrap .modal-default.fade .modal-dialog.cl-source-plan-action-modal.cl-source-plan-disconnect-modal,
body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-disconnect-modal-wrap .modal-default.in .modal-dialog.cl-source-plan-action-modal.cl-source-plan-disconnect-modal,
body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-disconnect-modal-wrap .modal-default.show .modal-dialog.cl-source-plan-action-modal.cl-source-plan-disconnect-modal,
body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-cancel-modal-wrap .modal-default .modal-dialog.cl-source-plan-action-modal.cl-source-plan-cancel-modal,
body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-cancel-modal-wrap .modal-default.fade .modal-dialog.cl-source-plan-action-modal.cl-source-plan-cancel-modal,
body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-cancel-modal-wrap .modal-default.in .modal-dialog.cl-source-plan-action-modal.cl-source-plan-cancel-modal,
body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-cancel-modal-wrap .modal-default.show .modal-dialog.cl-source-plan-action-modal.cl-source-plan-cancel-modal {
  width: min(440px, calc(100vw - 32px)) !important;
  max-width: min(440px, calc(100vw - 32px)) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-cancel-modal-wrap .cl-source-plan-cancel-modal .site-plan-cancel,
body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-cancel-modal-wrap .cl-source-plan-cancel-modal .top-sub-text {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--ink-2) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 1.7 !important;
  text-align: center !important;
  word-break: keep-all !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-cancel-modal-wrap .cl-source-plan-cancel-modal .top-sub-text strong {
  color: var(--ink) !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-cancel-modal-wrap .cl-source-plan-cancel-modal .top-sub-text .qna-guide-go {
  display: inline !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-green-text) !important;
  font-weight: 600 !important;
  text-decoration: underline !important;
  text-decoration-thickness: 1px !important;
  text-underline-offset: 2px !important;
  transition: color .12s ease !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-cancel-modal-wrap .cl-source-plan-cancel-modal .top-sub-text .qna-guide-go:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-cancel-modal-wrap .cl-source-plan-cancel-modal .top-sub-text .qna-guide-go:focus {
  color: var(--cl-green-text) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-cancel-modal-wrap .cl-source-plan-cancel-modal .modal-footer {
  margin-top: 24px !important;
}

@media (max-width: 640px) {
  body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-disconnect-modal-wrap .cl-source-plan-disconnect-modal .site-plan-disconnect > ul > li {
    padding: 11px 10px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-disconnect-modal-wrap .cl-source-plan-disconnect-modal .site-plan-disconnect .cancel-confirm {
    min-height: 50px !important;
    margin-top: 14px !important;
    padding: 12px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-result-modal-wrap .modal-default .modal-dialog.cl-source-plan-action-modal.cl-source-plan-result-modal,
  body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-result-modal-wrap .modal-default.fade .modal-dialog.cl-source-plan-action-modal.cl-source-plan-result-modal,
  body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-result-modal-wrap .modal-default.in .modal-dialog.cl-source-plan-action-modal.cl-source-plan-result-modal,
  body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-result-modal-wrap .modal-default.show .modal-dialog.cl-source-plan-action-modal.cl-source-plan-result-modal,
  body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-schedule-modal-wrap .modal-default .modal-dialog.cl-source-plan-action-modal.cl-source-plan-schedule-modal,
  body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-schedule-modal-wrap .modal-default.fade .modal-dialog.cl-source-plan-action-modal.cl-source-plan-schedule-modal,
  body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-schedule-modal-wrap .modal-default.in .modal-dialog.cl-source-plan-action-modal.cl-source-plan-schedule-modal,
  body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-schedule-modal-wrap .modal-default.show .modal-dialog.cl-source-plan-action-modal.cl-source-plan-schedule-modal {
    width: min(430px, calc(100vw - 24px)) !important;
    max-width: min(430px, calc(100vw - 24px)) !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-paypal-notice-modal-wrap .modal-default .modal-dialog.cl-source-plan-action-modal.cl-source-plan-paypal-notice-modal,
  body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-disconnect-modal-wrap .modal-default .modal-dialog.cl-source-plan-action-modal.cl-source-plan-disconnect-modal,
  body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-disconnect-modal-wrap .modal-default.fade .modal-dialog.cl-source-plan-action-modal.cl-source-plan-disconnect-modal,
  body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-disconnect-modal-wrap .modal-default.in .modal-dialog.cl-source-plan-action-modal.cl-source-plan-disconnect-modal,
  body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-disconnect-modal-wrap .modal-default.show .modal-dialog.cl-source-plan-action-modal.cl-source-plan-disconnect-modal,
  body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-cancel-modal-wrap .modal-default .modal-dialog.cl-source-plan-action-modal.cl-source-plan-cancel-modal,
  body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-cancel-modal-wrap .modal-default.fade .modal-dialog.cl-source-plan-action-modal.cl-source-plan-cancel-modal,
  body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-cancel-modal-wrap .modal-default.in .modal-dialog.cl-source-plan-action-modal.cl-source-plan-cancel-modal,
  body.cl-dashboard-redesign-page .flat-modal.cl-source-plan-cancel-modal-wrap .modal-default.show .modal-dialog.cl-source-plan-action-modal.cl-source-plan-cancel-modal {
    width: min(440px, calc(100vw - 24px)) !important;
    max-width: min(440px, calc(100vw - 24px)) !important;
  }
}


body.cl-dashboard-redesign-page .cl-icon,
body.cl-dashboard-redesign-page .cl-icon::before,
body.cl-dashboard-redesign-page .cl-icon::after,
body.cl-dashboard-redesign-page [class^="cl_icon_"],
body.cl-dashboard-redesign-page [class^="cl_icon_"]::before,
body.cl-dashboard-redesign-page [class^="cl_icon_"]::after,
body.cl-dashboard-redesign-page [class*=" cl_icon_"],
body.cl-dashboard-redesign-page [class*=" cl_icon_"]::before,
body.cl-dashboard-redesign-page [class*=" cl_icon_"]::after {
  font-family: "cl_icons" !important;
}

.cl-dashboard-redesign.dashboard {
  background: transparent;
  color: var(--cl-text);
  font-family: inherit;
  padding: 0;
}

.cl-dashboard-redesign.dashboard .container,
body.cl-dashboard-redesign-page .dashbottom-wrap > .dashbottom-container,
body.cl-dashboard-redesign-page .dashboard-section > .container {
  width: auto;
  max-width: var(--cl-content-max);
  margin-right: auto;
  margin-left: auto;
  padding-right: var(--cl-content-pad);
  padding-left: var(--cl-content-pad);
}

.cl-dashboard-redesign.dashboard .multi-columns-row {
  margin-right: 0;
  margin-left: 0;
}

.cl-dashboard-redesign.dashboard .dashboard-top {
  padding-top: 28px;
  padding-bottom: 16px;
}

.cl-dashboard-redesign .site-info {
  display: grid;
  grid-template-columns: minmax(260px, 380px) minmax(0, 1fr);
  gap: 24px;
  align-items: center;
  width: 100%;
  min-height: 220px;
  padding: 22px;
  background: var(--cl-surface);
  border: 1px solid var(--cl-border);
  border-radius: var(--cl-radius-lg);
  box-shadow: var(--cl-shadow-card);
}

.cl-dashboard-redesign .site-info .left,
.cl-dashboard-redesign .site-info .right {
  width: auto;
  min-width: 0;
  padding: 0;
}

.cl-dashboard-redesign .site-info .left .site-img {
  width: 100%;
  max-width: 100%;
  margin: 0;
}

.cl-dashboard-redesign .site-info .img-wrapper {
  overflow: hidden;
  border-radius: 12px;
}

.cl-dashboard-redesign .site-info .right {
  display: flex;
  min-height: 176px;
  flex-direction: column;
  justify-content: center;
}

.cl-dashboard-redesign .dashboard-select-box,
.cl-dashboard-redesign #m-site-select {
  max-width: none;
}

.cl-dashboard-redesign .dashboard-select-box > .btn-group,
.cl-dashboard-redesign #m-site-select {
  width: 100%;
}

.cl-dashboard-redesign .dashboard-select-box .dropdown-toggle,
.cl-dashboard-redesign #m-site-select .dropdown-toggle {
  display: flex;
  align-items: center;
  min-height: 44px;
  gap: 8px;
  padding: 0 14px;
  background: #fbfcfd;
  border: 1px solid var(--cl-border);
  border-radius: var(--cl-radius-md);
  color: var(--cl-text);
  font-size: 14px;
  font-weight: 700;
}

.cl-dashboard-redesign .site-plans {
  display: inline-flex;
  align-items: center;
  height: 22px;
  padding: 0 8px;
  background: var(--cl-green-soft);
  border: 1px solid var(--cl-green-line);
  border-radius: 999px;
  color: var(--cl-green-text);
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
}

.cl-dashboard-redesign .site-data {
  margin-top: 14px;
  padding: 0;
}

.cl-dashboard-redesign .site-data .site-title,
.cl-dashboard-redesign .site-data .site-username,
.cl-dashboard-redesign .site-data #pubhost {
  color: var(--cl-text);
}

.cl-dashboard-redesign .site-data .site-url {
  color: var(--cl-text-sub);
}

.cl-dashboard-redesign .domain-btn.domain,
.cl-dashboard-redesign .domain-btn.set-domain,
.cl-dashboard-redesign .site-toolbar .toolbar a,
.cl-dashboard-redesign .site-view-btn a {
  border-radius: 8px;
  transition: color .12s ease, background-color .12s ease, border-color .12s ease, box-shadow .12s ease, transform .12s ease;
}

.cl-dashboard-redesign .domain-btn.domain,
.cl-dashboard-redesign .domain-btn.set-domain {
  background: var(--cl-green);
  border-color: var(--cl-green);
  color: #fff;
  box-shadow: 0 2px 8px rgba(3, 199, 90, .25);
}

.cl-dashboard-redesign .domain-btn.domain:hover,
.cl-dashboard-redesign .domain-btn.set-domain:hover {
  background: var(--cl-green-hover);
  border-color: var(--cl-green-hover);
}

.cl-dashboard-redesign .site-toolbar {
  margin-top: 18px;
}

.cl-dashboard-redesign .site-toolbar .toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
  padding: 0;
}

.cl-dashboard-redesign .site-toolbar .toolbar > li {
  margin: 0;
}

.cl-dashboard-redesign .site-toolbar .toolbar a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 36px;
  gap: 7px;
  padding: 0 13px;
  background: #fff;
  border: 1px solid var(--cl-border);
  color: var(--cl-text);
  font-size: 13px;
  font-weight: 700;
}

.cl-dashboard-redesign .site-toolbar .toolbar li.active a,
.cl-dashboard-redesign .site-toolbar .toolbar a.upgrade:not(.point) {
  background: var(--cl-green);
  border-color: var(--cl-green);
  color: #fff;
  box-shadow: 0 2px 8px rgba(3, 199, 90, .25);
}

.cl-dashboard-redesign .site-toolbar .toolbar a:hover {
  background: var(--cl-green-soft);
  border-color: var(--cl-green-line);
  color: var(--cl-green-text);
}

.cl-dashboard-redesign .site-toolbar .toolbar li.active a:hover,
.cl-dashboard-redesign .site-toolbar .toolbar a.upgrade:not(.point):hover {
  background: var(--cl-green-hover);
  border-color: var(--cl-green-hover);
  color: #fff;
}

.cl-dashboard-redesign .site-menu {
  background: transparent;
  border: 0;
}

.cl-dashboard-redesign .site-menu .container {
  padding-top: 0;
  padding-bottom: 18px;
}

.cl-dashboard-redesign .site-menu ul {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
  padding: 8px;
  background: var(--cl-surface);
  border: 1px solid var(--cl-border);
  border-radius: var(--cl-radius-lg);
  box-shadow: var(--cl-shadow-panel);
}

.cl-dashboard-redesign .site-menu li {
  float: none;
  margin: 0;
}

.cl-dashboard-redesign .site-menu li a {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 0 14px;
  border: 1px solid transparent;
  border-radius: 8px;
  color: var(--cl-text-sub);
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
}

.cl-dashboard-redesign .site-menu li.active a,
.cl-dashboard-redesign .site-menu li a:hover {
  background: var(--cl-green-soft);
  border-color: var(--cl-green-line);
  color: var(--cl-green-text);
}

body.cl-dashboard-redesign-page .dashbottom-wrap {
  background: transparent;
  padding-bottom: 60px;
}

body.cl-dashboard-redesign-page .dashbottom-wrap .dashbottom-container {
  float: none;
}

body.cl-dashboard-redesign-page .dashbottom-wrap .mobile-title {
  border: 1px solid var(--cl-border);
  border-radius: var(--cl-radius-lg);
  background: var(--cl-surface);
  box-shadow: var(--cl-shadow-panel);
}

body.cl-dashboard-redesign-page .dashbottom-wrap .submenu_navWrap .submenu_nav,
body.cl-dashboard-redesign-page .dashbottom-wrap .site-detail .inner-box,
body.cl-dashboard-redesign-page .dashbottom-wrap .setting-box,
body.cl-dashboard-redesign-page .dashboard-section .dashboard-main-box {
  border-color: var(--cl-border);
  border-radius: var(--cl-radius-lg);
  box-shadow: var(--cl-shadow-panel);
}

body.cl-dashboard-redesign-page .icon-pen svg {
  fill: var(--cl-accent-blue);
}

@layer cl-help-color {
  /* 배송설정의 더보기 span은 도움말 아이콘이 아니라 텍스트 링크다. */
  body:is(.cl-dashboard-redesign-page, .cl-redesign-scroll-page) :is(
    .cm-popover-info:not(:where(.template-row-content > span)), .mkt-help, .mkt-help-dot, .help-ico,
    .inflow-ip-help, .cl_icon_info, .cl_icon_help01,
    .cl-basic-site-screen-help, .cl-source-screen-help,
    .domain-flow-help-icon, .domain-buy-usage-help-icon
  ) {
    color: var(--cl-green, #03C75A) !important;
  }

  body:is(.cl-dashboard-redesign-page, .cl-redesign-scroll-page) :is(
    svg.cm-popover-info, svg.help-ico, svg.cl_icon_info, svg.cl_icon_help01,
    svg.cl-basic-site-screen-help, svg.cl-source-screen-help,
    svg.domain-flow-help-icon, svg.domain-buy-usage-help-icon
  ),
  body:is(.cl-dashboard-redesign-page, .cl-redesign-scroll-page) :is(
    .cl_icon_info, .cl_icon_help01
  ) svg {
    fill: var(--cl-green, #03C75A) !important;
  }

  body:is(.cl-dashboard-redesign-page, .cl-redesign-scroll-page) :is(
    svg.cm-popover-info, svg.help-ico, svg.cl_icon_info, svg.cl_icon_help01,
    svg.cl-basic-site-screen-help, svg.cl-source-screen-help,
    svg.domain-flow-help-icon, svg.domain-buy-usage-help-icon,
    .cl_icon_info svg, .cl_icon_help01 svg
  ) :is(path, rect, circle, ellipse, polygon) {
    fill: var(--cl-green, #03C75A) !important;
  }

  body:is(.cl-dashboard-redesign-page, .cl-redesign-scroll-page) .mkt-help svg {
    color: inherit !important;
    stroke: currentColor !important;
  }

  body:is(.cl-dashboard-redesign-page, .cl-redesign-scroll-page) .mkt-help-dot {
    border-color: currentColor !important;
  }
}

@layer cl-help-cursor {
  body:is(.cl-dashboard-redesign-page, .cl-redesign-scroll-page) :is(
    .cm-popover-info, .help-ico, .inflow-ip-help, .cl_icon_info, .cl_icon_help01,
    .cl-basic-site-screen-help, .cl-source-screen-help,
    .domain-flow-help-icon, .domain-buy-usage-help-icon,
    [data-toggle="popover"], [data-toggle="tooltip"], [data-tip-html], [data-tip]
  ) {
    cursor: default !important;
  }

  body:is(.cl-dashboard-redesign-page, .cl-redesign-scroll-page) :is(
    .cm-popover-info, .help-ico, .inflow-ip-help, .cl_icon_info, .cl_icon_help01,
    .cl-basic-site-screen-help, .cl-source-screen-help,
    .domain-flow-help-icon, .domain-buy-usage-help-icon,
    [data-toggle="popover"], [data-toggle="tooltip"], [data-tip-html], [data-tip]
  ):where(button, a[href], [role="button"], [onclick], .hand,
    [data-trigger~="hover"], [data-trigger~="click"], [data-trigger~="focus"],
    [data-toggle="popover"], [data-toggle="tooltip"], [data-tip-html], [data-tip]) {
    cursor: pointer !important;
  }

  body:is(.cl-dashboard-redesign-page, .cl-redesign-scroll-page) :is(
    .cm-popover-info, .help-ico, .inflow-ip-help, .cl_icon_info, .cl_icon_help01,
    .cl-basic-site-screen-help, .cl-source-screen-help,
    .domain-flow-help-icon, .domain-buy-usage-help-icon,
    [data-toggle="popover"], [data-toggle="tooltip"], [data-tip-html], [data-tip]
  ):where(:disabled, [aria-disabled="true"]) {
    cursor: not-allowed !important;
  }

  body:is(.cl-dashboard-redesign-page, .cl-redesign-scroll-page) :is(
    .cm-popover-info, .help-ico, .inflow-ip-help, .cl_icon_info, .cl_icon_help01,
    .cl-basic-site-screen-help, .cl-source-screen-help,
    .domain-flow-help-icon, .domain-buy-usage-help-icon,
    [data-toggle="popover"], [data-toggle="tooltip"], [data-tip-html], [data-tip]
  ) :where(*) {
    cursor: inherit !important;
  }
}

body.cl-dashboard-redesign-page > .popover {
  z-index: 1600 !important;
}

body.cl-dashboard-redesign-page .popover.cl-persistent-popover,
body.cl-dashboard-redesign-page > .popover.cl-persistent-popover {
  pointer-events: auto;
}

/* 사이트 없음: 사이트별 통계 대신 첫 사이트 생성 화면을 표시한다. */
.cl-dashboard-redesign#cl-dashboard-empty {
  --green: #03c75a;
  --green-hover: #02b351;
  font-family: 'CreatorlinkSansKR', 'Apple SD Gothic Neo', 'Malgun Gothic', -apple-system, BlinkMacSystemFont, sans-serif;
  color: var(--cl-text);
}
.cl-dashboard-redesign#cl-dashboard-empty * { box-sizing: border-box; }
.cl-dashboard-redesign#cl-dashboard-empty .cl-source-topbar {
  gap: 20px;
  background: linear-gradient(90deg, var(--green) 0%, #00c4cb 52%, #2e8bf0 100%);
}
.cl-dashboard-redesign#cl-dashboard-empty .cl-empty-account {
  display: flex;
  align-items: center;
  gap: 16px;
  min-width: 0;
  font-size: 13px;
}
.cl-dashboard-redesign#cl-dashboard-empty .cl-empty-account a {
  color: var(--cl-surface);
  white-space: nowrap;
}
.cl-dashboard-redesign#cl-dashboard-empty .cl-empty-username {
  max-width: 160px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.cl-dashboard-redesign#cl-dashboard-empty .cl-empty-main {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: calc(100vh - var(--cl-source-topbar-h));
  padding: 40px 20px;
}
.cl-dashboard-redesign#cl-dashboard-empty .cl-empty-card {
  width: 720px;
  max-width: 100%;
  padding: 60px 32px;
  border: 1px solid var(--cl-border);
  border-radius: 10px;
  background: var(--cl-surface);
  box-shadow: var(--cl-shadow-card);
  text-align: center;
}
.cl-dashboard-redesign#cl-dashboard-empty .cl-empty-icon {
  width: 48px;
  height: 48px;
  margin-bottom: 24px;
  color: var(--cl-text-muted);
}
.cl-dashboard-redesign#cl-dashboard-empty h1 {
  margin: 0 0 12px;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.5;
  word-break: keep-all;
  overflow-wrap: anywhere;
}
.cl-dashboard-redesign#cl-dashboard-empty .cl-empty-card p {
  margin: 0 0 28px;
  color: var(--cl-text-sub);
  font-size: 13.5px;
  line-height: 1.6;
  word-break: keep-all;
}
.cl-dashboard-redesign#cl-dashboard-empty .create-site {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  padding: 0 20px;
  border: 0;
  border-radius: 8px;
  background: var(--green);
  color: var(--cl-surface);
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: background .12s;
}
.cl-dashboard-redesign#cl-dashboard-empty .create-site svg { width: 18px; height: 18px; }
.cl-dashboard-redesign#cl-dashboard-empty .create-site:not(:disabled):hover,
.cl-dashboard-redesign#cl-dashboard-empty .cl-source-site-add-create:not(:disabled):hover {
  background: var(--green-hover);
}
.cl-dashboard-redesign#cl-dashboard-empty button:disabled {
  opacity: .5;
  cursor: default;
}
.cl-dashboard-redesign#cl-dashboard-empty button:focus-visible,
.cl-dashboard-redesign#cl-dashboard-empty a:focus-visible {
  outline: 2px solid var(--green);
  outline-offset: 3px;
}
.cl-dashboard-redesign#cl-dashboard-empty .cl-source-topbar a:focus-visible { outline-color: var(--cl-surface); }
.cl-dashboard-redesign#cl-dashboard-empty .cl-source-site-add-overlay {
  overflow-y: auto;
  align-items: flex-start;
}
.cl-dashboard-redesign#cl-dashboard-empty .cl-source-site-add-modal {
  flex: none;
  max-width: 100%;
  margin: auto;
  border-radius: 14px;
}
.cl-dashboard-redesign#cl-dashboard-empty .cl-source-site-add-modal h3 { font-size: 20px; font-weight: 700; }
.cl-dashboard-redesign#cl-dashboard-empty .cl-source-site-add-input-row:focus-within {
  border-color: var(--green);
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .13);
}
.cl-dashboard-redesign#cl-dashboard-empty .cl-source-site-add-input-row.has-error { border-color: var(--cl-danger); }
.cl-dashboard-redesign#cl-dashboard-empty .cl-source-site-add-input-row.has-error:focus-within { box-shadow: 0 0 0 3px rgba(229, 72, 77, .13); }
.cl-dashboard-redesign#cl-dashboard-empty .cl-source-site-add-input-row input { width: 0; font-size: 14px; box-shadow: none; }
.cl-dashboard-redesign#cl-dashboard-empty .cl-source-site-add-input-row .suffix { font-size: 14px; color: var(--ink-2s, #5c616b); }
.cl-dashboard-redesign#cl-dashboard-empty .cl-source-site-add-notes { font-size: 13px; line-height: 1.5; }
.cl-dashboard-redesign#cl-dashboard-empty .cl-source-site-add-create,
.cl-dashboard-redesign#cl-dashboard-empty .cl-source-site-add-cancel {
  min-height: 46px;
  border-radius: 8px;
  font-size: 14px;
}
.cl-dashboard-redesign#cl-dashboard-empty .cl-source-site-add-create { background: var(--green); }
.cl-dashboard-redesign#cl-dashboard-empty .cl-source-site-add-close { top: 20px; right: 22px; }
.cl-dashboard-redesign#cl-dashboard-empty .cl-source-site-add-close svg { width: 20px; height: 20px; fill: none; }
@media (max-width: 640px) {
  .cl-dashboard-redesign#cl-dashboard-empty .cl-source-topbar { padding: 0 16px; gap: 12px; }
  .cl-dashboard-redesign#cl-dashboard-empty .cl-source-topnav { display: none; }
  .cl-dashboard-redesign#cl-dashboard-empty .cl-source-logo svg { max-width: 112px; }
  .cl-dashboard-redesign#cl-dashboard-empty .cl-empty-account { gap: 12px; font-size: 12px; }
  .cl-dashboard-redesign#cl-dashboard-empty .cl-empty-username { max-width: 84px; }
  .cl-dashboard-redesign#cl-dashboard-empty .cl-empty-main { padding: 24px 16px; }
  .cl-dashboard-redesign#cl-dashboard-empty .cl-empty-card { padding: 40px 20px; }
  .cl-dashboard-redesign#cl-dashboard-empty .cl-source-site-add-modal { padding: 52px 20px 24px; }
}
@media (prefers-reduced-motion: reduce) {
  .cl-dashboard-redesign#cl-dashboard-empty .cl-source-site-add-modal { animation: none; }
  .cl-dashboard-redesign#cl-dashboard-empty button { transition: none; }
}

/* Dashboard home */
.cl-dashboard-redesign .cl-dashboard-home {
  padding: 4px 0 64px;
}

.cl-dashboard-redesign .cl-dashboard-home > .container > .row {
  margin-right: 0;
  margin-left: 0;
}

.cl-dashboard-redesign .cl-dashboard-home .cl-home-shopping-summary {
  display: block;
  width: 100%;
  margin: 0 0 24px;
}

.cl-dashboard-redesign .cl-dashboard-home .summary-title {
  left: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  max-width: none;
  height: auto;
  min-height: 0;
  margin: 0 0 14px;
  padding: 0;
  transform: none;
}

.cl-dashboard-redesign .cl-dashboard-home .summary-main-title,
.cl-dashboard-redesign .cl-dashboard-home .shopping-sub-title,
.cl-dashboard-redesign .cl-dashboard-home .site-sub-title {
  float: none;
  margin: 0;
  color: var(--cl-text);
  font-size: 16px;
  font-weight: 800;
  line-height: 1.35;
}

.cl-dashboard-redesign .cl-dashboard-home .cl-home-sales-panel {
  float: none;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
}

.cl-dashboard-redesign .cl-dashboard-home .card-container {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
  width: 100%;
  margin: 0 0 24px;
  overflow: visible;
}

.cl-dashboard-redesign .cl-dashboard-home .shopping-card {
  display: flex;
  float: none;
  align-items: center;
  width: auto;
  max-width: none;
  min-height: 104px;
  height: auto;
  gap: 18px;
  margin: 0;
  padding: 16px 22px;
  background: var(--cl-surface) !important;
  border: 1px solid var(--cl-border);
  border-radius: var(--cl-radius-lg);
  box-shadow: var(--cl-shadow-card);
  transition: background-color .15s ease, border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}

.cl-dashboard-redesign .cl-dashboard-home .shopping-card:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 14px rgba(20, 24, 32, .1);
}

.cl-dashboard-redesign .cl-dashboard-home .primary-card:hover {
  background: var(--cl-green-tint) !important;
  border-color: var(--cl-green-line);
}

.cl-dashboard-redesign .cl-dashboard-home .cancel-card:hover {
  background: #f3f5f7 !important;
  border-color: #dbe1e8;
}

.cl-dashboard-redesign .cl-dashboard-home .disabled-card:hover {
  background: #eaf6fc !important;
  border-color: #c4e7f5;
}

.cl-dashboard-redesign .cl-dashboard-home .summary-icon-box {
  display: flex;
  float: none;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 54px;
  height: 54px;
  border-radius: 15px;
  text-align: center;
}

.cl-dashboard-redesign .cl-dashboard-home .primary-card .summary-icon-box {
  background: #03C75A;
}

.cl-dashboard-redesign .cl-dashboard-home .cancel-card .summary-icon-box {
  background: #9cacc3;
}

.cl-dashboard-redesign .cl-dashboard-home .disabled-card .summary-icon-box {
  background: #36b4e4;
}

.cl-dashboard-redesign .cl-dashboard-home .summary-icon-box > img {
  position: static;
  width: 30px;
  max-width: 30px;
  max-height: 30px;
  padding: 0;
  object-fit: contain;
}

.cl-dashboard-redesign .cl-dashboard-home .summary-text-box {
  display: block;
  float: none;
  flex: 1;
  width: auto;
  min-width: 0;
  height: auto;
  color: var(--cl-text);
  text-align: left;
}

.cl-dashboard-redesign .cl-dashboard-home .summary-text-box > .summary-number {
  display: block;
  margin: 0;
  padding: 0;
  color: var(--cl-text);
  font-size: 30px;
  font-weight: 800;
  line-height: 1;
}

.cl-dashboard-redesign .cl-dashboard-home .summary-text-box > .summary-text {
  display: block;
  margin-top: 8px;
  color: var(--cl-text-sub);
  font-size: 14px;
  font-weight: 600;
  line-height: 1.25;
  white-space: nowrap;
}

.cl-dashboard-redesign .cl-dashboard-home .primary-card .summary-text {
  color: var(--cl-green-text);
}

.cl-dashboard-redesign .cl-dashboard-home .cancel-card .summary-text {
  color: #8897ab;
}

.cl-dashboard-redesign .cl-dashboard-home .disabled-card .summary-text {
  color: #2ba0d3;
}

.cl-dashboard-redesign .cl-dashboard-home .statistics-container,
.cl-dashboard-redesign .cl-dashboard-home .main-activity,
.cl-dashboard-redesign .cl-dashboard-home .site-visit,
.cl-dashboard-redesign .cl-dashboard-home .site-space {
  background: var(--cl-surface);
  border: 1px solid var(--cl-border);
  border-radius: var(--cl-radius-lg);
  box-shadow: var(--cl-shadow-panel);
}

.cl-dashboard-redesign .cl-dashboard-home .statistics-container {
  padding: 22px 24px;
}

.cl-dashboard-redesign .cl-dashboard-home .statistics-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  margin: 0 0 16px;
  z-index: 4;
}

.cl-dashboard-redesign .cl-dashboard-home .statistics-nav {
  display: flex;
  float: none;
  align-items: center;
  position: relative;
}

.cl-dashboard-redesign .cl-dashboard-home .statistics-nav > ul {
  display: flex;
  align-items: center;
  gap: 16px;
  margin: 0;
  padding: 0;
  overflow: visible;
}

.cl-dashboard-redesign .cl-dashboard-home .statistics-nav > ul > li {
  float: none;
  height: auto;
  padding: 0;
  color: var(--cl-text-sub);
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
}

.cl-dashboard-redesign .cl-dashboard-home .statistics-nav > ul > li.active,
.cl-dashboard-redesign .cl-dashboard-home .statistics-nav > ul > li:hover {
  color: var(--cl-green-text);
}

.cl-dashboard-redesign .cl-dashboard-home .statistics-nav > ul > li:last-child {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  margin: 0;
  border-radius: 6px;
}

.cl-dashboard-redesign .cl-dashboard-home .statistics-nav > ul > li:last-child:hover {
  background: #f4f5f9;
}

.cl-dashboard-redesign .cl-dashboard-home .shopping-visit-date {
  right: 0;
  top: 36px;
  left: auto;
  width: 342px;
  padding: 12px 20px 20px;
  border: 1px solid var(--cl-border);
  border-radius: 12px;
  box-shadow: var(--cl-shadow-drop);
}

.cl-dashboard-redesign .cl-dashboard-home .shopping-visit-btn {
  height: 30px;
  background: var(--cl-green);
  border-radius: 6px;
  color: #fff;
  font-size: 12px;
  font-weight: 800;
}

.cl-dashboard-redesign .cl-dashboard-home .table-statistics {
  width: 100%;
  padding: 0;
  overflow-x: auto;
  background: transparent;
  border: 1px solid var(--cl-border);
  border-radius: 10px;
}

.cl-dashboard-redesign .cl-dashboard-home .table-statistics > table {
  min-width: 640px;
  border-collapse: collapse;
}

.cl-dashboard-redesign .cl-dashboard-home .table-statistics > table > thead > tr > th {
  padding: 13px 12px;
  background: #fafbfc;
  border-bottom: 1px solid var(--cl-line);
  color: var(--cl-text-sub);
  font-size: 12.5px;
  font-weight: 800;
}

.cl-dashboard-redesign .cl-dashboard-home .table-statistics > table > tbody > tr > td {
  padding: 16px 12px;
  color: var(--cl-text-sub);
  font-size: 13px;
}

.cl-dashboard-redesign .cl-dashboard-home .table-statistics > table > tbody > tr > td:first-child {
  color: var(--cl-text);
  font-size: 15px;
  font-weight: 800;
}

.cl-dashboard-redesign .cl-dashboard-home .table-statistics > table > tbody > tr > td > span {
  margin-right: 3px;
  margin-left: 0;
  color: var(--cl-green-text);
  font-size: 28px;
  font-weight: 800;
}

.cl-dashboard-redesign .cl-dashboard-home .cl-home-main-grid {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(380px, 4fr);
  grid-auto-rows: auto;
  gap: 24px;
  width: 100%;
  max-width: none;
  margin: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.cl-dashboard-redesign .cl-dashboard-home .cl-home-main-grid:after {
  display: none;
}

.cl-dashboard-redesign .cl-dashboard-home .cl-home-main-grid > .dashboard-main {
  position: static;
  float: none;
  width: auto;
  min-width: 0;
  padding: 0;
}

.cl-dashboard-redesign .cl-dashboard-home .cl-home-right,
.cl-dashboard-redesign .cl-dashboard-home .cl-home-left {
  display: contents;
  height: auto;
}

.cl-dashboard-redesign .cl-dashboard-home .cl-home-notification-panel-wrap {
  grid-column: 2;
  grid-row: 1 / span 3;
  min-width: 0;
}

.cl-dashboard-redesign .cl-dashboard-home .cl-home-visit-panel {
  grid-column: 1;
  grid-row: 1;
}

.cl-dashboard-redesign .cl-dashboard-home .cl-home-space-panel {
  grid-column: 1;
  grid-row: 2;
}

.cl-dashboard-redesign .cl-dashboard-home .cl-home-kakao-panel {
  grid-column: 1;
  grid-row: 3;
}

.cl-dashboard-redesign .cl-dashboard-home .main-activity {
  display: flex;
  min-height: 100%;
  flex-direction: column;
  padding: 22px 24px;
}

.cl-dashboard-redesign .cl-dashboard-home .main-activity .site-sub-title {
  display: block;
  margin-bottom: 16px;
}

.cl-dashboard-redesign .cl-dashboard-home .inbox {
  display: flex;
  min-height: 0;
  flex: 1;
  flex-direction: column;
}

.cl-dashboard-redesign .cl-dashboard-home .inbox .nav-tabs {
  display: flex;
  flex: none;
  width: 100%;
  border-bottom: 1px solid var(--cl-border);
}

.cl-dashboard-redesign .cl-dashboard-home .inbox .nav-tabs > li {
  display: block;
  flex: 1;
  width: auto;
}

.cl-dashboard-redesign .cl-dashboard-home .inbox .nav-tabs > li > a {
  display: flex;
  align-items: center;
  justify-content: center;
  height: auto;
  min-height: 58px;
  flex-direction: column;
  gap: 4px;
  margin: 0;
  padding: 9px 4px 12px;
  border: 0;
  border-bottom: 2px solid transparent;
  color: var(--cl-text-muted);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
}

.cl-dashboard-redesign .cl-dashboard-home .inbox .nav-tabs > li > a > div.count {
  color: var(--cl-text-muted);
  font-size: 19px;
  font-weight: 800;
  line-height: 1;
}

.cl-dashboard-redesign .cl-dashboard-home .inbox .nav-tabs > li.active > a,
.cl-dashboard-redesign .cl-dashboard-home .inbox .nav-tabs > li.active > a:hover,
.cl-dashboard-redesign .cl-dashboard-home .inbox .nav-tabs > li.active > a:focus {
  background: transparent;
  border: 0;
  border-bottom: 2px solid var(--cl-green);
  color: var(--cl-green-text);
}

.cl-dashboard-redesign .cl-dashboard-home .inbox .nav-tabs > li.active > a > div.count {
  color: var(--cl-green-text);
}

.cl-dashboard-redesign .cl-dashboard-home .inbox .nav-tabs > li > a:hover,
.cl-dashboard-redesign .cl-dashboard-home .inbox .nav-tabs > li > a:focus {
  background: #fafbfc;
  border-color: transparent;
  color: var(--cl-text);
}

.cl-dashboard-redesign .cl-dashboard-home .inbox .tab-content,
.cl-dashboard-redesign .cl-dashboard-home .inbox .tab-content.empty,
.cl-dashboard-redesign .cl-dashboard-home .inbox .tab-content.not-empty,
.cl-dashboard-redesign .cl-dashboard-home .inbox .tab-content.not-empty.inbox-ctrls-on {
  flex: 1;
  width: 100%;
  min-height: 420px;
  height: 420px;
  margin: 0;
  overflow-x: hidden;
  overflow-y: auto;
  background: #fff;
  border: 0;
  border-radius: 0;
}

.cl-dashboard-redesign .cl-dashboard-home .generalkakaotalk-cls .inbox .tab-content.not-empty,
.cl-dashboard-redesign .cl-dashboard-home .generalkakaotalk-cls .inbox .tab-content.empty,
.cl-dashboard-redesign .cl-dashboard-home .generalkakaotalk-cls .inbox .tab-content.not-empty.inbox-ctrls-on {
  min-height: 420px;
  height: 420px;
}

.cl-dashboard-redesign .cl-dashboard-home .inbox .list-item.row {
  display: flex;
  align-items: flex-start;
  margin: 0;
  padding: 12px 0;
  border-top: 1px solid var(--cl-line);
}

.cl-dashboard-redesign .cl-dashboard-home .inbox .list-item.row:first-child {
  border-top: 0;
}

.cl-dashboard-redesign .cl-dashboard-home .inbox .inbox-list .unread {
  background: var(--cl-green-tint);
}

.cl-dashboard-redesign .cl-dashboard-home .inbox .list-content {
  min-width: 0;
  padding: 0 16px 0 0;
  color: var(--cl-text-sub);
  line-height: 1.5;
}

.cl-dashboard-redesign .cl-dashboard-home .inbox .list-content .ib-name {
  color: var(--cl-green-text);
  font-weight: 800;
}

.cl-dashboard-redesign .cl-dashboard-home .inbox .list-content a {
  max-width: 100%;
  color: var(--cl-text-sub);
}

.cl-dashboard-redesign .cl-dashboard-home .inbox .list-content .list-date {
  color: var(--cl-text-muted);
  font-size: 11.5px;
}

.cl-dashboard-redesign .cl-dashboard-home .inbox .inbox-ctrls {
  flex: none;
  padding: 12px 0 0;
  background: #fff;
  border-top: 1px solid var(--cl-border);
}

.cl-dashboard-redesign .cl-dashboard-home .inbox .inbox-ctrls.show {
  border-right: 0;
  border-bottom: 0;
  border-left: 0;
  border-radius: 0;
}

.cl-dashboard-redesign .cl-dashboard-home .inbox .see-all.on,
.cl-dashboard-redesign .cl-dashboard-home .inbox .see-all.on:hover,
.cl-dashboard-redesign .cl-dashboard-home .inbox .see-all.on:focus,
.cl-dashboard-redesign .cl-dashboard-home .inbox .mark-all-read {
  color: var(--cl-green-text);
  font-size: 13px;
  font-weight: 800;
}

.cl-dashboard-redesign .cl-dashboard-home .inbox .tab-content.empty + .no-updates-list {
  color: var(--cl-text-sub);
}

.cl-dashboard-redesign .cl-dashboard-home .site-visit {
  min-height: 310px;
  margin: 0;
  padding: 22px 24px;
}

.cl-dashboard-redesign .cl-dashboard-home .site-visit .site-sub-title {
  float: none;
  margin-bottom: 14px;
}

.cl-dashboard-redesign .cl-dashboard-home .site-visit .site-date-wrap {
  position: relative;
}

.cl-dashboard-redesign .cl-dashboard-home .site-visit .visit-date {
  position: absolute;
  top: -44px;
  right: 0;
  float: none;
}

.cl-dashboard-redesign .cl-dashboard-home .site-visit .change-date-box {
  display: flex;
  align-items: center;
}

.cl-dashboard-redesign .cl-dashboard-home .site-visit .input-group,
.cl-dashboard-redesign .cl-dashboard-home .shopping-visit-date .input-group {
  float: none;
  overflow: hidden;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
}

.cl-dashboard-redesign .cl-dashboard-home .site-visit .input-group > input[readonly],
.cl-dashboard-redesign .cl-dashboard-home .shopping-visit-date .change-date-box input {
  width: 96px;
  height: 30px;
  padding: 5px 8px;
  color: var(--cl-text-sub);
  font-size: 12.5px;
  font-weight: 700;
}

.cl-dashboard-redesign .cl-dashboard-home .site-visit .input-group + .fa {
  width: 10px;
  height: auto;
  margin: 0 6px;
  background: transparent;
  color: var(--cl-text-muted);
  font-size: 13px;
  line-height: 30px;
}

.cl-dashboard-redesign .cl-dashboard-home .site-visit .input-group + .fa:before {
  content: "-";
}

.cl-dashboard-redesign .cl-dashboard-home .site-visit .visit-info {
  display: flex;
  float: none;
  width: auto;
  margin: 0 0 8px;
  padding: 0;
  text-align: left;
}

.cl-dashboard-redesign .cl-dashboard-home .site-visit .visit-info li {
  display: flex;
  float: none;
  align-items: center;
  gap: 6px;
  line-height: 1.2;
}

.cl-dashboard-redesign .cl-dashboard-home .site-visit .visit-info li:before {
  width: 7px;
  height: 7px;
  margin: 0;
  background: var(--cl-green);
}

.cl-dashboard-redesign .cl-dashboard-home .site-visit .visit-info > li > label,
.cl-dashboard-redesign .cl-dashboard-home .site-visit .visit-info > li > span {
  color: var(--cl-text-sub);
  font-size: 13px;
  line-height: 1.2;
}

.cl-dashboard-redesign .cl-dashboard-home .site-visit .visit-info > li > span {
  color: var(--cl-text);
  font-weight: 800;
}

.cl-dashboard-redesign .cl-dashboard-home .site-visit .visit-chart {
  padding-top: 12px;
  padding-bottom: 0;
}

.cl-dashboard-redesign .cl-dashboard-home .site-visit .visit-chart > canvas {
  width: 100%;
  height: 190px;
}

.cl-dashboard-redesign .cl-dashboard-home .site-visit .analytics-source {
  top: auto;
  right: 0;
  bottom: -2px;
}

.cl-dashboard-redesign .cl-dashboard-home .site-visit .analytics-source a {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0 12px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
  color: var(--cl-text-sub);
  font-size: 12.5px;
  font-weight: 800;
}

.cl-dashboard-redesign .cl-dashboard-home .site-visit .analytics-source a:hover,
.cl-dashboard-redesign .cl-dashboard-home .site-visit .analytics-source a:focus {
  background: #fafbfc;
  border-color: #d5d9e0;
  color: var(--cl-text);
}

.cl-dashboard-redesign .cl-dashboard-home .site-space {
  display: block;
  width: 100%;
  min-height: 0;
  margin: 0;
  padding: 22px 24px;
}

.cl-dashboard-redesign .cl-dashboard-home .site-space .dashboard-subtitle-wrap {
  margin-bottom: 18px;
}

.cl-dashboard-redesign .cl-dashboard-home .site-space .space-captraffic {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.cl-dashboard-redesign .cl-dashboard-home .site-space .space-capacity,
.cl-dashboard-redesign .cl-dashboard-home .site-space .space-traffic {
  display: block;
  width: auto;
  min-width: 0;
  padding: 0;
  text-align: center;
}

.cl-dashboard-redesign .cl-dashboard-home .site-space .space-capacity > .site-sub-title,
.cl-dashboard-redesign .cl-dashboard-home .site-space .space-traffic > .site-sub-title {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 22px;
  margin-bottom: 14px;
  font-size: 14px;
  font-weight: 800;
}

.cl-dashboard-redesign .cl-dashboard-home .site-capacity,
.cl-dashboard-redesign .cl-dashboard-home .site-traffic {
  min-height: 112px;
}

.cl-dashboard-redesign .cl-dashboard-home .site-capacity .circles-wrp,
.cl-dashboard-redesign .cl-dashboard-home .site-traffic .circles-wrp {
  margin: 0 auto;
}

.cl-dashboard-redesign .cl-dashboard-home .site-capacity .circles-text > div,
.cl-dashboard-redesign .cl-dashboard-home .site-traffic .circles-text > div {
  color: var(--cl-text);
  font-weight: 800;
}

.cl-dashboard-redesign .cl-dashboard-home .site-capacity .circles-text div > span.val,
.cl-dashboard-redesign .cl-dashboard-home .site-traffic .circles-text div > span.val {
  display: block;
  margin: 4px 0 0;
  color: var(--cl-text-sub);
  font-size: 11.5px;
  font-weight: 600;
}

.cl-dashboard-redesign .cl-dashboard-home .sitecaptraffic-title {
  margin: 10px 0 0;
  color: var(--cl-text-sub);
  font-size: 12.5px;
  font-weight: 700;
  line-height: 1.25;
}

.cl-dashboard-redesign .cl-dashboard-home .site-capacity + p + .over-box,
.cl-dashboard-redesign .cl-dashboard-home .site-traffic + p + .over-box {
  bottom: 8px;
  border-radius: 8px;
  background: rgba(34, 36, 40, .72);
  font-size: 12px;
}

.cl-dashboard-redesign .cl-dashboard-home .main-kakaotalk-wrap {
  width: 100%;
}

.cl-dashboard-redesign .cl-dashboard-home .main-kakaotalk-wrap .main-pc-wrap {
  display: flex;
  align-items: center;
  min-height: 82px;
  height: auto;
  padding: 18px 20px;
  background: var(--cl-surface);
  border: 1px solid var(--cl-border);
  border-radius: var(--cl-radius-lg);
  box-shadow: var(--cl-shadow-panel);
}

.cl-dashboard-redesign .cl-dashboard-home .main-kakaotalk-wrap .kakao-responsive-wrap-top {
  padding: 0;
}

.cl-dashboard-redesign .cl-dashboard-home .main-kakaotalk-wrap .main-kt-text {
  color: var(--cl-text);
  font-size: 14px;
  font-weight: 800;
}

.cl-dashboard-redesign .cl-dashboard-home .main-kakaotalk-wrap .kakao-responsive-wrap-bottom {
  flex: 1;
  padding: 0;
}

.cl-dashboard-redesign .cl-dashboard-home .main-kakaotalk-wrap .main-input-charge-wrap,
.cl-dashboard-redesign .cl-dashboard-home .main-kakaotalk-wrap .main-input-charge-wrap-en {
  width: 110px;
}

.cl-dashboard-redesign .cl-dashboard-home .main-kakaotalk-wrap .cl-common-form-group input {
  height: 36px;
  background: #f4f5f9 !important;
  border-radius: 8px;
  color: var(--cl-text-sub) !important;
  font-weight: 800;
}

.cl-dashboard-redesign .cl-dashboard-home .main-kakaotalk-wrap .main-btn-upgrade,
.cl-dashboard-redesign .cl-dashboard-home .main-kakaotalk-wrap .main-btn-upgrade-en {
  background: var(--cl-green);
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(3, 199, 90, .22);
}

.cl-dashboard-redesign .cl-dashboard-home .main-kakaotalk-wrap .main-btn-upgrade a,
.cl-dashboard-redesign .cl-dashboard-home .main-kakaotalk-wrap .main-btn-upgrade-en a {
  width: auto;
  min-width: 112px;
  padding: 9px 16px;
  color: #fff;
  font-size: 13px;
  font-weight: 800;
  line-height: 1;
}

.cl-dashboard-redesign .cl-dashboard-home .main-kakaotalk-wrap .main-btn-upgrade:hover,
.cl-dashboard-redesign .cl-dashboard-home .main-kakaotalk-wrap .main-btn-upgrade-en:hover {
  background: var(--cl-green-hover);
}

.cl-dashboard-redesign .cl-dashboard-home .main-kakaotalk-wrap .main-btn-setting svg {
  fill: var(--cl-accent-blue);
}

.cl-dashboard-redesign .cl-dashboard-home .main-kakaotalk-wrap .main-planchk-second,
.cl-dashboard-redesign .cl-dashboard-home .main-kakaotalk-wrap .main-planchk-first {
  color: var(--cl-danger);
  font-size: 11.5px;
  font-weight: 700;
}

@media (max-width: 991px) {
  :root {
    --cl-content-pad: 20px;
  }

  .cl-dashboard-redesign .site-info {
    grid-template-columns: 1fr;
    gap: 18px;
    padding: 18px;
  }

  .cl-dashboard-redesign .site-info .right {
    min-height: 0;
  }

  .cl-dashboard-redesign .cl-dashboard-home .card-container {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .cl-dashboard-redesign .cl-dashboard-home .cl-home-shopping-summary {
    display: none;
  }

  .cl-dashboard-redesign .cl-dashboard-home .cl-home-shopping-mobile {
    display: block;
    margin-bottom: 20px;
    padding: 0;
  }

  .cl-dashboard-redesign .cl-dashboard-home .cl-home-shopping-mobile .summary-main-title {
    margin-bottom: 10px;
    padding: 0;
  }

  .cl-dashboard-redesign .cl-dashboard-home .m-shopping-dashboard {
    padding: 10px 14px;
    background: var(--cl-surface);
    border: 1px solid var(--cl-border);
    border-radius: var(--cl-radius-lg);
    box-shadow: var(--cl-shadow-panel);
  }

  .cl-dashboard-redesign .cl-dashboard-home .m-shopping-card {
    display: flex;
    align-items: center;
    min-height: 54px;
    border-top: 1px solid var(--cl-line);
  }

  .cl-dashboard-redesign .cl-dashboard-home .m-shopping-card:first-child {
    border-top: 0;
  }

  .cl-dashboard-redesign .cl-dashboard-home .m-shopping-card > div {
    float: none;
    height: auto;
    line-height: 1.2;
  }

  .cl-dashboard-redesign .cl-dashboard-home .m-shopping-card > .card-img {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 10px;
    background: var(--cl-green-soft);
  }

  .cl-dashboard-redesign .cl-dashboard-home .m-shopping-card > .card-img > img {
    width: 22px;
    height: 22px;
    object-fit: contain;
  }

  .cl-dashboard-redesign .cl-dashboard-home .m-shopping-card > .card-subject {
    flex: 1;
    width: auto;
    padding-left: 14px;
    color: var(--cl-text);
    font-weight: 700;
  }

  .cl-dashboard-redesign .cl-dashboard-home .m-shopping-card > .card-count {
    flex: none;
    width: auto;
    min-width: 54px;
    color: var(--cl-green-text) !important;
    font-size: 24px;
    font-weight: 800;
    text-align: right;
  }

  .cl-dashboard-redesign .cl-dashboard-home .m-shopping-card:nth-child(1) > .card-count {
    color: var(--cl-green-text) !important;
  }

  .cl-dashboard-redesign .cl-dashboard-home .m-shopping-card:nth-child(2) > .card-count {
    color: #8897ab !important;
  }

  .cl-dashboard-redesign .cl-dashboard-home .m-shopping-card:nth-child(3) > .card-count {
    color: #2ba0d3 !important;
  }

  .cl-dashboard-redesign .cl-dashboard-home .cl-home-main-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .cl-dashboard-redesign .cl-dashboard-home .cl-home-right,
  .cl-dashboard-redesign .cl-dashboard-home .cl-home-left {
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: 100%;
  }

  .cl-dashboard-redesign .cl-dashboard-home .cl-home-left {
    grid-row: 1;
  }

  .cl-dashboard-redesign .cl-dashboard-home .cl-home-right {
    grid-row: 2;
  }

  .cl-dashboard-redesign .cl-dashboard-home .cl-home-notification-panel-wrap,
  .cl-dashboard-redesign .cl-dashboard-home .cl-home-visit-panel,
  .cl-dashboard-redesign .cl-dashboard-home .cl-home-space-panel,
  .cl-dashboard-redesign .cl-dashboard-home .cl-home-kakao-panel {
    grid-column: auto;
    grid-row: auto;
  }

  .cl-dashboard-redesign .cl-dashboard-home .main-act-top-wrap + .main-kakaotalk-wrap {
    display: none !important;
  }

  .cl-dashboard-redesign .cl-dashboard-home .site-space + .main-kakaotalk-wrap {
    display: block !important;
  }

  .cl-dashboard-redesign .cl-dashboard-home .statistics-title {
    display: block;
  }

  .cl-dashboard-redesign .cl-dashboard-home .statistics-nav {
    margin-top: 12px;
    overflow-x: auto;
  }

  .cl-dashboard-redesign .cl-dashboard-home .statistics-nav > ul {
    min-width: max-content;
  }

  .cl-dashboard-redesign .cl-dashboard-home .site-visit .visit-date {
    position: static;
    margin-bottom: 12px;
  }

  .cl-dashboard-redesign .cl-dashboard-home .site-visit .visit-chart > canvas {
    height: 170px;
  }

  .cl-dashboard-redesign .cl-dashboard-home .inbox .tab-content,
  .cl-dashboard-redesign .cl-dashboard-home .inbox .tab-content.empty,
  .cl-dashboard-redesign .cl-dashboard-home .inbox .tab-content.not-empty,
  .cl-dashboard-redesign .cl-dashboard-home .inbox .tab-content.not-empty.inbox-ctrls-on,
  .cl-dashboard-redesign .cl-dashboard-home .generalkakaotalk-cls .inbox .tab-content.not-empty,
  .cl-dashboard-redesign .cl-dashboard-home .generalkakaotalk-cls .inbox .tab-content.empty,
  .cl-dashboard-redesign .cl-dashboard-home .generalkakaotalk-cls .inbox .tab-content.not-empty.inbox-ctrls-on {
    min-height: 360px;
    height: 360px;
  }
}

@media (max-width: 640px) {
  :root {
    --cl-content-pad: 14px;
  }

  .cl-dashboard-redesign.dashboard .dashboard-top {
    padding-top: 18px;
  }

  .cl-dashboard-redesign .site-info {
    border-radius: 12px;
    padding: 14px;
  }

  .cl-dashboard-redesign .site-toolbar .toolbar,
  .cl-dashboard-redesign .site-menu ul {
    overflow-x: auto;
    flex-wrap: nowrap;
    -webkit-overflow-scrolling: touch;
  }

  .cl-dashboard-redesign .site-toolbar .toolbar a,
  .cl-dashboard-redesign .site-menu li a {
    white-space: nowrap;
  }

  .cl-dashboard-redesign .cl-dashboard-home {
    padding-bottom: 40px;
  }

  .cl-dashboard-redesign .cl-dashboard-home .statistics-container,
  .cl-dashboard-redesign .cl-dashboard-home .main-activity,
  .cl-dashboard-redesign .cl-dashboard-home .site-visit,
  .cl-dashboard-redesign .cl-dashboard-home .site-space,
  .cl-dashboard-redesign .cl-dashboard-home .main-kakaotalk-wrap .main-pc-wrap {
    border-radius: 12px;
    padding: 18px;
  }

  .cl-dashboard-redesign .cl-dashboard-home .site-space .space-captraffic {
    grid-template-columns: 1fr;
    gap: 22px;
  }

  .cl-dashboard-redesign .cl-dashboard-home .site-visit .change-date-box {
    overflow-x: auto;
  }

  .cl-dashboard-redesign .cl-dashboard-home .inbox .nav-tabs {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .cl-dashboard-redesign .cl-dashboard-home .inbox .nav-tabs > li {
    flex: 0 0 78px;
  }

  .cl-dashboard-redesign .cl-dashboard-home .main-kakaotalk-wrap .main-pc-wrap {
    display: block;
  }

  .cl-dashboard-redesign .cl-dashboard-home .main-kakaotalk-wrap .kakao-responsive-wrap-bottom {
    display: flex;
    margin-top: 12px;
    padding: 0;
  }
}

/* Source dashboard: visitor statistics */
body.cl-dashboard-redesign-page .cl-dashboard-home .cl-source-visitor-panel {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  height: 349px;
  min-height: 349px;
  margin: 0 !important;
  padding: 22px 24px !important;
  overflow: visible;
  box-sizing: border-box;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .cl-source-visitor-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .cl-source-visitor-panel .site-sub-title {
  float: none;
  margin: 0;
  color: var(--cl-text);
  font-size: 16px;
  font-weight: 700;
  line-height: 1.2;
}

.cl-source-visitor-panel .vcal-wrap {
  position: relative;
  z-index: 30;
  flex: none;
  margin-left: auto;
}

.cl-source-visitor-panel .vperiod {
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
  gap: 8px;
  padding: 7px 12px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
  color: var(--cl-text);
  font-size: 12.5px;
  font-weight: 600;
  line-height: 1;
  cursor: pointer;
  transition: border-color .12s, background .12s, box-shadow .12s;
}

.cl-source-visitor-panel .vperiod:hover {
  background: #fafbfc;
  border-color: #d5d9e0;
}

.cl-source-visitor-panel .vperiod:focus-visible {
  outline: none;
  border-color: var(--cl-green);
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .18);
}

.cl-source-visitor-panel .vperiod > svg {
  flex: none;
  width: 14px;
  height: 14px;
  color: var(--cl-text-muted);
}

.cl-source-visitor-panel .vperiod-dash {
  color: var(--cl-text-muted);
  font-weight: 500;
}

.cl-source-visitor-panel .vcal {
  display: none;
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 300;
  width: 288px;
  padding: 14px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 12px;
  box-shadow: 0 12px 30px rgba(20, 24, 32, .16);
}

.cl-source-visitor-panel .vcal.open {
  display: block;
}

.cl-source-visitor-panel .vcal-presets {
  display: flex;
  gap: 6px;
  margin-bottom: 12px;
}

.cl-source-visitor-panel .vcal-preset {
  flex: 1;
  padding: 6px 0;
  background: #f4f5f9;
  border-radius: 6px;
  color: var(--cl-text-sub);
  font-size: 11.5px;
  font-weight: 600;
  text-align: center;
  cursor: pointer;
  transition: background .12s, color .12s;
}

.cl-source-visitor-panel .vcal-preset:hover {
  background: #e4f7ec;
  color: var(--cl-green-text);
}

.cl-source-visitor-panel .vcal-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
}

.cl-source-visitor-panel .vcal-title {
  color: var(--cl-text);
  font-size: 13.5px;
  font-weight: 700;
}

.cl-source-visitor-panel .vcal-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 6px;
  color: var(--cl-text-sub);
  cursor: pointer;
}

.cl-source-visitor-panel .vcal-nav:hover {
  background: #f4f5f9;
  color: var(--cl-text);
}

.cl-source-visitor-panel .vcal-nav svg {
  width: 16px;
  height: 16px;
}

.cl-source-visitor-panel .vcal-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
}

.cl-source-visitor-panel .vcal-wd {
  padding: 4px 0 6px;
  color: var(--cl-text-muted);
  font-size: 11px;
  font-weight: 700;
  text-align: center;
}

.cl-source-visitor-panel .vcal-wd.sun {
  color: #e5484d;
}

.cl-source-visitor-panel .vcal-wd.sat {
  color: var(--cl-green-text);
}

.cl-source-visitor-panel .vcal-day {
  position: relative;
  padding: 7px 0;
  color: var(--cl-text);
  font-size: 12.5px;
  text-align: center;
  cursor: pointer;
}

.cl-source-visitor-panel .vcal-day.other {
  color: var(--cl-text-muted);
  opacity: .45;
}

.cl-source-visitor-panel .vcal-day:hover:not(.sel) {
  background: #f1f2f5;
  border-radius: 6px;
}

.cl-source-visitor-panel .vcal-day.in-range {
  background: #e4f7ec;
  color: var(--cl-green-text);
}

.cl-source-visitor-panel .vcal-day.in-range:hover {
  background: #d6f0e0;
  border-radius: 0;
}

.cl-source-visitor-panel .vcal-day.sel {
  z-index: 1;
  background: var(--cl-green);
  border-radius: 6px;
  color: #fff;
  font-weight: 700;
}

.cl-source-visitor-panel .vcal-day.range-start {
  border-radius: 6px 0 0 6px;
}

.cl-source-visitor-panel .vcal-day.range-end {
  border-radius: 0 6px 6px 0;
}

.cl-source-visitor-panel .vcal-day.today::after {
  position: absolute;
  bottom: 3px;
  left: 50%;
  width: 4px;
  height: 4px;
  background: var(--cl-green);
  border-radius: 50%;
  content: "";
  transform: translateX(-50%);
}

.cl-source-visitor-panel .vcal-day.sel.today::after {
  background: #fff;
}

.cl-source-visitor-panel .cl-source-visitor-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
}

.cl-source-visitor-panel .cl-source-visitor-today {
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--cl-text-sub);
  font-size: 13px;
  line-height: 1.2;
}

.cl-source-visitor-panel .cl-source-visitor-today strong {
  color: var(--cl-text);
  font-weight: 700;
}

.cl-source-visitor-panel .cl-source-visitor-dot {
  display: inline-block;
  flex: none;
  width: 7px;
  height: 7px;
  background: var(--cl-green);
  border-radius: 50%;
}

.cl-source-visitor-panel .cl-source-inflow-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 6px 12px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  color: var(--cl-text-sub);
  font-size: 12.5px;
  font-weight: 600;
  line-height: 1.2;
  text-decoration: none;
  cursor: pointer;
}

.cl-source-visitor-panel .cl-source-inflow-btn:hover,
.cl-source-visitor-panel .cl-source-inflow-btn:focus {
  background: #fafbfc;
  border-color: #d5d9e0;
  color: var(--cl-text);
  text-decoration: none;
}

.cl-source-visitor-panel .cl-source-inflow-btn svg {
  flex: none;
  width: 13px;
  height: 13px;
  color: var(--cl-text-muted);
}

.cl-source-visitor-panel .cl-source-visitor-chart {
  position: relative;
  padding-left: 32px;
}

.cl-source-visitor-panel #visitorSvg {
  display: block;
  width: 100%;
  height: 200px;
}

.cl-source-visitor-panel .cl-source-visitor-area {
  opacity: 0;
  transform: scaleY(.72);
  transform-box: fill-box;
  transform-origin: center bottom;
  animation: clSourceVisitorAreaIn .62s cubic-bezier(.22, 1, .36, 1) .12s forwards;
}

.cl-source-visitor-panel .cl-source-visitor-line {
  stroke-dasharray: 1;
  stroke-dashoffset: 1;
  animation: clSourceVisitorLineDraw .86s cubic-bezier(.22, 1, .36, 1) .08s forwards;
}

.cl-source-visitor-panel .cl-source-visitor-dot-point {
  opacity: 0;
  transform: scale(.35);
  transform-box: fill-box;
  transform-origin: center;
  animation: clSourceVisitorDotIn .34s cubic-bezier(.34, 1.56, .64, 1) forwards;
}

@keyframes clSourceVisitorLineDraw {
  to {
    stroke-dashoffset: 0;
  }
}

@keyframes clSourceVisitorAreaIn {
  to {
    opacity: 1;
    transform: scaleY(1);
  }
}

@keyframes clSourceVisitorDotIn {
  to {
    opacity: 1;
    transform: scale(1);
  }
}

.cl-source-visitor-panel #vYAxis {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  width: 28px;
  height: 200px;
  pointer-events: none;
}

.cl-source-visitor-panel #vYAxis span {
  position: absolute;
  right: 0;
  color: var(--cl-text-muted);
  font-size: 10px;
  line-height: 1;
  white-space: nowrap;
}

.cl-source-visitor-panel #vXAxis {
  position: relative;
  height: 14px;
  margin-top: 2px;
  color: var(--cl-text-sub);
  font-size: 10px;
}

.cl-source-visitor-panel #vXAxis span {
  position: absolute;
  top: 0;
  white-space: nowrap;
  transform: translateX(-50%);
}

.cl-source-visitor-panel .cl-source-visitor-tip {
  display: none;
  position: absolute;
  z-index: 10;
  padding: 9px 12px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
  box-shadow: 0 6px 20px rgba(20, 24, 32, .12);
  pointer-events: none;
  white-space: nowrap;
}

.cl-source-visitor-panel .cl-source-visitor-tip-date {
  margin-bottom: 5px;
  color: var(--cl-text);
  font-size: 12.5px;
  font-weight: 700;
}

.cl-source-visitor-panel .cl-source-visitor-tip-value {
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--cl-text-sub);
  font-size: 12.5px;
}

.cl-source-visitor-panel .cl-source-visitor-tip-value strong {
  margin-left: 2px;
  color: var(--cl-text);
  font-weight: 700;
}

.cl-source-visitor-panel .cl-source-visitor-tip-arrow {
  position: absolute;
  bottom: -6px;
  left: 50%;
  width: 11px;
  height: 11px;
  background: #fff;
  border-right: 1px solid var(--cl-border);
  border-bottom: 1px solid var(--cl-border);
  transform: translateX(-50%) rotate(45deg);
}

@media (max-width: 640px) {
  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-source-visitor-panel {
    height: auto;
    min-height: 349px;
    padding: 18px 16px !important;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-source-visitor-head {
    align-items: flex-start;
    gap: 12px;
  }

  .cl-source-visitor-panel .vperiod {
    gap: 5px;
    padding: 7px 8px;
    font-size: 11.5px;
  }
}

/* Dashboard user helpdesk: keep the close control outside scrolling views. */
body.cl-dashboard-redesign-page .uhd-modal #uhd-closebtn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  padding: 0;
  border-radius: var(--cl-radius-sm);
  color: var(--cl-text-sub) !important;
  opacity: 1;
}

body.cl-dashboard-redesign-page .uhd-modal #uhd-closebtn:hover,
body.cl-dashboard-redesign-page .uhd-modal #uhd-closebtn:focus-visible {
  color: var(--cl-text) !important;
}

body.cl-dashboard-redesign-page .uhd-modal #uhd-closebtn:focus-visible {
  outline: 2px solid var(--cl-green);
  outline-offset: 2px;
}

@media (max-width: 768px) {
  body.cl-dashboard-redesign-page .uhd-modal .desk-container {
    height: 100%;
    height: 100dvh;
    padding-top: calc(52px + env(safe-area-inset-top, 0px));
  }

  /* helpdesk_user.js의 모바일 display:none !important 규칙을 해제한다. */
  body.cl-dashboard-redesign-page .uhd-modal #uhd-closebtn {
    display: inline-flex !important;
    top: calc(4px + env(safe-area-inset-top, 0px)) !important;
    right: calc(8px + env(safe-area-inset-right, 0px)) !important;
    width: 44px;
    height: 44px;
  }
}

/* Source app shell */
:root {
  --cl-source-topbar-h: 56px;
  --cl-source-sidebar-w: 280px;
  --cl-source-app-max: 1920px;
  --cl-source-app-gutter: max(0px, calc(50% - (var(--cl-source-app-max) / 2)));
  --cl-source-gradient: linear-gradient(90deg, #03C75A 0%, #00c4cb 52%, #2e8bf0 100%);
}

body.cl-dashboard-redesign-page {
  min-height: 100vh;
  padding-top: var(--cl-source-topbar-h);
  overflow-y: visible;
  background: var(--cl-page-bg) !important;
}

html {
  overflow-y: scroll;
  scrollbar-gutter: stable;
}

body.cl-dashboard-redesign-page header#nav,
body.cl-dashboard-redesign-page .cl-dashboard-redesign.dashboard .dashboard-top,
body.cl-dashboard-redesign-page .cl-dashboard-redesign.dashboard .site-menu,
body.cl-dashboard-redesign-page #pc-banner-popup,
body.cl-dashboard-redesign-page .site-bestSite,
body.cl-dashboard-redesign-page .creatorlinkqna,
body.cl-dashboard-redesign-page footer#footer,
body.cl-dashboard-redesign-page footer#cl-footer {
  display: none !important;
}

body.cl-dashboard-redesign-page .m-dashboard {
  padding-top: 0 !important;
}

.cl-source-topbar {
  position: fixed;
  top: 0;
  right: var(--cl-source-app-gutter);
  left: var(--cl-source-app-gutter);
  z-index: 1200;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: var(--cl-source-topbar-h);
  padding: 0 24px;
  background: var(--cl-source-gradient);
  color: #fff;
}

.cl-source-logo {
  display: inline-flex;
  align-items: center;
  gap: 0;
  color: #fff;
  line-height: 1;
  text-decoration: none;
}

.cl-source-brand-area {
  position: relative;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  gap: 14px;
  min-width: 0;
}

.cl-source-logo .logo-svg {
  display: block;
  width: auto;
  height: 30px;
}

.cl-source-logo:hover,
.cl-source-logo:focus {
  color: #fff;
  text-decoration: none;
}

.cl-source-logo-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border: 2px solid rgba(255, 255, 255, .92);
  border-radius: 8px;
  font-size: 20px;
  font-weight: 900;
}

.cl-source-logo-text {
  color: #fff;
  letter-spacing: 0;
}

body.cl-dashboard-redesign-page .cl-source-topbar .user_session_refresh.cl-source-user-session-exit {
  position: static !important;
  top: auto !important;
  left: auto !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: auto !important;
  height: 32px !important;
  min-height: 32px;
  padding: 0 12px;
  background: rgba(255, 255, 255, .14) !important;
  border: 1px solid rgba(255, 255, 255, .34) !important;
  border-radius: 8px;
  color: #fff !important;
  font-size: 13px !important;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
  opacity: 1 !important;
  cursor: pointer;
  pointer-events: auto !important;
  box-shadow: none;
}

body.cl-dashboard-redesign-page .cl-source-topbar .user_session_refresh.cl-source-user-session-exit:hover,
body.cl-dashboard-redesign-page .cl-source-topbar .user_session_refresh.cl-source-user-session-exit:focus {
  background: rgba(255, 255, 255, .22) !important;
  border-color: rgba(255, 255, 255, .5) !important;
  color: #fff !important;
  outline: 0;
}

body.cl-dashboard-redesign-page .cl-source-topbar .user_session_refresh.cl-source-user-session-exit:focus-visible {
  box-shadow: 0 0 0 3px rgba(255, 255, 255, .22);
}

body.cl-dashboard-redesign-page .cl-source-topbar .user_session_refresh.cl-source-user-session-exit svg {
  flex: none;
  width: 15px;
  height: 15px;
}

@media (max-width: 1180px) and (min-width: 901px) {
  .cl-source-topbar.has-user-session-exit .cl-source-topnav {
    display: none;
  }
}

.cl-source-topnav {
  position: absolute;
  top: 0;
  left: 50%;
  display: flex;
  align-items: center;
  height: 100%;
  gap: 56px;
  transform: translateX(-50%);
}

.cl-source-topnav a {
  color: rgba(255, 255, 255, .9);
  font-size: 14.5px;
  font-weight: 500;
  text-decoration: none;
  white-space: nowrap;
}

.cl-source-topnav a:hover,
.cl-source-topnav a:focus {
  color: #fff;
  text-decoration: none;
}

.cl-source-top-actions {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 16px;
}

.cl-source-icon-btn,
.cl-source-hamburger {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  padding: 0;
  background: transparent;
  border: 0;
  color: rgba(255, 255, 255, .92);
}

.cl-source-icon-btn svg,
.cl-source-hamburger svg {
  width: 20px;
  height: 20px;
}

.cl-source-hamburger {
  display: none;
}

.cl-source-user {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 0;
  background: transparent;
  border: 0;
  color: #fff;
  font: inherit;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
}

.cl-source-user > span {
  display: inline-block;
  max-width: 160px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cl-source-user-menu {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  display: none;
  width: 220px;
  padding: 8px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 12px;
  box-shadow: 0 12px 30px rgba(20, 24, 32, .18);
  z-index: 1300;
  text-align: left;
}

.cl-source-user-menu.open {
  display: block;
}

.cl-source-user-menu:before {
  content: "";
  position: absolute;
  top: -4px;
  right: 19px;
  width: 6px;
  height: 6px;
  background: #fff;
  border-top: 1px solid var(--cl-border);
  border-left: 1px solid var(--cl-border);
  transform: rotate(45deg);
}

.cl-source-user-menu .cl-source-user-menu-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 11px 12px;
  border-radius: 8px;
  color: var(--cl-text);
  font-size: 14px;
  font-weight: 500;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
}

.cl-source-user-menu .cl-source-user-menu-item:hover,
.cl-source-user-menu .cl-source-user-menu-item:focus {
  background: #eaf9f1;
  color: var(--cl-green-text);
  text-decoration: none;
  outline: none;
}

.cl-source-user-menu .menu-icon {
  flex: none;
  width: 19px;
  height: 19px;
  color: var(--cl-text-sub);
  fill: currentColor;
}

.cl-source-user-menu .menu-icon.stroke {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.1;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.cl-source-user-menu .cl-source-user-menu-item:hover .menu-icon,
.cl-source-user-menu .cl-source-user-menu-item:focus .menu-icon {
  color: #03C75A;
}

.cl-source-user-menu-divider {
  display: block;
  height: 1px;
  margin: 6px 4px;
  background: var(--cl-border);
}

.cl-source-user-menu-lang {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 11px 12px;
  color: var(--cl-text);
  font-size: 14px;
  font-weight: 500;
}

.cl-source-user-menu-lang-label {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.cl-source-user-menu-lang-options {
  display: flex;
  align-items: center;
  gap: 2px;
  font-size: 13px;
  font-weight: 700;
}

.cl-source-user-menu-lang-options a,
.cl-source-user-menu-lang-options span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 3px 8px;
  border-radius: 6px;
  color: var(--cl-text-muted);
  line-height: 1;
  text-decoration: none;
  transition: background-color .12s, color .12s;
}

.cl-source-user-menu-lang-options a {
  cursor: pointer;
}

.cl-source-user-menu-lang-options a:hover,
.cl-source-user-menu-lang-options a:focus {
  background: #f1f2f5;
  color: var(--cl-text-muted);
  outline: none;
}

.cl-source-user-menu-lang-options a.active {
  color: var(--cl-green-text);
  background: transparent;
}

.cl-source-user-menu-lang-options .sep {
  padding: 0;
  color: var(--cl-border);
  font-weight: 400;
}

.cl-source-user-menu-policy-divider {
  margin-top: 8px;
  margin-bottom: 7px;
}

.cl-source-user-menu-policy {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 2px 4px 3px;
  color: #c0c4cc;
  font-size: 11px;
  font-weight: 500;
  line-height: 16px;
  white-space: nowrap;
}

.cl-source-user-menu-policy-dot {
  color: #d3d6dc;
  font-size: 12px;
  font-weight: 600;
  line-height: 1;
}

.cl-source-user-menu-policy a {
  color: #b6bbc4;
  text-decoration: none;
  transition: color .12s;
}

.cl-source-user-menu-policy a:hover,
.cl-source-user-menu-policy a:focus {
  color: var(--cl-green-text);
  text-decoration: none;
  outline: none;
}

.cl-source-sidebar {
  position: fixed;
  top: var(--cl-source-topbar-h);
  bottom: 0;
  left: var(--cl-source-app-gutter);
  z-index: 1100;
  display: flex;
  flex-direction: column;
  width: var(--cl-source-sidebar-w);
  background: #fff;
  border-right: 1px solid var(--cl-border);
}

.cl-source-sidebar-scroll {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
}

.cl-source-site-card {
  padding: 20px;
  border-bottom: 1px solid var(--cl-border);
}

.cl-source-site-thumb {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px 0;
  margin-bottom: 14px;
  overflow: visible;
  background: transparent;
}

.cl-source-site-device-frame {
  position: relative;
  width: 168px;
  height: 133px;
  margin-right: 1px;
}

.cl-source-site-device-frame .site-screen-clip {
  position: absolute;
  top: 5px;
  left: 7px;
  z-index: 3;
  width: 154px;
  height: 85px;
  overflow: hidden;
  background: #fff;
}

.cl-source-site-screen {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background-color: #fff;
  background-position: center;
  background-size: cover;
  object-fit: cover;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .14), inset 0 1px 2px rgba(0, 0, 0, .08);
  transform-origin: 50% 50%;
  transition: filter .5s cubic-bezier(.4, .4, 0, 1), transform .5s cubic-bezier(.4, .4, 0, 1);
}

body.cl-dashboard-redesign-page .cl-source-site-device-frame .site-screen-clip .cl-source-site-screen {
  position: absolute !important;
  top: 0 !important;
  right: auto !important;
  left: 0 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  padding: 0 !important;
  box-sizing: border-box;
}

body.cl-dashboard-redesign-page .cl-source-site-screen.is-default {
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  object-fit: contain;
  filter: none;
  transform: none;
}

.cl-source-site-device-frame > img {
  position: relative;
  z-index: 2;
  display: block;
  width: 168px;
  height: 133px;
  pointer-events: none;
}

body.cl-dashboard-redesign-page .cl-source-site-device-frame .site-screen-ov {
  position: absolute;
  top: 5px;
  left: 7px;
  z-index: 4;
  display: flex;
  width: 154px;
  height: 85px;
  flex-direction: column;
  align-items: stretch;
  justify-content: center;
  gap: 0;
  overflow: hidden;
  border-radius: 0;
  background: rgba(16, 20, 26, .52);
  color: #fff;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .34s cubic-bezier(.4, .4, 0, 1), visibility .34s cubic-bezier(.4, .4, 0, 1);
}

body.cl-dashboard-redesign-page .cl-source-site-device-frame:hover .site-screen-ov,
body.cl-dashboard-redesign-page .cl-source-site-device-frame:focus-within .site-screen-ov {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

body.cl-dashboard-redesign-page .cl-source-site-device-frame:hover .cl-source-site-screen:not(.is-default),
body.cl-dashboard-redesign-page .cl-source-site-device-frame:focus-within .cl-source-site-screen:not(.is-default) {
  filter: blur(4px);
  transform: scale(1.06);
}

body.cl-dashboard-redesign-page .site-screen-ov .ssv-btn,
body.cl-dashboard-redesign-page .site-screen-ov .ssv-btn:hover,
body.cl-dashboard-redesign-page .site-screen-ov .ssv-btn:focus,
body.cl-dashboard-redesign-page .site-screen-ov .ssv-btn:active {
  position: relative;
  z-index: 1;
  display: flex;
  flex: 1 1 0;
  flex-direction: row;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 8px !important;
  box-sizing: border-box;
  border: 0 !important;
  border-top: 0 !important;
  border-bottom: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  align-items: center;
  justify-content: center;
  gap: 7px;
  color: #fff !important;
  font-family: inherit;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  letter-spacing: -.3px;
  text-decoration: none !important;
  white-space: nowrap;
  cursor: pointer;
  box-shadow: none !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, .32) !important;
  outline: 0;
  transition: background .24s cubic-bezier(.4, .4, 0, 1);
  -webkit-appearance: none;
  appearance: none;
}

body.cl-dashboard-redesign-page .site-screen-ov .ssv-btn:hover,
body.cl-dashboard-redesign-page .site-screen-ov .ssv-btn:focus {
  background: rgba(255, 255, 255, .2) !important;
  background-color: rgba(255, 255, 255, .2) !important;
}

body.cl-dashboard-redesign-page .site-screen-ov .ssv-btn + .ssv-btn {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .16) !important;
}

body.cl-dashboard-redesign-page .site-screen-ov .ssv-btn .ssv-label {
  display: inline-block;
  position: relative;
  top: 2px;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  line-height: inherit !important;
}

body.cl-dashboard-redesign-page .site-screen-ov .ssv-btn:focus-visible {
  outline: 2px solid rgba(255, 255, 255, .72);
  outline-offset: 2px;
}

body.cl-dashboard-redesign-page .site-screen-ov .ssv-btn svg {
  flex: none;
  order: 2;
  display: block;
  width: 17px !important;
  height: 17px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2 !important;
  color: currentColor;
  margin: 0 !important;
  transform: none !important;
}

@media (hover: none) {
  body.cl-dashboard-redesign-page .cl-source-site-device-frame .site-screen-ov {
    background: rgba(16, 20, 26, .45);
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }

  body.cl-dashboard-redesign-page .cl-source-site-screen:not(.is-default) {
    filter: blur(4px);
    transform: scale(1.06);
  }
}

@media (prefers-reduced-motion: reduce) {
  body.cl-dashboard-redesign-page .cl-source-site-screen {
    transition: none;
  }

  body.cl-dashboard-redesign-page .cl-source-site-device-frame:hover .cl-source-site-screen,
  body.cl-dashboard-redesign-page .cl-source-site-device-frame:focus-within .cl-source-site-screen {
    transform: none;
  }
}

.cl-source-site-select-row {
  display: flex;
  gap: 8px;
  margin-bottom: 8px;
}

.cl-source-site-select,
.cl-source-site-add {
  display: inline-flex;
  align-items: center;
  height: 38px;
  min-height: 38px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: var(--cl-radius-sm);
  color: var(--cl-text);
}

.cl-source-site-select {
  flex: 1;
  min-width: 0;
  justify-content: flex-start;
  gap: 8px;
  padding: 0 12px;
  font-size: 14px;
  font-weight: 600;
}

.cl-source-site-select span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cl-source-site-select strong {
  flex: none;
  box-sizing: border-box;
  height: auto;
  padding: 2px 7px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .2px;
  line-height: 13px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: geometricPrecision;
}

.cl-source-site-select > svg {
  flex: none;
  width: 14px;
  height: 14px;
  margin-left: auto;
  color: var(--cl-text-muted);
}

.cl-source-site-add {
  flex: 0 0 38px;
  width: 38px;
  justify-content: center;
  color: var(--cl-green);
  cursor: pointer;
  overflow: visible;
  position: relative;
  transition: background .12s, border-color .12s;
}

.cl-source-site-add.site-create-btn:not(.site-list-wrap) {
  width: 38px;
  height: 38px;
  min-height: 38px;
  margin-left: 0;
  float: none;
  background: #fff;
  border: 1px solid var(--cl-border);
}

.cl-source-site-add.site-create-btn:not(.site-list-wrap) svg {
  position: static;
  width: 16px;
  height: 16px;
  fill: none;
  transform: none;
}

.cl-source-site-add svg {
  position: relative;
  z-index: 3;
  width: 16px;
  height: 16px;
  transition: none;
}

.cl-source-site-add svg rect,
.cl-source-site-mgmt-add svg rect {
  stroke: #03C75A;
  stroke-width: 0;
  transition: stroke-width .18s ease;
}

.cl-source-site-add:hover svg rect,
.cl-source-site-add:focus svg rect,
.cl-source-site-mgmt-add:hover svg rect,
.cl-source-site-mgmt-add:focus svg rect {
  stroke-width: .7;
}

.cl-source-site-add:hover,
.cl-source-site-add:focus {
  background: #f1fbf5;
  border-color: #b7e7c9;
  transform: none;
}

.cl-source-site-add:hover svg,
.cl-source-site-add:focus svg {
  transform: none;
}

.sab-confetti {
  position: fixed;
  z-index: 9999;
  pointer-events: none;
  will-change: transform, opacity;
  transform: translate(-50%, -50%);
  opacity: 0;
  animation-name: sabConfettiFly;
  animation-timing-function: cubic-bezier(.15, .6, .25, 1);
  animation-fill-mode: forwards;
}

.sab-confetti.sab-circle {
  border-radius: 50%;
}

.sab-confetti.sab-triangle {
  clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
}

.sab-confetti.sab-star {
  clip-path: polygon(50% 0%, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%);
}

.sab-confetti.sab-diamond {
  clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
}

.sab-confetti.sab-rect {
  border-radius: 1px;
}

@keyframes sabConfettiFly {
  0% {
    opacity: var(--op, 1);
    transform: translate(-50%, -50%) translate(0, 0) rotate(0deg) scale(.4);
  }

  15% {
    opacity: var(--op, 1);
  }

  100% {
    opacity: 0;
    transform: translate(-50%, -50%) translate(var(--tx), var(--ty)) rotate(var(--rot)) scale(1);
  }
}

@media (prefers-reduced-motion: reduce) {
  .sab-confetti {
    animation: none !important;
    display: none !important;
  }
}

.cl-source-domain-row,
.cl-source-status-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
  color: var(--cl-text-sub);
  font-size: 12.5px;
}

.cl-source-domain-row {
  min-height: 16px;
  margin-bottom: 6px;
  line-height: 16px;
}

.cl-source-status-row {
  min-height: 14px;
  margin-top: 0;
  margin-bottom: 14px;
  padding: 0;
  background: transparent;
  border: 0;
  line-height: 14px;
  text-align: left;
  cursor: pointer;
  appearance: none;
}

.cl-source-status-row:hover,
.cl-source-status-row:focus,
.cl-source-status-row:active {
  background: transparent;
  border: 0;
  box-shadow: none;
  color: var(--cl-text-sub);
  outline: 0;
}

.cl-source-status-row.is-loading {
  cursor: wait;
  opacity: .65;
}

body.cl-dashboard-redesign-page .cl-source-status-row.ss_user_noActive,
body.cl-dashboard-redesign-page .cl-source-status-row.ss_user_noActive:hover,
body.cl-dashboard-redesign-page .cl-source-status-row.ss_user_noActive:focus,
body.cl-dashboard-redesign-page .cl-source-status-row.ss_user_noActive:active {
  background: transparent !important;
  border: 0 !important;
  color: var(--cl-text-muted) !important;
  cursor: default;
  opacity: 1 !important;
  pointer-events: none;
  box-shadow: none !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-status-row.ss_user_noActive .cl-source-toggle,
body.cl-dashboard-redesign-page .cl-source-status-row.ss_user_noActive .cl-source-toggle.off {
  background: #c9cdd3 !important;
}

body.cl-dashboard-redesign-page .cl-source-status-row.ss_user_noActive .cl-source-toggle span {
  background: #fff !important;
}

body.cl-dashboard-redesign-page .cl-source-status-row.ss_user_noActive .cl-source-status-text {
  color: var(--cl-text-muted) !important;
}

.cl-source-domain-row svg {
  flex: none;
  width: 13px;
  height: 13px;
}

.cl-source-domain-row a:first-of-type {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  color: var(--cl-green-text);
  font-weight: 600;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-decoration: none;
}

.cl-source-domain-btn {
  flex: none;
  display: inline-flex;
  align-items: center;
  height: 20px;
  padding: 0 8px;
  background: #f1f2f5;
  border-radius: 4px;
  color: var(--cl-text-sub) !important;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
}

.cl-source-domain-btn:hover {
  background: var(--cl-green-soft);
  color: var(--cl-green) !important;
}

.cl-source-toggle {
  position: relative;
  flex: none;
  width: 24px;
  height: 12px;
  background: var(--cl-green);
  border-radius: 999px;
}

.cl-source-toggle span {
  position: absolute;
  top: 1px;
  right: 1px;
  width: 10px;
  height: 10px;
  background: #fff;
  border-radius: 50%;
}

.cl-source-toggle.off {
  background: #c9cdd3;
}

.cl-source-toggle.off span {
  right: auto;
  left: 1px;
}

.cl-source-site-actions {
  display: flex;
  gap: 8px;
  margin-top: 0;
}

.cl-source-site-actions a {
  display: inline-flex;
  flex: 1;
  align-items: center;
  justify-content: center;
  height: 36px;
  min-height: 36px;
  padding: 0 6px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: var(--cl-radius-sm);
  color: var(--cl-text);
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
}

.cl-source-site-actions a svg {
  flex: none;
  width: 14px;
  height: 14px;
  margin-right: 4px;
}

.cl-dashboard-redesign .cl-source-site-actions .cl-source-site-edit-icon,
.cl-dashboard-redesign .cl-source-site-actions .cl-source-site-edit-icon path {
  fill: none !important;
  stroke: currentColor !important;
}

.cl-dashboard-redesign .cl-source-site-actions .cl-source-site-edit-icon {
  width: 14px !important;
  height: 14px !important;
  margin-right: 4px !important;
  vertical-align: -2px;
}

.cl-source-site-actions a:first-child {
  flex: 1.6;
}

.cl-source-site-actions a:last-child {
  flex: 1.1;
  color: var(--cl-text-sub);
}

.cl-source-site-actions a.cl-source-site-edit {
  border-color: var(--cl-green);
  color: var(--cl-green-text);
}

.cl-dashboard-redesign .cl-source-site-actions a.cl-source-site-edit:not(:hover):not(:focus) svg {
  color: var(--cl-green);
}

.cl-source-site-actions a.cl-source-site-edit:hover,
.cl-source-site-actions a.cl-source-site-edit:focus {
  background: var(--cl-green);
  border-color: var(--cl-green);
  color: #fff;
}

.cl-source-site-actions a.upgrade,
.cl-source-site-actions a:hover,
.cl-source-site-actions a:focus {
  background: var(--cl-green);
  border-color: var(--cl-green);
  color: #fff;
  text-decoration: none;
}

.cl-source-site-mgmt-overlay {
  position: fixed;
  inset: 0;
  z-index: 1250;
  display: none;
  background: transparent;
}

.cl-source-site-mgmt-modal {
  position: absolute;
  display: flex;
  flex-direction: column;
  width: 460px;
  max-width: 92vw;
  overflow: hidden;
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 20px 50px rgba(20, 24, 32, .25);
  animation: clSourceSiteMgmtIn .18s cubic-bezier(.22, 1, .36, 1);
}

.cl-source-site-mgmt-head {
  display: flex;
  flex: none;
  align-items: center;
  gap: 8px;
  padding: 22px 24px 16px;
}

.cl-source-site-mgmt-title {
  color: var(--cl-text);
  font-size: 17px;
  font-weight: 800;
}

.cl-source-site-mgmt-count {
  color: var(--cl-green-text);
  font-size: 14px;
  font-weight: 700;
}

.cl-source-site-mgmt-help {
  flex: none;
  color: #03C75A;
  fill: currentColor;
  cursor: pointer;
}

.cl-source-site-mgmt-help:focus-visible {
  outline: 2px solid var(--cl-green);
  outline-offset: 3px;
  border-radius: 50%;
}

.cl-source-site-mgmt-add {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: 113px;
  height: 37px;
  margin-left: auto;
  padding: 0;
  background: #fff;
  border: 1px solid var(--cl-green);
  border-radius: 6px;
  color: var(--cl-green-text);
  cursor: pointer;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  transition: background .12s, border-color .12s;
}

.cl-source-site-mgmt-head .cl-source-site-mgmt-add {
  flex: 0 0 auto;
  width: 113px;
  min-width: 113px;
  height: 37px;
  float: none;
  box-sizing: border-box;
  margin-left: auto;
  padding: 0;
  overflow: visible;
  white-space: nowrap;
}

.cl-source-site-mgmt-add svg {
  position: relative;
  z-index: 3;
  flex: none;
  fill: currentColor;
  transition: none;
}

.cl-source-site-mgmt-head .cl-source-site-mgmt-add svg {
  position: static;
  top: auto;
  left: auto;
  width: 15px;
  height: 15px;
  transform: none;
  fill: currentColor;
}

.cl-source-site-mgmt-add:hover,
.cl-source-site-mgmt-add:focus {
  background: #f1fbf5;
}

.cl-source-site-mgmt-head .cl-source-site-mgmt-add:hover,
.cl-source-site-mgmt-head .cl-source-site-mgmt-add:focus {
  border-color: var(--cl-green);
}

.cl-source-site-mgmt-add:hover svg {
  transform: none;
}

.cl-source-site-mgmt-head .cl-source-site-mgmt-add:hover svg {
  transform: none;
}

.cl-source-site-mgmt-close {
  display: inline-flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  margin-left: 6px;
  padding: 0;
  background: none;
  border: 0;
  border-radius: 8px;
  color: var(--cl-text-sub);
  cursor: pointer;
  line-height: 1;
  transition: color .15s, background .15s, transform .18s cubic-bezier(.34, 1.56, .64, 1);
}

/* 사이트 추가 버튼이 없는 경우에도 닫기 버튼은 헤더 우측에 정렬합니다. */
:is(body.cl-dashboard-redesign-page, .cl-dashboard-redesign) .cl-source-site-mgmt-head > :not(.cl-source-site-mgmt-add) + .cl-source-site-mgmt-close {
  margin-left: auto;
}

.cl-source-site-mgmt-close svg {
  display: block;
  width: 9px;
  height: 9px;
  fill: currentColor;
  stroke: currentColor;
}

.cl-source-site-mgmt-close:hover,
.cl-source-site-mgmt-close:focus {
  background: #f1f2f5;
  color: var(--cl-text);
  transform: rotate(90deg);
}

body.cl-dashboard-redesign-page #site-select .create-site-close {
  display: inline-flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  margin-left: 6px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px !important;
  color: var(--cl-text-sub) !important;
  cursor: pointer !important;
  line-height: 1 !important;
  transition: color .15s, background .15s, transform .18s cubic-bezier(.34, 1.56, .64, 1) !important;
}

body.cl-dashboard-redesign-page #site-select .create-site-close svg {
  display: block !important;
  width: 9px !important;
  height: 9px !important;
  fill: currentColor !important;
  stroke: none !important;
}

body.cl-dashboard-redesign-page #site-select .create-site-close svg path {
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page #site-select .create-site-close:hover,
body.cl-dashboard-redesign-page #site-select .create-site-close:focus {
  background: #f1f2f5 !important;
  color: var(--cl-text) !important;
  transform: rotate(90deg) !important;
}

body.cl-dashboard-redesign-page #site-select .site-create-btn.site-list-wrap {
  display: inline-flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  justify-content: center !important;
  width: 113px !important;
  height: 37px !important;
  min-height: 37px !important;
  margin-left: auto !important;
  padding: 0 !important;
  padding-right: 0 !important;
  float: none !important;
  background: transparent !important;
  border: 0 !important;
  color: var(--cl-green-text) !important;
  cursor: pointer !important;
  line-height: 1 !important;
}

body.cl-dashboard-redesign-page #site-select .site-create-btn.site-list-wrap > span {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  width: 113px !important;
  height: 37px !important;
  padding: 0 !important;
  background: #fff !important;
  border: 1px solid var(--cl-green) !important;
  border-radius: 6px !important;
  color: var(--cl-green-text) !important;
  box-sizing: border-box !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page #site-select .site-create-btn.site-list-wrap svg {
  flex: 0 0 auto !important;
  width: 14px !important;
  height: 14px !important;
  margin: 0 !important;
  fill: currentColor !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page #site-select .site-create-btn.site-list-wrap svg path {
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page #site-select .site-create-btn.site-list-wrap:hover > span,
body.cl-dashboard-redesign-page #site-select .site-create-btn.site-list-wrap:focus > span {
  background: #f1fbf5 !important;
  border-color: var(--cl-green) !important;
}

body.cl-dashboard-redesign-page #site-select .site-create-btn.site-list-wrap.site-limit > span {
  border-color: #d1d3d5 !important;
  color: #d1d3d5 !important;
}

.cl-dashboard-redesign #site-select .site-create-btn.site-list-wrap {
  display: inline-flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  justify-content: center !important;
  width: 113px !important;
  height: 37px !important;
  min-height: 37px !important;
  margin-left: auto !important;
  padding: 0 !important;
  padding-right: 0 !important;
  float: none !important;
  background: transparent !important;
  border: 0 !important;
  color: var(--cl-green-text) !important;
  cursor: pointer !important;
  line-height: 1 !important;
}

.cl-dashboard-redesign #site-select .site-create-btn.site-list-wrap > span {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  width: 113px !important;
  height: 37px !important;
  padding: 0 !important;
  background: #fff !important;
  border: 1px solid var(--cl-green) !important;
  border-radius: 6px !important;
  color: var(--cl-green-text) !important;
  box-sizing: border-box !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

.cl-dashboard-redesign #site-select .site-create-btn.site-list-wrap > span::before {
  content: "+";
  display: inline-block;
  color: currentColor;
  font-size: 16px;
  font-weight: 400;
  line-height: 1;
  transform: translateY(-1px);
}

.cl-dashboard-redesign #site-select .site-create-btn.site-list-wrap svg {
  display: none !important;
}

.cl-dashboard-redesign #site-select .site-create-btn.site-list-wrap:hover > span,
.cl-dashboard-redesign #site-select .site-create-btn.site-list-wrap:focus > span {
  background: #f1fbf5 !important;
  border-color: var(--cl-green) !important;
}

.cl-dashboard-redesign #site-select .site-create-btn.site-list-wrap.site-limit > span {
  border-color: #d1d3d5 !important;
  color: #d1d3d5 !important;
}

.cl-source-site-mgmt-list {
  flex: 1;
  min-height: 0;
  margin-right: 2px;
  padding: 4px 18px 20px 24px;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-color: #d1d3d5 transparent;
  scrollbar-width: thin;
}

.cl-source-site-mgmt-list::-webkit-scrollbar {
  width: 9px;
}

.cl-source-site-mgmt-list::-webkit-scrollbar-track {
  background: transparent;
}

.cl-source-site-mgmt-list::-webkit-scrollbar-thumb {
  background: #d1d3d5;
  background-clip: padding-box;
  border: 2px solid transparent;
  border-radius: 6px;
}

.cl-source-site-mgmt-list::-webkit-scrollbar-thumb:hover {
  background: #d1d3d5;
  background-clip: padding-box;
}

.cl-source-site-row {
  position: relative;
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 77px;
  padding: 14px 10px;
  border-top: 0;
  cursor: pointer;
  transition: background .1s, box-shadow .22s cubic-bezier(.2, .8, .2, 1), transform .22s cubic-bezier(.2, .8, .2, 1);
}

.cl-source-site-mgmt-list .cl-source-site-row:first-child {
  border-top: 0;
}

.cl-source-site-row:hover {
  background: #fafbfc;
}

.cl-source-site-row.current {
  margin: 6px 0;
  padding: 13px 9px;
  border: 1.5px solid var(--cl-green);
  border-radius: 10px;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .12);
}

.cl-source-site-mgmt-list .cl-source-site-row.current:first-child {
  border-top: 1.5px solid var(--cl-green);
}

.cl-source-site-row.current:hover {
  background: #fff;
}

.cl-source-site-row.current + .cl-source-site-row {
  border-top: 0;
}

body.cl-dashboard-redesign-page #site-select .list-site > li,
.cl-dashboard-redesign #site-select .list-site > li {
  border-top: 0 !important;
  border-right: 0 !important;
  border-bottom: 0 !important;
  border-left: 0 !important;
  outline: 0 !important;
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
  filter: none !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page #site-select .list-site > li.active,
.cl-dashboard-redesign #site-select .list-site > li.active {
  background: #fff !important;
  border: 1px solid var(--cl-green) !important;
  outline: 0 !important;
  -webkit-box-shadow: 0 0 0 3px rgba(3, 199, 90, .12) !important;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .12) !important;
  filter: none !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page #site-select .list-site > li.active:hover,
body.cl-dashboard-redesign-page #site-select .list-site > li.active:focus,
.cl-dashboard-redesign #site-select .list-site > li.active:hover,
.cl-dashboard-redesign #site-select .list-site > li.active:focus {
  background: #fff !important;
  outline: 0 !important;
  -webkit-box-shadow: 0 0 0 3px rgba(3, 199, 90, .12) !important;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .12) !important;
}

body.cl-dashboard-redesign-page #site-select .list-site > li.active + li,
.cl-dashboard-redesign #site-select .list-site > li.active + li {
  border-top: 0 !important;
}

body.cl-dashboard-redesign-page #site-select .list-site > li.drop-open,
.cl-dashboard-redesign #site-select .list-site > li.drop-open {
  z-index: 3 !important;
}

body.cl-dashboard-redesign-page #site-select .site-dropdown-box:hover .site-btn-drop,
body.cl-dashboard-redesign-page #site-select .site-dropdown-box:focus-within .site-btn-drop,
body.cl-dashboard-redesign-page #site-select .site-btn-drop.open {
  display: block !important;
}

body.cl-dashboard-redesign-page #site-select .site-dropdown-box:hover .site-btn-drop.onscroll,
body.cl-dashboard-redesign-page #site-select .site-dropdown-box:focus-within .site-btn-drop.onscroll,
body.cl-dashboard-redesign-page #site-select .site-btn-drop.open.onscroll {
  display: flex !important;
  flex-direction: column !important;
}

.cl-source-site-drag-handle {
  display: flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 14px;
  height: 14px;
  color: var(--cl-text-sub);
  cursor: grab;
  opacity: 0;
  transition: opacity .1s, color .1s;
}

.cl-source-site-drag-handle svg {
  display: block;
  width: 14px;
  height: 14px;
  fill: currentColor;
}

.cl-source-site-row:hover .cl-source-site-drag-handle {
  opacity: 1;
}

.cl-source-site-drag-handle:hover {
  color: var(--cl-text);
}

.cl-source-site-drag-handle:active {
  cursor: grabbing;
}

.cl-source-site-row.dragging {
  background: #eaf9f0;
  opacity: .5;
}

.cl-source-site-row.drag-over-top {
  box-shadow: inset 0 2px 0 var(--cl-green);
}

.cl-source-site-row.drag-over-bottom {
  box-shadow: inset 0 -2px 0 var(--cl-green);
}

.cl-source-site-thumb-sm {
  display: flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 70px;
  height: 48px;
  overflow: hidden;
  background: #fafbfc;
  background-position: center;
  background-size: cover;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  color: var(--cl-text-muted);
  font-size: 12px;
  font-weight: 400;
  text-align: center;
}

.cl-source-site-thumb-sm.has-image {
  color: transparent;
}

.cl-source-site-row-info {
  display: flex;
  flex: 1;
  flex-direction: column;
  min-width: 0;
}

.cl-source-site-row-name {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  margin-bottom: 4px;
  color: var(--cl-text);
  font-size: 14.5px;
  font-weight: 700;
  line-height: 18px;
}

.cl-source-site-row-domain {
  display: flex;
  align-items: center;
  gap: 5px;
  min-width: 0;
  color: var(--cl-text-sub);
  font-size: 12.5px;
  line-height: 17px;
  text-decoration: none;
}

.cl-source-site-row-domain:hover,
.cl-source-site-row-domain:focus {
  color: var(--cl-green-text);
  text-decoration: none;
}

.cl-source-site-row-domain svg {
  flex: none;
  width: 13px;
  height: 13px;
  fill: currentColor;
}

.cl-source-plan-badge {
  flex: none;
  padding: 2px 7px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .2px;
  line-height: 13px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: geometricPrecision;
}

.cl-source-plan-badge.free {
  background: #fff;
  border: 1px solid var(--cl-border);
  color: var(--cl-text-sub);
}

.cl-source-plan-badge.micro {
  background: #fff;
  border: 1px solid var(--cl-border);
  color: var(--cl-text-sub);
}

.cl-source-plan-badge.shopping {
  background: #f4778d;
  color: #fff;
}

.cl-source-plan-badge.business {
  background: #3b6fe0;
  color: #fff;
}

.cl-source-plan-badge.basic {
  background: #16a34a;
  color: #fff;
}

.cl-source-site-row-menu-btn {
  display: flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  margin-right: 8px;
  margin-left: auto;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 50%;
  color: var(--cl-text-sub);
  cursor: pointer;
  opacity: 0;
  transition: opacity .1s, background .12s;
}

.cl-source-site-row:hover .cl-source-site-row-menu-btn {
  opacity: 1;
}

.cl-source-site-row-menu-btn:hover,
.cl-source-site-row-menu-btn:focus {
  background: #f4f5f9;
}

.cl-source-site-row-menu-btn svg {
  width: 19px;
  height: 19px;
  fill: currentColor;
}

.cl-source-site-row-menu {
  position: fixed;
  box-sizing: border-box;
  z-index: 1320;
  display: none;
  width: 118px;
  padding: 6px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 10px;
  box-shadow: 0 8px 20px rgba(20, 24, 32, .16);
  text-align: center;
  animation: clSourceSiteRowMenuIn .14s cubic-bezier(.22, 1, .36, 1);
}

.cl-source-site-row-menu.is-hover-open {
  animation: none;
}

.cl-source-site-row-menu::before {
  position: absolute;
  right: 0;
  bottom: 100%;
  width: 44px;
  height: 7px;
  content: '';
}

.cl-source-site-row-menu.opens-up::before {
  top: 100%;
  bottom: auto;
}

.cl-source-site-row-menu button {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 7px;
  width: 100%;
  padding: 9px 10px;
  background: none;
  border: 0;
  border-radius: 6px;
  color: var(--cl-text);
  cursor: pointer;
  font-size: 13px;
  line-height: 17px;
  text-align: left;
  white-space: nowrap;
}

.cl-source-site-row-menu button svg {
  flex: none;
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.cl-source-site-row-menu button:hover,
.cl-source-site-row-menu button:focus {
  background: #f4f5f9;
}

.cl-source-site-row-menu button.danger {
  color: #dc2626;
}

.cl-source-site-add-overlay {
  position: fixed;
  inset: 0;
  z-index: 1360;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 20px;
  background: rgba(0, 0, 0, .45);
}

.cl-source-site-add-modal {
  position: relative;
  width: 560px;
  max-width: 92vw;
  padding: 44px 44px 32px;
  background: #fff;
  border-radius: 18px;
  box-shadow: 0 20px 50px rgba(20, 24, 32, .25);
  text-align: center;
  animation: clSourceSiteAddModalIn .18s cubic-bezier(.22, 1, .36, 1);
}

.cl-source-site-add-close {
  position: absolute;
  top: 16px;
  right: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  padding: 0;
  background: none;
  border: 0;
  border-radius: 8px;
  color: var(--cl-text-sub);
  cursor: pointer;
  font-size: 18px;
  line-height: 1;
  transition: color .15s, background .15s, transform .18s cubic-bezier(.34, 1.56, .64, 1);
}

.cl-source-site-add-close svg {
  display: block;
  width: 9px;
  height: 9px;
  fill: currentColor;
  stroke: currentColor;
}

.cl-source-site-add-close:hover,
.cl-source-site-add-close:focus {
  background: #f1f2f5;
  color: var(--cl-text);
  transform: rotate(90deg);
}

.cl-source-site-add-modal h3 {
  margin: 0 0 28px;
  color: var(--cl-text);
  font-size: 21px;
  font-weight: 800;
  line-height: 1.4;
}

.cl-source-site-add-input-row {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
  padding: 4px 16px;
  border: 1px solid var(--cl-border);
  border-radius: var(--cl-radius-sm);
  text-align: left;
  transition: border-color .12s, box-shadow .12s;
}

.cl-source-site-add-input-row.focus {
  border-color: var(--cl-green);
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .1);
}

.cl-source-site-add-input-row input {
  flex: 1;
  min-width: 0;
  padding: 13px 0;
  background: transparent;
  border: 0;
  outline: 0;
  color: var(--cl-text);
  font-size: 15px;
  line-height: 20px;
}

.cl-source-site-add-input-row input::placeholder {
  color: var(--cl-text-muted);
}

.cl-source-site-add-input-row .suffix {
  flex: none;
  color: #5f656e;
  font-size: 18px;
  font-weight: 700;
  line-height: 24px;
  white-space: nowrap;
}

.cl-source-site-add-msg {
  min-height: 20px;
  margin: 0 0 8px;
  color: var(--cl-text-sub);
  font-size: 12px;
  line-height: 18px;
  text-align: left;
}

.cl-source-site-add-msg.error {
  color: var(--cl-danger);
}

.cl-source-site-add-msg.success {
  color: var(--cl-green-text);
}

.cl-source-site-add-notes {
  margin-bottom: 28px;
  color: var(--cl-text-sub);
  font-size: 12.5px;
  line-height: 1.8;
  text-align: left;
}

.cl-source-site-add-create {
  width: 100%;
  padding: 14px;
  background: var(--cl-green);
  border: 0;
  border-radius: 10px;
  color: #fff;
  cursor: pointer;
  font-size: 16px;
  font-weight: 700;
  line-height: 20px;
  transition: background .12s;
}

.cl-source-site-add-create:hover,
.cl-source-site-add-create:focus {
  background: var(--cl-green-hover);
}

.cl-source-site-add-cancel {
  display: block;
  width: 100%;
  margin-top: 14px;
  padding: 11px;
  background: none;
  border: 0;
  border-radius: 9px;
  color: var(--cl-text-sub);
  cursor: pointer;
  font-size: 13.5px;
  line-height: 18px;
  text-align: center;
  transition: background .13s, color .13s;
}

.cl-source-site-add-cancel:hover,
.cl-source-site-add-cancel:focus {
  background: #e7e8e9;
  color: var(--cl-text);
}

@keyframes clSourceSiteMgmtIn {
  from {
    opacity: 0;
    transform: translateY(-6px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes clSourceSiteRowMenuIn {
  from {
    opacity: 0;
    transform: translateY(-3px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes clSourceSiteAddModalIn {
  from {
    opacity: 0;
    transform: translateY(8px) scale(.98);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@media (max-width: 640px) {
  .cl-source-site-add-modal {
    padding: 38px 24px 26px;
  }

  .cl-source-site-add-modal h3 {
    font-size: 20px;
  }

  .cl-source-site-add-input-row {
    padding: 4px 12px;
  }

  .cl-source-site-add-input-row .suffix {
    font-size: 15px;
  }
}

@media (max-width: 1024px) {
  html:has(body.cl-dashboard-redesign-page.cl-source-site-mgmt-open),
  body.cl-dashboard-redesign-page.cl-source-site-mgmt-open {
    /* 기존 shopping.css의 강제 overflow 설정보다 팝업 상태를 우선한다. */
    overflow: hidden !important;
  }

  .cl-source-site-mgmt-overlay.smm-mobile {
    align-items: center;
    justify-content: center;
    padding: 20px;
    height: 100dvh;
    background: rgba(20, 24, 32, .35);
  }

  .cl-source-site-mgmt-overlay.smm-mobile .cl-source-site-mgmt-modal {
    position: relative;
    width: 460px;
    max-width: 100%;
    max-height: 82vh;
    max-height: min(82dvh, calc(100dvh - 40px));
  }

  .cl-source-site-mgmt-overlay.smm-mobile .cl-source-site-row-menu-btn {
    opacity: 1;
  }
}

@media (max-width: 640px) {
  .cl-source-site-mgmt-overlay.smm-mobile .cl-source-site-mgmt-head {
    display: grid;
    grid-template-columns: auto auto 1fr auto;
    padding: 16px;
  }

  .cl-source-site-mgmt-overlay.smm-mobile .cl-source-site-mgmt-title {
    font-size: 16px;
    font-weight: 700;
    white-space: nowrap;
  }

  .cl-source-site-mgmt-overlay.smm-mobile .cl-source-site-mgmt-head .cl-source-site-mgmt-add {
    grid-column: 1 / -1;
    grid-row: 2;
    width: 100%;
    height: 40px;
    margin: 0;
  }

  .cl-source-site-mgmt-overlay.smm-mobile .cl-source-site-mgmt-close {
    grid-column: 4;
    grid-row: 1;
    margin: 0;
  }

  .cl-source-site-mgmt-overlay.smm-mobile .cl-source-site-mgmt-close svg {
    width: 15px;
    height: 15px;
  }

  .cl-source-site-mgmt-overlay.smm-mobile .cl-source-site-mgmt-list {
    padding: 4px 12px 16px;
  }

  .cl-source-site-mgmt-overlay.smm-mobile .cl-source-site-row {
    gap: 8px;
  }

  body.cl-dashboard-redesign-page .cl-source-site-mgmt-overlay.smm-mobile .cl-source-site-drag-handle {
    position: absolute;
    left: 0;
    width: 10px;
  }

  body.cl-dashboard-redesign-page .cl-source-site-mgmt-overlay.smm-mobile .cl-source-site-drag-handle svg {
    width: 10px;
  }

  body.cl-dashboard-redesign-page .cl-source-site-mgmt-overlay.smm-mobile .cl-source-site-thumb-sm {
    width: 48px;
    height: 36px;
  }

  body.cl-dashboard-redesign-page .cl-source-site-mgmt-overlay.smm-mobile .cl-source-site-row-name {
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    gap: 4px;
  }

  body.cl-dashboard-redesign-page .cl-source-site-mgmt-overlay.smm-mobile .cl-source-site-row-name-text,
  body.cl-dashboard-redesign-page .cl-source-site-mgmt-overlay.smm-mobile .cl-source-site-row-domain-text {
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .cl-source-site-mgmt-overlay.smm-mobile .cl-source-site-row-menu-btn {
    margin-right: 0;
  }
}

.cl-source-side-nav {
  display: flex;
  flex-direction: column;
  padding: 12px 12px 24px;
}

.cl-source-nav-item {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  gap: 10px;
  height: 40px;
  min-height: 40px;
  margin-bottom: 2px;
  padding: 0 12px;
  border-radius: var(--cl-radius-sm);
  color: var(--cl-text-sub);
  font-size: 14.5px;
  font-weight: 600;
  line-height: 20px;
  text-decoration: none;
  cursor: pointer;
}

.cl-source-nav-item svg {
  flex: none;
  width: 18px;
  height: 18px;
  opacity: .85;
}

.cl-source-nav-item:hover,
.cl-source-nav-item:focus {
  background: var(--cl-green-tint);
  color: var(--cl-green-text);
  text-decoration: none;
}

body.cl-dashboard-redesign-page .cl-source-sidebar .cl-source-nav-item:is(:hover, :focus) svg {
  color: var(--cl-green-text);
  opacity: 1;
}

.cl-source-nav-item.active {
  background: var(--cl-green-badge);
  color: var(--cl-green-text);
}

.cl-source-nav-item.active svg {
  opacity: 1;
}

.cl-dashboard-redesign .cl-source-nav-item.active svg:not(.cl-source-external) {
  color: var(--cl-green);
}

.cl-source-nav-item .cl-source-chev {
  width: 14px;
  height: 14px;
  margin-left: auto;
  opacity: .6;
  transition: transform .15s;
}

.cl-source-nav-item.open .cl-source-chev {
  transform: rotate(180deg);
}

.cl-source-nav-item .cl-source-external {
  width: 14px;
  height: 14px;
  margin-left: auto;
  color: var(--cl-text-muted);
}

.cl-source-nav-sub {
  display: flex;
  flex-direction: column;
  max-height: 0;
  overflow: hidden;
  padding: 0 12px 0 33px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: max-height .24s ease, padding .24s ease, opacity .16s ease, visibility 0s linear .24s;
}

.cl-source-nav-sub.open {
  max-height: 640px;
  padding: 2px 12px 10px 33px;
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition: max-height .24s ease, padding .24s ease, opacity .16s ease, visibility 0s;
}

.cl-source-nav-sub a {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  gap: 8px;
  height: 32px;
  min-height: 32px;
  margin-bottom: 1px;
  padding: 0 10px;
  border-radius: var(--cl-radius-sm);
  color: var(--cl-text-sub);
  font-size: 13.5px;
  font-weight: 500;
  line-height: 16px;
  text-decoration: none;
  cursor: pointer;
}

.cl-source-nav-sub a svg {
  flex: none;
  width: 15px;
  height: 15px;
  opacity: .8;
}

.cl-source-nav-sub a:hover,
.cl-source-nav-sub a:focus {
  background: var(--cl-green-tint);
  color: var(--cl-green-text);
  text-decoration: none;
}

body.cl-dashboard-redesign-page .cl-source-sidebar .cl-source-nav-sub a:is(:hover, :focus) svg {
  color: var(--cl-green-text);
  opacity: 1;
}

.cl-source-nav-sub a.active {
  background: var(--cl-green-badge);
  color: var(--cl-green-text);
  font-weight: 700;
}

.cl-dashboard-redesign .cl-source-nav-sub a.active svg {
  color: var(--cl-green);
}

.cl-source-nav-sub-divider {
  height: 1px;
  margin: 6px 10px;
  background: var(--cl-border);
}

.cl-source-sidebar-backdrop {
  display: none;
}

body.cl-dashboard-redesign-page .dashboard-section,
body.cl-dashboard-redesign-page .dashbottom-wrap {
  width: auto !important;
  max-width: none !important;
  margin-top: 0 !important;
  margin-right: var(--cl-source-app-gutter) !important;
  margin-left: calc(var(--cl-source-app-gutter) + var(--cl-source-sidebar-w)) !important;
  padding: 28px 32px 60px !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page .dashboard-section > .container,
body.cl-dashboard-redesign-page .dashbottom-wrap > .dashbottom-container {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .dashboard-section > .container > .row,
body.cl-dashboard-redesign-page .dashbottom-wrap > .dashbottom-container {
  margin-right: 0 !important;
  margin-left: 0 !important;
}

body.cl-dashboard-redesign-page .cl-home-shopping-summary,
body.cl-dashboard-redesign-page .cl-home-shopping-mobile {
  display: none !important;
}

.cl-source-dashboard-head {
  display: grid;
  grid-template-columns: minmax(0, 6fr) minmax(320px, 4fr);
  gap: 24px;
  align-items: stretch;
  margin-bottom: 28px;
}

.cl-source-summary-cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
}

.cl-source-summary-card,
.cl-source-notice-panel,
.cl-source-sales-panel,
body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity,
body.cl-dashboard-redesign-page .cl-dashboard-home .site-visit,
body.cl-dashboard-redesign-page .cl-dashboard-home .site-space,
body.cl-dashboard-redesign-page .cl-dashboard-home .main-kakaotalk-wrap .main-pc-wrap {
  background: var(--cl-surface) !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: var(--cl-radius-lg) !important;
  box-shadow: var(--cl-shadow-panel) !important;
}

.cl-source-summary-card {
  display: flex;
  align-items: center;
  min-height: 0;
  gap: 18px;
  padding: 14px clamp(16px, 2.5vw, 24px);
  color: var(--cl-text);
  text-decoration: none;
  overflow: hidden;
  box-shadow: var(--cl-shadow-card) !important;
  transition: background-color .15s ease, border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}

.cl-source-summary-card:hover,
.cl-source-summary-card:focus {
  color: var(--cl-text);
  text-decoration: none;
  transform: translateY(-1px);
  box-shadow: 0 4px 14px rgba(20, 24, 32, .1) !important;
}

.cl-source-summary-card.primary:hover {
  background: var(--cl-green-tint) !important;
  border-color: var(--cl-green-line) !important;
}

.cl-source-summary-card.danger:hover {
  background: #f3f5f7 !important;
  border-color: #dbe1e8 !important;
}

.cl-source-summary-card.muted:hover {
  background: #eaf6fc !important;
  border-color: #c4e7f5 !important;
}

.cl-source-summary-icon {
  display: flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 54px;
  height: 54px;
  border-radius: 15px;
  color: #fff;
}

.cl-source-summary-icon svg {
  width: 26px;
  height: 26px;
}

.cl-source-summary-card.muted .cl-source-summary-icon svg {
  transform: translateY(2px);
}

.cl-source-summary-card.primary .cl-source-summary-icon {
  background: #03C75A;
}

.cl-source-summary-card.danger .cl-source-summary-icon {
  background: var(--cl-card-danger) !important;
}

.cl-source-summary-card.muted .cl-source-summary-icon {
  background: #36b4e4;
}

.cl-source-summary-meta {
  min-width: 0;
}

.cl-source-summary-meta strong {
  display: block;
  color: var(--cl-text);
  font-size: clamp(24px, 3vw, 30px);
  font-weight: 800;
  line-height: 1;
}

.cl-source-summary-meta em {
  display: block;
  margin-top: 7px;
  color: var(--cl-text-sub);
  font-size: clamp(12px, 1.4vw, 14px);
  font-style: normal;
  font-weight: 600;
  line-height: normal;
  white-space: nowrap;
}

.cl-source-summary-card.primary .cl-source-summary-meta em {
  color: var(--cl-green-text);
}

.cl-source-summary-card.danger .cl-source-summary-meta em {
  color: var(--cl-card-danger-text) !important;
}

.cl-source-summary-card.muted .cl-source-summary-meta em {
  color: #2ba0d3;
}

.cl-source-notice-panel,
.cl-source-sales-panel {
  padding: 14px 20px;
}

.cl-source-notice-panel {
  min-height: 110px;
}

.cl-source-notice-panel .cl-source-panel-head {
  margin-bottom: 6px;
}

.cl-source-notice-panel .cl-source-panel-head h3 {
  font-size: 14px;
}

.cl-source-sales-panel {
  position: relative;
  z-index: 1;
  height: 152px;
  margin-bottom: 24px;
  min-height: 152px;
  padding: 22px 24px;
  overflow: visible;
}

.cl-source-sales-panel.cl-source-scal-open {
  z-index: 20;
}

.cl-source-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
}

.cl-source-panel-head h3 {
  margin: 0;
  color: var(--cl-text);
  font-size: 16px;
  font-weight: 700;
  line-height: normal;
}

.cl-source-panel-head a {
  padding: 4px 6px;
  border-radius: 6px;
  color: var(--cl-green-text);
  font-size: 13px;
  font-weight: 600;
  line-height: normal;
  text-decoration: none;
  transition: background-color .12s ease, color .12s ease;
}

.cl-source-panel-head a:hover,
.cl-source-panel-head a:focus {
  background: var(--cl-green-soft);
  color: var(--cl-green-text);
  text-decoration: none;
}

.cl-source-notice-panel .cl-source-panel-head a {
  padding: 0;
  background: transparent;
  color: var(--cl-text);
  transition: color .12s ease;
}

.cl-source-notice-panel .cl-source-panel-head a:hover,
.cl-source-notice-panel .cl-source-panel-head a:focus {
  background: transparent;
  color: var(--cl-green-text);
}

.cl-source-notice-list {
  display: flex;
  flex-direction: column;
}

.cl-source-notice-item {
  display: flex;
  align-items: center;
  min-height: 31px;
  gap: 10px;
  padding: 6px 2px;
  border-top: 1px solid var(--cl-border);
  color: var(--cl-text);
  font-size: 13.5px;
  text-decoration: none;
}

.cl-source-notice-item:first-child {
  border-top: 0;
}

.cl-source-notice-item strong {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  color: var(--cl-text);
  font-size: 13.5px;
  font-weight: 400;
  line-height: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cl-source-notice-item em {
  flex: none;
  color: var(--cl-text-muted);
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

.cl-source-notice-item:hover strong {
  color: var(--cl-green-text);
}

/* ===== 공지사항 더보기 ===== */
body.cl-dashboard-redesign-page #cl-notice-page,
body.cl-dashboard-redesign-page #cl-notice-page * {
  box-sizing: border-box;
}

body.cl-dashboard-redesign-page #cl-notice-page {
  display: block;
  float: none;
  width: auto !important;
  max-width: none !important;
  margin-top: 0 !important;
  margin-right: var(--cl-source-app-gutter) !important;
  margin-left: calc(var(--cl-source-app-gutter) + var(--cl-source-sidebar-w)) !important;
  padding: 28px 32px 60px !important;
  background: transparent;
  color: var(--cl-text);
}

body.cl-dashboard-redesign-page #cl-notice-page > .dashbottom-container {
  display: block !important;
  float: none !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page #cl-notice-page .row {
  margin-right: 0 !important;
  margin-left: 0 !important;
}

body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-head {
  display: block;
  width: 100%;
  max-width: 920px;
  margin: 0 0 22px;
  padding: 0;
}

body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-breadcrumb {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  margin: 0 0 20px;
  padding: 0;
  color: var(--cl-text);
  font-size: 20px;
  font-weight: 700;
  line-height: 1.35;
}

body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-breadcrumb .sep {
  color: var(--cl-text-muted);
  font-size: 23px;
  font-weight: 400;
  line-height: 1;
}

body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-breadcrumb .current {
  color: var(--cl-text-sub);
  font-weight: 700;
}

body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-breadcrumb .bc-link {
  color: var(--cl-text);
  text-decoration: none;
  cursor: pointer;
  transition: color .12s;
}

body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-breadcrumb .bc-link:hover,
body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-breadcrumb .bc-link:focus {
  color: var(--cl-green-text);
  text-decoration: none;
}

body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-desc {
  margin: -8px 0 0;
  padding: 0;
  color: var(--cl-text-sub);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 1.6;
}

body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-timeline {
  width: 100%;
  max-width: 920px;
}

body.cl-dashboard-redesign-page .cl-source-notice-public-header + .cl-template-brandbar-spacer {
  display: none;
}

body.cl-dashboard-redesign-page #cl-notice-page.cl-source-notice-public-page {
  max-width: 1184px !important;
  margin-right: auto !important;
  margin-left: auto !important;
  padding: 64px 32px 60px !important;
}

body.cl-dashboard-redesign-page #cl-notice-page.cl-source-notice-public-page .cl-source-notice-more-head {
  max-width: none;
  margin-bottom: 40px;
  text-align: center;
}

body.cl-dashboard-redesign-page #cl-notice-page.cl-source-notice-public-page .cl-source-notice-public-title {
  margin: 0 0 20px;
  font-size: 30px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0;
}

body.cl-dashboard-redesign-page #cl-notice-page.cl-source-notice-public-page .cl-source-notice-more-desc {
  margin: 0;
}

body.cl-dashboard-redesign-page #cl-notice-page.cl-source-notice-public-page .cl-source-notice-more-timeline {
  max-width: none;
}

@media (max-width: 767px) {
  body.cl-dashboard-redesign-page #cl-notice-page.cl-source-notice-public-page {
    padding: 32px 16px 40px !important;
  }

  body.cl-dashboard-redesign-page #cl-notice-page.cl-source-notice-public-page .cl-source-notice-public-title {
    font-size: 24px;
  }
}

body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-toolbar {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 12px;
}

body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-create {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  height: 36px;
  padding: 0 14px;
  border: 1px solid var(--cl-green);
  border-radius: 6px;
  background: var(--cl-surface);
  color: var(--cl-green-text);
  font-size: 13px;
  font-weight: 600;
  white-space: nowrap;
  text-decoration: none;
}

body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-create:hover,
body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-create:focus-visible {
  background: var(--cl-green);
  color: #fff;
}

body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-panel {
  width: 100%;
  margin: 0 0 24px;
  padding: 22px 24px;
  background: var(--cl-surface);
  border: 1px solid var(--cl-border);
  border-radius: var(--cl-radius-lg);
  box-shadow: var(--cl-shadow-panel);
}

body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-item {
  display: grid;
  grid-template-columns: 86px 30px minmax(0, 1fr);
  align-items: start;
  padding-bottom: 36px;
  scroll-margin-top: 50vh;
}

body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-item:last-child {
  padding-bottom: 2px;
}

.cl-dashboard-redesign #cl-notice-page .cl-source-notice-more-item:target .cl-source-notice-more-title {
  color: var(--cl-green-text);
}

body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-date {
  grid-column: 1;
  padding-top: 1px;
  color: var(--cl-green-text);
  font-size: 13.5px;
  font-weight: 700;
  line-height: 18px;
  text-align: right;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-rail {
  position: relative;
  grid-column: 2;
  align-self: stretch;
}

body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-rail::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: -36px;
  left: 50%;
  width: 2px;
  background: var(--cl-border);
  transform: translateX(-50%);
}

body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-item:first-child .cl-source-notice-more-rail::before {
  top: 9px;
}

body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-item:last-child .cl-source-notice-more-rail::before {
  top: 0;
  bottom: auto;
  height: 9px;
}

body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-dot {
  position: absolute;
  top: 9px;
  left: 50%;
  z-index: 1;
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: var(--cl-accent-blue);
  box-shadow: 0 0 0 3px var(--cl-surface);
  transform: translate(-50%, -50%);
}

body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-content {
  grid-column: 3;
  min-width: 0;
  padding-left: 10px;
}

body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-title-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
  margin: 0 0 16px;
}

body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-title {
  margin: 0 0 16px;
  color: var(--cl-text);
  font-size: 16px;
  font-weight: 700;
  line-height: 1.3;
  word-break: keep-all;
}

body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-title-row .cl-source-notice-more-title {
  min-width: 0;
  margin: 0;
}

body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-actions {
  display: flex;
  flex: none;
  align-items: center;
  gap: 6px;
  padding-top: 1px;
}

body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 42px;
  height: 28px;
  margin: 0;
  padding: 0 10px;
  appearance: none;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  color: var(--cl-text-sub);
  font-family: inherit;
  font-size: 12px;
  font-weight: 700;
  line-height: 26px;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  transition: background-color .12s, border-color .12s, color .12s;
}

body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-action:hover,
body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-action:focus {
  background: #f1fbf5;
  border-color: var(--cl-green);
  color: var(--cl-green-text);
  text-decoration: none;
  outline: none;
}

body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-action.danger:hover,
body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-action.danger:focus {
  background: var(--cl-danger-soft);
  border-color: var(--cl-danger);
  color: var(--cl-danger);
}

body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-delete-overlay {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 2500;
  align-items: center;
  justify-content: center;
  padding: 20px;
  background: rgba(0, 0, 0, .45);
}

body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-delete-overlay.open {
  display: flex;
}

body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-delete-modal {
  position: relative;
  width: 560px;
  max-width: 92vw;
  padding: 44px 44px 32px;
  background: #fff;
  border-radius: 18px;
  box-shadow: 0 20px 50px rgba(20, 24, 32, .25);
  text-align: center;
}

body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-delete-close {
  display: inline-flex;
  position: absolute;
  top: 16px;
  right: 16px;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  margin: 0;
  padding: 0;
  background: none;
  border: 0;
  border-radius: 8px;
  color: var(--cl-text-sub);
  cursor: pointer;
  transition: color .15s, background-color .15s, transform .18s cubic-bezier(.34, 1.56, .64, 1);
}

body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-delete-close svg {
  display: block;
  width: 15px;
  height: 15px;
}

body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-delete-close:hover,
body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-delete-close:focus {
  background: #f1f2f5;
  color: var(--cl-text);
  outline: none;
  transform: rotate(90deg);
}

body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-delete-modal h3 {
  margin: 0 0 22px;
  color: var(--cl-text);
  font-size: 21px;
  font-weight: 800;
  line-height: 1.4;
}

body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-delete-desc {
  margin: 0 0 30px;
  color: var(--cl-text-sub);
  font-size: 15px;
  font-weight: 400;
  line-height: 1.7;
}

body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-delete-confirm {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 50px;
  margin: 0;
  padding: 0 14px;
  background: var(--cl-green);
  border: 0;
  border-radius: 10px;
  color: #fff;
  font-family: inherit;
  font-size: 16px;
  font-weight: 700;
  cursor: pointer;
  transition: background-color .12s, box-shadow .12s;
}

body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-delete-confirm:hover,
body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-delete-confirm:focus {
  background: var(--cl-green-hover);
  box-shadow: var(--cl-shadow-publish);
  outline: none;
}

body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-delete-cancel {
  display: block;
  width: 100%;
  margin: 14px 0 0;
  padding: 11px;
  background: none;
  border: 0;
  border-radius: 9px;
  color: var(--cl-text-sub);
  font-family: inherit;
  font-size: 13.5px;
  font-weight: 500;
  line-height: 18px;
  text-align: center;
  cursor: pointer;
  transition: background-color .13s, color .13s;
}

body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-delete-cancel:hover,
body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-delete-cancel:focus {
  background: #eaf9f1;
  color: var(--cl-green-text);
  outline: none;
}

body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-body {
  color: var(--cl-text-sub);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 1.85;
  word-break: keep-all;
}

body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-body p {
  margin: 0;
}

body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-body b,
body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-body strong {
  color: var(--cl-text);
  font-weight: 700;
}

body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-body u {
  padding-bottom: 1px;
  text-decoration: none;
  border-bottom: 1px solid var(--cl-text-sub);
}

body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-body img {
  max-width: 100%;
  height: auto;
}

body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-empty {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 180px;
  color: var(--cl-text-sub);
  font-size: 13.5px;
  font-weight: 500;
  line-height: 20px;
  text-align: center;
}

body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-pager,
body.cl-dashboard-redesign-page #cl-notice-page .shop-pager {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  width: 100%;
  margin: 22px 0 0 !important;
  padding: 0 !important;
  border-top: 0 !important;
  line-height: 1 !important;
}

body.cl-dashboard-redesign-page #cl-notice-page .shop-pager .pg {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 30px;
  height: 30px;
  margin: 0 !important;
  padding: 0 8px !important;
  appearance: none;
  background: transparent;
  border: 1px solid transparent !important;
  border-radius: 6px;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 28px;
  cursor: pointer;
  text-decoration: none !important;
  transition: background-color .12s, border-color .12s, color .12s;
}

body.cl-dashboard-redesign-page #cl-notice-page .shop-pager .pg.active {
  background: #e4f7ec !important;
  border-color: var(--cl-green) !important;
  color: var(--cl-green-text) !important;
  font-weight: 800 !important;
}

body.cl-dashboard-redesign-page #cl-notice-page .shop-pager .pg:hover:not(.active):not(:disabled) {
  background: #f1fbf5 !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page #cl-notice-page .shop-pager .pg:disabled,
body.cl-dashboard-redesign-page #cl-notice-page .shop-pager .pg:disabled:hover {
  background: transparent !important;
  color: var(--cl-text-muted) !important;
  cursor: default;
  opacity: .35;
}

body.cl-dashboard-redesign-page #cl-notice-page .shop-pager .pg.nav {
  color: var(--cl-text-muted) !important;
}

body.cl-dashboard-redesign-page #cl-notice-page .shop-pager .pg.nav svg {
  display: block;
  position: static !important;
  width: 15px !important;
  height: 15px !important;
  transform: none !important;
  fill: none !important;
  stroke: currentColor !important;
}

@media only screen and (max-width: 767px) {
  body.cl-dashboard-redesign-page #cl-notice-page {
    margin-top: 0 !important;
    margin-right: var(--cl-source-app-gutter) !important;
    margin-left: var(--cl-source-app-gutter) !important;
    padding: 20px 16px 40px !important;
  }

  body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-head,
  body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-timeline {
    max-width: 100%;
  }

  body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-panel {
    padding: 18px 16px;
  }

  body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-item {
    grid-template-columns: 74px 22px minmax(0, 1fr);
    padding-bottom: 28px;
  }

  body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-rail::before {
    bottom: -28px;
  }

  body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-date {
    font-size: 12px;
  }

  body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-content {
    padding-left: 8px;
  }

  body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-title {
    font-size: 14.5px;
  }

  body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-title-row {
    flex-direction: column;
    gap: 8px;
  }

  body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-actions {
    align-self: flex-start;
  }

  body.cl-dashboard-redesign-page #cl-notice-page .cl-source-notice-more-body {
    font-size: 13px;
  }
}

/* ===== 공지사항 수정 ===== */
body.cl-dashboard-redesign-page #cl-notice-write-page,
body.cl-dashboard-redesign-page #cl-notice-write-page * {
  box-sizing: border-box;
}

body.cl-dashboard-redesign-page #cl-notice-write-page {
  display: block;
  float: none;
  width: auto !important;
  max-width: none !important;
  margin-top: 0 !important;
  margin-right: var(--cl-source-app-gutter) !important;
  margin-left: calc(var(--cl-source-app-gutter) + var(--cl-source-sidebar-w)) !important;
  padding: 28px 32px 60px !important;
  background: transparent;
  color: var(--cl-text);
}

body.cl-dashboard-redesign-page #cl-notice-write-page > .dashbottom-container {
  display: block !important;
  float: none !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .row {
  margin-right: 0 !important;
  margin-left: 0 !important;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-write-head,
body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-write-form {
  width: 100%;
  max-width: 920px;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-write-head {
  margin: 0 0 22px;
  padding: 0;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-write-breadcrumb {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  margin: 0 0 20px;
  padding: 0;
  color: var(--cl-text);
  font-size: 20px;
  font-weight: 700;
  line-height: 1.35;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-write-breadcrumb .sep {
  color: var(--cl-text-muted);
  font-size: 23px;
  font-weight: 400;
  line-height: 1;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-write-breadcrumb .current {
  color: var(--cl-text-sub);
  font-weight: 700;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-write-breadcrumb .bc-link {
  color: var(--cl-text);
  text-decoration: none;
  cursor: pointer;
  transition: color .12s;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-write-breadcrumb .bc-link:hover,
body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-write-breadcrumb .bc-link:focus {
  color: var(--cl-green-text);
  text-decoration: none;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-write-desc {
  margin: -8px 0 0;
  padding: 0;
  color: var(--cl-text-sub);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 1.6;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-write-panel {
  width: 100%;
  padding: 22px 24px 24px;
  background: var(--cl-surface);
  border: 1px solid var(--cl-border);
  border-radius: var(--cl-radius-lg);
  box-shadow: var(--cl-shadow-panel);
}

body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-write-tabs {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 0 0 22px;
  padding: 4px;
  background: #f7f8fa;
  border: 1px solid var(--cl-border);
  border-radius: 10px;
  overflow-x: auto;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-write-tab {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  min-width: 78px;
  height: 32px;
  margin: 0;
  padding: 0 14px;
  background: transparent;
  border: 0;
  border-radius: 8px;
  color: var(--cl-text-sub);
  font-family: inherit;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  transition: background-color .12s, color .12s, box-shadow .12s;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-write-tab.active {
  background: #fff;
  color: var(--cl-green-text);
  box-shadow: 0 1px 3px rgba(20, 24, 32, .08);
}

body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-write-pane {
  display: none;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-write-pane.active {
  display: block;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-write-field {
  margin: 0 0 20px;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-write-field.compact {
  max-width: 240px;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-write-field > label {
  display: block;
  margin: 0 0 8px;
  color: var(--cl-text);
  font-size: 13.5px;
  font-weight: 700;
  line-height: 20px;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-write-field input[type="text"],
body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-write-field textarea {
  width: 100%;
  min-width: 0;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
  color: var(--cl-text);
  font-family: inherit;
  font-size: 13.5px;
  outline: none;
  transition: border-color .12s, box-shadow .12s;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-write-field input[type="text"] {
  height: 42px;
  padding: 0 13px;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-write-field textarea {
  min-height: 320px;
  padding: 12px 13px;
  resize: vertical;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-write-field input[type="text"]:focus,
body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-write-field textarea:focus {
  border-color: var(--cl-green);
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .13);
}

body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-date-wrap {
  position: relative;
  display: block;
  width: 240px;
  max-width: 100%;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-date-wrap .cl-source-notice-date-icon {
  position: absolute;
  top: 50%;
  left: 13px;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  color: var(--cl-text-sub);
  pointer-events: none;
  transform: translateY(-50%);
}

body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-date-wrap .cl-source-notice-date-icon svg {
  display: block;
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-date-wrap #ex_close {
  padding-right: 13px;
  padding-left: 38px;
  cursor: pointer;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-date-wrap:focus-within .cl-source-notice-date-icon {
  color: var(--cl-green);
}

body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-date-wrap .bootstrap-datetimepicker-widget,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .bootstrap-datetimepicker-widget {
  width: 286px !important;
  min-width: 286px !important;
  margin: 0 !important;
  padding: 14px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 12px !important;
  box-shadow: 0 12px 30px rgba(20, 24, 32, .16) !important;
  color: var(--cl-text) !important;
  font-family: var(--cl-source-font) !important;
  font-size: 12.5px !important;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-date-wrap .bootstrap-datetimepicker-widget {
  top: auto !important;
  right: auto !important;
  bottom: calc(100% + 8px) !important;
  left: 0 !important;
  z-index: 30 !important;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .bootstrap-datetimepicker-widget.dropdown-menu::before,
body.cl-dashboard-redesign-page #cl-notice-write-page .bootstrap-datetimepicker-widget.dropdown-menu::after,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .bootstrap-datetimepicker-widget.dropdown-menu::before,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .bootstrap-datetimepicker-widget.dropdown-menu::after {
  display: none !important;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .bootstrap-datetimepicker-widget .list-unstyled,
body.cl-dashboard-redesign-page #cl-notice-write-page .bootstrap-datetimepicker-widget .collapse,
body.cl-dashboard-redesign-page #cl-notice-write-page .bootstrap-datetimepicker-widget .datepicker,
body.cl-dashboard-redesign-page #cl-notice-write-page .bootstrap-datetimepicker-widget .datepicker-days,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .bootstrap-datetimepicker-widget .list-unstyled,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .bootstrap-datetimepicker-widget .collapse,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .bootstrap-datetimepicker-widget .datepicker,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .bootstrap-datetimepicker-widget .datepicker-days {
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .bootstrap-datetimepicker-widget table,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .bootstrap-datetimepicker-widget table {
  width: 100% !important;
  margin: 0 !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  table-layout: fixed !important;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .bootstrap-datetimepicker-widget table th,
body.cl-dashboard-redesign-page #cl-notice-write-page .bootstrap-datetimepicker-widget table td,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .bootstrap-datetimepicker-widget table th,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .bootstrap-datetimepicker-widget table td {
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  text-align: center !important;
  text-shadow: none !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .bootstrap-datetimepicker-widget table thead tr:first-child th,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .bootstrap-datetimepicker-widget table thead tr:first-child th {
  position: relative !important;
  height: 26px !important;
  line-height: 26px !important;
  color: var(--cl-text-sub) !important;
  font-size: 0 !important;
  font-weight: 700 !important;
  border-radius: 6px !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .bootstrap-datetimepicker-widget table thead tr:first-child th:hover,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .bootstrap-datetimepicker-widget table thead tr:first-child th:hover {
  background: #f4f5f9 !important;
  color: var(--cl-text) !important;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .bootstrap-datetimepicker-widget table thead tr:first-child th.picker-switch,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .bootstrap-datetimepicker-widget table thead tr:first-child th.picker-switch {
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .bootstrap-datetimepicker-widget table thead tr:first-child th.picker-switch:hover,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .bootstrap-datetimepicker-widget table thead tr:first-child th.picker-switch:hover {
  background: transparent !important;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .bootstrap-datetimepicker-widget table th.prev,
body.cl-dashboard-redesign-page #cl-notice-write-page .bootstrap-datetimepicker-widget table th.next,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .bootstrap-datetimepicker-widget table th.prev,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .bootstrap-datetimepicker-widget table th.next {
  width: 26px !important;
  min-width: 26px !important;
  max-width: 26px !important;
  color: var(--cl-text-sub) !important;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .bootstrap-datetimepicker-widget table th.prev .glyphicon,
body.cl-dashboard-redesign-page #cl-notice-write-page .bootstrap-datetimepicker-widget table th.next .glyphicon,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .bootstrap-datetimepicker-widget table th.prev .glyphicon,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .bootstrap-datetimepicker-widget table th.next .glyphicon {
  display: none !important;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .bootstrap-datetimepicker-widget table th.prev::before,
body.cl-dashboard-redesign-page #cl-notice-write-page .bootstrap-datetimepicker-widget table th.next::before,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .bootstrap-datetimepicker-widget table th.prev::before,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .bootstrap-datetimepicker-widget table th.next::before {
  content: "" !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  display: block !important;
  width: 16px !important;
  height: 16px !important;
  background: currentColor !important;
  border: 0 !important;
  transform: translate(-50%, -50%) !important;
  -webkit-mask-position: center !important;
  mask-position: center !important;
  -webkit-mask-size: 16px 16px !important;
  mask-size: 16px 16px !important;
  -webkit-mask-repeat: no-repeat !important;
  mask-repeat: no-repeat !important;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .bootstrap-datetimepicker-widget table th.prev::before,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .bootstrap-datetimepicker-widget table th.prev::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10 4L6 8L10 12' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  mask-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10 4L6 8L10 12' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .bootstrap-datetimepicker-widget table th.next::before,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .bootstrap-datetimepicker-widget table th.next::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6 4L10 8L6 12' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  mask-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6 4L10 8L6 12' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .bootstrap-datetimepicker-widget table thead tr:nth-child(2) th,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .bootstrap-datetimepicker-widget table thead tr:nth-child(2) th {
  height: 28px !important;
  line-height: 18px !important;
  padding: 4px 0 6px !important;
  color: var(--cl-text-muted) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .bootstrap-datetimepicker-widget table thead tr:nth-child(2) th:first-child,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .bootstrap-datetimepicker-widget table thead tr:nth-child(2) th:first-child {
  color: var(--cl-danger) !important;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .bootstrap-datetimepicker-widget table thead tr:nth-child(2) th:last-child,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .bootstrap-datetimepicker-widget table thead tr:nth-child(2) th:last-child {
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .bootstrap-datetimepicker-widget table td.day,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .bootstrap-datetimepicker-widget table td.day {
  width: auto !important;
  height: 29px !important;
  line-height: 29px !important;
  color: var(--cl-text) !important;
  font-size: 12.5px !important;
  font-weight: 400 !important;
  border-radius: 6px !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .bootstrap-datetimepicker-widget table td.day:hover,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .bootstrap-datetimepicker-widget table td.day:hover {
  background: #f1f2f5 !important;
  color: var(--cl-text) !important;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .bootstrap-datetimepicker-widget table td.old,
body.cl-dashboard-redesign-page #cl-notice-write-page .bootstrap-datetimepicker-widget table td.new,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .bootstrap-datetimepicker-widget table td.old,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .bootstrap-datetimepicker-widget table td.new {
  color: var(--cl-text-muted) !important;
  opacity: .45 !important;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .bootstrap-datetimepicker-widget table td.today::before,
body.cl-dashboard-redesign-page #cl-notice-write-page .bootstrap-datetimepicker-widget table td.active.today::before,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .bootstrap-datetimepicker-widget table td.today::before,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .bootstrap-datetimepicker-widget table td.active.today::before {
  display: none !important;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .bootstrap-datetimepicker-widget table td.active,
body.cl-dashboard-redesign-page #cl-notice-write-page .bootstrap-datetimepicker-widget table td.active:hover,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .bootstrap-datetimepicker-widget table td.active,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .bootstrap-datetimepicker-widget table td.active:hover {
  background: var(--cl-green) !important;
  color: #fff !important;
  opacity: 1 !important;
  font-weight: 700 !important;
  border-radius: 6px !important;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .bootstrap-datetimepicker-widget table td.disabled,
body.cl-dashboard-redesign-page #cl-notice-write-page .bootstrap-datetimepicker-widget table td.disabled:hover,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .bootstrap-datetimepicker-widget table td.disabled,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .bootstrap-datetimepicker-widget table td.disabled:hover {
  background: transparent !important;
  color: var(--cl-text-muted) !important;
  opacity: .35 !important;
  cursor: not-allowed !important;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .bootstrap-datetimepicker-widget table td span,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .bootstrap-datetimepicker-widget table td span {
  width: 25% !important;
  height: 30px !important;
  margin: 4px 0 !important;
  line-height: 30px !important;
  color: var(--cl-text) !important;
  font-size: 12.5px !important;
  border-radius: 6px !important;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .bootstrap-datetimepicker-widget table td span:hover,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .bootstrap-datetimepicker-widget table td span:hover {
  background: #f1f2f5 !important;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .bootstrap-datetimepicker-widget table td span.active,
body.cl-dashboard-redesign-page #cl-notice-write-page .bootstrap-datetimepicker-widget table td span.active:hover,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .bootstrap-datetimepicker-widget table td span.active,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .bootstrap-datetimepicker-widget table td span.active:hover {
  background: var(--cl-green) !important;
  color: #fff !important;
  font-weight: 700 !important;
  text-shadow: none !important;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .note-editor {
  overflow: visible;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .note-editor:focus-within {
  border-color: var(--cl-green) !important;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .13) !important;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .note-toolbar {
  background: #f7f8fa !important;
  border-bottom: 1px solid var(--cl-border) !important;
  border-radius: 8px 8px 0 0;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .note-editable {
  min-height: 320px;
  color: var(--cl-text);
  font-size: 13.5px;
  line-height: 1.75;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .note-toolbar .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 30px;
  height: 30px;
  margin: 0;
  padding: 0 9px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  color: var(--cl-text);
  font-size: 13px;
  line-height: 1;
  box-shadow: none;
  transition: background-color .12s, border-color .12s, color .12s;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .note-toolbar .btn:hover,
body.cl-dashboard-redesign-page #cl-notice-write-page .note-toolbar .btn:focus,
body.cl-dashboard-redesign-page #cl-notice-write-page .note-toolbar .btn.active {
  background: #e4f7ec;
  border-color: #cdefdd;
  color: var(--cl-green-text);
  outline: none;
  box-shadow: none;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .note-toolbar .dropdown-menu {
  min-width: 150px;
  margin-top: 6px;
  padding: 5px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(20, 24, 32, .14);
}

body.cl-dashboard-redesign-page #cl-notice-write-page .note-toolbar .dropdown-menu::before,
body.cl-dashboard-redesign-page #cl-notice-write-page .note-toolbar .dropdown-menu::after {
  display: none;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .note-toolbar .dropdown-menu > li > a {
  display: flex;
  align-items: center;
  min-height: 32px;
  padding: 7px 10px;
  border-radius: 6px;
  color: var(--cl-text);
  font-size: 12.5px;
  font-weight: 500;
  text-decoration: none;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .note-toolbar .dropdown-menu > li > a:hover,
body.cl-dashboard-redesign-page #cl-notice-write-page .note-toolbar .dropdown-menu > li > a:focus,
body.cl-dashboard-redesign-page #cl-notice-write-page .note-toolbar .dropdown-menu > li > a.checked {
  background: #e4f7ec;
  color: var(--cl-green-text);
}

body.cl-dashboard-redesign-page #cl-notice-write-page .note-popover .popover {
  max-width: min(360px, calc(100vw - 40px));
  margin-top: 8px;
  padding: 7px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 10px;
  box-shadow: 0 12px 30px rgba(20, 24, 32, .16);
  color: var(--cl-text);
  font-family: var(--cl-source-font);
}

body.cl-dashboard-redesign-page #cl-notice-write-page .note-popover .popover .arrow {
  display: none;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .note-popover .popover .popover-content {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 0;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .note-popover .note-link-content > a {
  max-width: 230px;
  color: var(--cl-green-text);
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .note-popover .note-link-content > a:hover,
body.cl-dashboard-redesign-page #cl-notice-write-page .note-popover .note-link-content > a:focus {
  color: var(--cl-green-text);
  text-decoration: none;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .note-popover .btn-group {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .note-popover .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 30px;
  height: 30px;
  margin: 0;
  padding: 0 8px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  color: var(--cl-text-sub);
  line-height: 1;
  box-shadow: none;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .note-popover .btn:hover,
body.cl-dashboard-redesign-page #cl-notice-write-page .note-popover .btn:focus {
  background: #e4f7ec;
  border-color: #cdefdd;
  color: var(--cl-green-text);
  outline: none;
  box-shadow: none;
}

body.cl-dashboard-redesign-page:has(#cl-notice-write-page):has(.note-dialog .note-link-dialog.in) > .modal-backdrop,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page):has(.note-dialog .note-image-dialog.in) > .modal-backdrop {
  display: none !important;
  opacity: 0 !important;
}

body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-link-dialog.in,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-image-dialog.in {
  position: fixed !important;
  inset: 0 !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 100vw !important;
  height: 100vh !important;
  min-height: 100vh !important;
  margin: 0 !important;
  padding: 24px !important;
  overflow-x: hidden;
  overflow-y: auto;
  background: rgba(0, 0, 0, .45) !important;
  box-sizing: border-box;
  z-index: 999999 !important;
  font-family: var(--cl-source-font);
}

body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-link-dialog .modal-dialog,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-image-dialog .modal-dialog {
  position: relative;
  z-index: 1;
  width: 520px;
  max-width: calc(100vw - 32px);
  margin: 0;
  text-align: left !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-image-dialog .modal-dialog {
  width: 560px;
}

body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-link-dialog .modal-content,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-image-dialog .modal-content {
  position: relative;
  width: 100%;
  padding: 34px 38px 30px !important;
  overflow: hidden;
  background: #fff;
  border: 0;
  border-radius: 14px;
  box-shadow: 0 24px 64px rgba(20, 24, 32, .24);
}

body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-link-dialog .modal-header,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-image-dialog .modal-header {
  min-height: 0;
  margin: 0;
  padding: 0 !important;
  border: 0;
}

body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-link-dialog .modal-header h4,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-image-dialog .modal-header h4 {
  margin: 0 0 26px;
  color: var(--cl-text);
  font-family: inherit;
  font-size: 20px;
  font-weight: 800;
  line-height: 1.35;
  text-align: center;
}

body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-link-dialog .modal-header .close,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-image-dialog .modal-header .close {
  position: absolute;
  top: 15px;
  right: 15px;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 8px;
  opacity: 1;
  cursor: pointer;
  transition: background-color .12s, transform .18s cubic-bezier(.34, 1.56, .64, 1);
}

body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-link-dialog .modal-header .close img,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-image-dialog .modal-header .close img {
  display: none;
}

body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-link-dialog .modal-header .close::before,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-link-dialog .modal-header .close::after,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-image-dialog .modal-header .close::before,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-image-dialog .modal-header .close::after {
  content: "";
  position: absolute;
  width: 17px;
  height: 1.5px;
  background: var(--cl-text-sub);
  border-radius: 999px;
}

body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-link-dialog .modal-header .close::before,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-image-dialog .modal-header .close::before {
  transform: rotate(45deg);
}

body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-link-dialog .modal-header .close::after,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-image-dialog .modal-header .close::after {
  transform: rotate(-45deg);
}

body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-link-dialog .modal-header .close:hover,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-link-dialog .modal-header .close:focus,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-image-dialog .modal-header .close:hover,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-image-dialog .modal-header .close:focus {
  background: #f1f2f5;
  outline: none;
  transform: rotate(90deg);
}

body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-link-dialog .modal-body,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-image-dialog .modal-body {
  padding: 0 !important;
}

body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-link-dialog .row-fluid,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-image-dialog .row-fluid {
  margin: 0 !important;
}

body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-link-dialog .form-group {
  margin: 0 0 18px;
}

body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-link-dialog label,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-image-dialog h5 {
  display: block;
  margin: 0 0 8px !important;
  color: var(--cl-text);
  font-family: inherit;
  font-size: 13.5px;
  font-weight: 700;
  line-height: 20px;
}

body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-image-dialog input[type="file"] {
  width: 100%;
  min-height: 42px;
  margin: 0 0 18px;
  padding: 9px 12px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
  color: var(--cl-text-sub);
  font-family: inherit;
  font-size: 13px;
}

body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-link-dialog .form-control,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-image-dialog .form-control {
  width: 100%;
  height: 42px;
  margin: 0 !important;
  padding: 0 13px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
  color: var(--cl-text);
  font-family: inherit;
  font-size: 13.5px;
  box-shadow: none;
  outline: none;
  transition: border-color .12s, box-shadow .12s;
}

body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-link-dialog .form-control:focus,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-image-dialog .form-control:focus {
  border-color: var(--cl-green);
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .13);
}

body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-link-dialog .form-control:disabled {
  background: #f7f8fa;
  color: var(--cl-text-sub);
}

body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-link-dialog .checkbox {
  margin: 4px 0 0;
}

body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-link-dialog .checkbox label {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin: 0 !important;
  color: var(--cl-text);
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
}

body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-link-dialog .checkbox input {
  width: 16px;
  height: 16px;
  margin: 0;
  accent-color: var(--cl-green);
}

body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-link-dialog .modal-footer,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-image-dialog .modal-footer {
  margin: 24px 0 0;
  padding: 0 !important;
  border: 0;
}

body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-link-dialog .modal-footer .btn,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-image-dialog .modal-footer .btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 46px;
  margin: 0;
  padding: 0 18px;
  background: var(--cl-green);
  border: 1px solid var(--cl-green);
  border-radius: 8px;
  color: #fff;
  font-family: inherit;
  font-size: 14px;
  font-weight: 800;
  line-height: 1;
  text-shadow: none;
  box-shadow: 0 2px 8px rgba(3, 199, 90, .28);
  transition: background-color .12s, border-color .12s, box-shadow .12s;
}

body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-link-dialog .modal-footer .btn:hover,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-link-dialog .modal-footer .btn:focus,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-image-dialog .modal-footer .btn:hover,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-image-dialog .modal-footer .btn:focus {
  background: var(--cl-green-hover);
  border-color: var(--cl-green-hover);
  outline: none;
  box-shadow: 0 2px 10px rgba(3, 199, 90, .34);
}

body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-link-dialog .modal-footer .btn.disabled,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-link-dialog .modal-footer .btn:disabled,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-image-dialog .modal-footer .btn.disabled,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .note-dialog .note-image-dialog .modal-footer .btn:disabled {
  background: #dfe3e8;
  border-color: #dfe3e8;
  color: #fff;
  box-shadow: none;
  opacity: 1;
  cursor: not-allowed;
}

body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .flat-modal.cl-common-modal:has(.modal-dialog.cl-source-notice-link-alert) {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  overflow: auto !important;
  background: rgba(0, 0, 0, .45) !important;
  z-index: 1000000 !important;
}

body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .flat-modal.cl-common-modal:has(.modal-dialog.cl-source-notice-link-alert) > .modal-default {
  position: fixed !important;
  inset: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100vw !important;
  height: 100vh !important;
  margin: 0 !important;
  padding: 24px 16px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  background: transparent !important;
  z-index: 1000000 !important;
}

body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .flat-modal.cl-common-modal:has(.modal-dialog.cl-source-notice-link-alert) > .modal-backdrop,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .flat-modal.cl-common-modal:has(.modal-dialog.cl-source-notice-link-alert) > .modal-backdrop.fade,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .flat-modal.cl-common-modal:has(.modal-dialog.cl-source-notice-link-alert) > .modal-backdrop.in {
  display: none !important;
  background: transparent !important;
  opacity: 0 !important;
}

body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .flat-modal.cl-common-modal .modal-dialog.cl-source-notice-link-alert {
  position: relative !important;
  width: 430px !important;
  max-width: calc(100vw - 32px) !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .flat-modal.cl-common-modal .modal-dialog.cl-source-notice-link-alert .modal-content {
  position: relative !important;
  width: 100% !important;
  min-height: 0 !important;
  padding: 42px 34px 28px !important;
  background: #fff !important;
  border: 0 !important;
  border-radius: 14px !important;
  box-shadow: 0 24px 64px rgba(0, 0, 0, .28) !important;
  color: var(--cl-text) !important;
  font-family: var(--cl-source-font) !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .flat-modal.cl-common-modal:has(.modal-dialog.cl-source-notice-link-alert) .cl-mobile-btn.close {
  display: none !important;
}

body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .flat-modal.cl-common-modal .modal-dialog.cl-source-notice-link-alert .modal-content > .close.close-button-dialog {
  position: absolute !important;
  top: 16px !important;
  right: 16px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub) !important;
  opacity: 1 !important;
  transition: background-color .12s, color .12s, transform .18s cubic-bezier(.34, 1.56, .64, 1);
}

body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .flat-modal.cl-common-modal .modal-dialog.cl-source-notice-link-alert .modal-content > .close.close-button-dialog:hover,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .flat-modal.cl-common-modal .modal-dialog.cl-source-notice-link-alert .modal-content > .close.close-button-dialog:focus {
  background: #f1f2f5 !important;
  color: var(--cl-text) !important;
  outline: none !important;
  transform: rotate(90deg);
}

body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .flat-modal.cl-common-modal .modal-dialog.cl-source-notice-link-alert .modal-content > .close.close-button-dialog svg {
  display: block !important;
  width: 18px !important;
  height: 18px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .flat-modal.cl-common-modal .modal-dialog.cl-source-notice-link-alert .modal-body {
  width: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 22px !important;
  text-align: center !important;
  word-break: keep-all !important;
}

body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .flat-modal.cl-common-modal .modal-dialog.cl-source-notice-link-alert .modal-title:empty {
  display: none !important;
}

body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .flat-modal.cl-common-modal .modal-dialog.cl-source-notice-link-alert .modal-footer {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  margin: 28px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .flat-modal.cl-common-modal .modal-dialog.cl-source-notice-link-alert .modal-footer > .btn {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 46px !important;
  margin: 0 !important;
  padding: 0 18px !important;
  background: var(--cl-green) !important;
  border: 1px solid var(--cl-green) !important;
  border-radius: 8px !important;
  box-shadow: 0 2px 8px rgba(3, 199, 90, .28) !important;
  color: #fff !important;
  font-family: inherit !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  text-shadow: none !important;
}

body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .flat-modal.cl-common-modal .modal-dialog.cl-source-notice-link-alert .modal-footer > .btn:hover,
body.cl-dashboard-redesign-page:has(#cl-notice-write-page) .flat-modal.cl-common-modal .modal-dialog.cl-source-notice-link-alert .modal-footer > .btn:focus {
  background: var(--cl-green-hover) !important;
  border-color: var(--cl-green-hover) !important;
  color: #fff !important;
  outline: none !important;
  box-shadow: 0 2px 10px rgba(3, 199, 90, .34) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-notice-link-alert-root {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  overflow: auto !important;
  background: rgba(0, 0, 0, .45) !important;
  z-index: 1000000 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-notice-link-alert-root > .modal-default {
  position: fixed !important;
  inset: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100vw !important;
  height: 100vh !important;
  margin: 0 !important;
  padding: 24px 16px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  background: transparent !important;
  z-index: 1000000 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-notice-link-alert-root + .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-source-notice-link-alert-root > .modal-backdrop,
body.cl-dashboard-redesign-page .modal-backdrop.cl-source-notice-link-alert-backdrop {
  display: none !important;
  background: transparent !important;
  opacity: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-notice-link-alert-root .modal-dialog.cl-source-notice-link-alert {
  position: relative !important;
  width: 430px !important;
  max-width: calc(100vw - 32px) !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-notice-link-alert-root .modal-dialog.cl-source-notice-link-alert .modal-content {
  position: relative !important;
  width: 100% !important;
  min-height: 0 !important;
  padding: 42px 34px 28px !important;
  background: #fff !important;
  border: 0 !important;
  border-radius: 14px !important;
  box-shadow: 0 24px 64px rgba(0, 0, 0, .28) !important;
  color: var(--cl-text) !important;
  font-family: var(--cl-source-font) !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-notice-link-alert-root .cl-mobile-btn.close {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-notice-link-alert-root .modal-dialog.cl-source-notice-link-alert .modal-content > .close.close-button-dialog {
  position: absolute !important;
  top: 16px !important;
  right: 16px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub) !important;
  opacity: 1 !important;
  transition: background-color .12s, color .12s, transform .18s cubic-bezier(.34, 1.56, .64, 1);
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-notice-link-alert-root .modal-dialog.cl-source-notice-link-alert .modal-content > .close.close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-notice-link-alert-root .modal-dialog.cl-source-notice-link-alert .modal-content > .close.close-button-dialog:focus {
  background: #f1f2f5 !important;
  color: var(--cl-text) !important;
  outline: none !important;
  transform: rotate(90deg);
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-notice-link-alert-root .modal-dialog.cl-source-notice-link-alert .modal-content > .close.close-button-dialog svg {
  display: block !important;
  width: 18px !important;
  height: 18px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-notice-link-alert-root .modal-dialog.cl-source-notice-link-alert .modal-body {
  width: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 22px !important;
  text-align: center !important;
  word-break: keep-all !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-notice-link-alert-root .modal-dialog.cl-source-notice-link-alert .modal-title:empty {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-notice-link-alert-root .modal-dialog.cl-source-notice-link-alert .modal-footer {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  margin: 28px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-notice-link-alert-root .modal-dialog.cl-source-notice-link-alert .modal-footer > .btn {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 46px !important;
  margin: 0 !important;
  padding: 0 18px !important;
  background: var(--cl-green) !important;
  border: 1px solid var(--cl-green) !important;
  border-radius: 8px !important;
  box-shadow: 0 2px 8px rgba(3, 199, 90, .28) !important;
  color: #fff !important;
  font-family: inherit !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  text-shadow: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-notice-link-alert-root .modal-dialog.cl-source-notice-link-alert .modal-footer > .btn:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-notice-link-alert-root .modal-dialog.cl-source-notice-link-alert .modal-footer > .btn:focus {
  background: var(--cl-green-hover) !important;
  border-color: var(--cl-green-hover) !important;
  color: #fff !important;
  outline: none !important;
  box-shadow: 0 2px 10px rgba(3, 199, 90, .34) !important;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-result-file {
  display: none;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-write-loading {
  display: none;
  width: 28px;
  height: 28px;
  margin: 10px auto 0;
  border: 3px solid #e4f7ec;
  border-top-color: var(--cl-green);
  border-radius: 50%;
  animation: cl-source-notice-write-spin .8s linear infinite;
}

@keyframes cl-source-notice-write-spin {
  to {
    transform: rotate(360deg);
  }
}

body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-write-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 24px;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-write-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 92px;
  height: 38px;
  margin: 0;
  padding: 0 18px;
  border-radius: 8px;
  font-family: inherit;
  font-size: 13.5px;
  font-weight: 800;
  text-decoration: none;
  cursor: pointer;
  transition: background-color .12s, border-color .12s, color .12s, box-shadow .12s;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-write-btn.primary {
  background: var(--cl-green);
  border: 1px solid var(--cl-green);
  color: #fff;
  box-shadow: var(--cl-shadow-publish);
}

body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-write-btn.primary:hover,
body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-write-btn.primary:focus {
  background: var(--cl-green-hover);
  border-color: var(--cl-green-hover);
  color: #fff;
  outline: none;
}

body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-write-btn.secondary {
  background: #fff;
  border: 1px solid var(--cl-border);
  color: var(--cl-text-sub);
}

body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-write-btn.secondary:hover,
body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-write-btn.secondary:focus {
  background: #f1fbf5;
  border-color: var(--cl-green);
  color: var(--cl-green-text);
  text-decoration: none;
  outline: none;
}

@media only screen and (max-width: 767px) {
  body.cl-dashboard-redesign-page #cl-notice-write-page {
    margin-top: 0 !important;
    margin-right: var(--cl-source-app-gutter) !important;
    margin-left: var(--cl-source-app-gutter) !important;
    padding: 20px 16px 40px !important;
  }

  body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-write-head,
  body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-write-form {
    max-width: 100%;
  }

  body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-write-panel {
    padding: 18px 16px 20px;
  }

  body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-write-actions {
    justify-content: stretch;
  }

  body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-write-btn {
    flex: 1;
  }
}

.cl-source-period-tabs {
  display: flex;
  align-items: center;
  gap: 16px;
  color: var(--cl-text-sub);
  font-size: 13px;
  font-weight: 400;
}

.cl-source-period-tabs > span {
  padding: 5px 10px;
  border: 1px solid transparent;
  border-radius: 6px;
  line-height: 1.2;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color .12s ease, color .12s ease, border-color .12s ease;
}

.cl-source-period-tabs > span:hover {
  background: #e4f7ec;
  color: var(--cl-green-text);
}

.cl-source-period-tabs > span.active {
  background: #e4f7ec;
  color: var(--cl-green-text);
  font-weight: 700;
}

.cl-source-period-tabs > span.active:hover {
  background: #dcf3e5;
}

.cl-source-sales-calendar-wrap {
  position: relative;
  z-index: 30;
  display: inline-flex;
}

.cl-source-period-tabs .period-cal-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 6px;
  color: var(--cl-text-sub);
  cursor: pointer;
  transition: background .12s, color .12s;
}

.cl-source-period-tabs .period-cal-btn:hover {
  background: #f4f5f9;
  color: var(--cl-text);
}

.cl-source-period-tabs .period-cal-btn.active {
  background: #e4f7ec;
  color: var(--cl-green-text);
}

.cl-source-period-tabs .period-cal-btn svg {
  width: 16px;
  height: 16px;
}

.cl-source-period-tabs .vcal {
  display: none;
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 300;
  width: 288px;
  padding: 14px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 12px;
  box-shadow: 0 12px 30px rgba(20, 24, 32, .16);
}

.cl-source-period-tabs .vcal.open {
  display: block;
}

.cl-source-period-tabs .vcal-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
}

.cl-source-period-tabs .vcal-title {
  color: var(--cl-text);
  font-size: 13.5px;
  font-weight: 700;
}

.cl-source-period-tabs .vcal-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 6px;
  color: var(--cl-text-sub);
  cursor: pointer;
}

.cl-source-period-tabs .vcal-nav:hover {
  background: #f4f5f9;
  color: var(--cl-text);
}

.cl-source-period-tabs .vcal-nav svg {
  width: 16px;
  height: 16px;
}

.cl-source-period-tabs .vcal-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
}

.cl-source-period-tabs .vcal-wd {
  padding: 4px 0 6px;
  color: var(--cl-text-muted);
  font-size: 11px;
  font-weight: 700;
  text-align: center;
}

.cl-source-period-tabs .vcal-wd.sun {
  color: #e5484d;
}

.cl-source-period-tabs .vcal-wd.sat {
  color: var(--cl-green-text);
}

.cl-source-period-tabs .vcal-day {
  position: relative;
  padding: 7px 0;
  color: var(--cl-text);
  font-size: 12.5px;
  text-align: center;
  cursor: pointer;
}

.cl-source-period-tabs .vcal-day.other {
  color: var(--cl-text-muted);
  opacity: .45;
}

.cl-source-period-tabs .vcal-day:hover:not(.sel) {
  background: #f1f2f5;
  border-radius: 6px;
}

.cl-dashboard-redesign .cl-dashboard-home .vcal .vcal-day.disabled,
.cl-dashboard-redesign .cl-dashboard-home .vcal .vcal-nav.disabled {
  color: var(--cl-text-muted);
  background: transparent;
  opacity: .45;
  cursor: not-allowed;
}

body.cl-dashboard-redesign-page .cl-dashboard-home [data-cl-dismissible-popover]:focus-visible {
  outline: 2px solid var(--cl-green);
  outline-offset: 2px;
}

.cl-source-period-tabs .vcal-day.in-range {
  background: #e4f7ec;
  color: var(--cl-green-text);
}

.cl-source-period-tabs .vcal-day.in-range:hover {
  background: #d6f0e0;
  border-radius: 0;
}

.cl-source-period-tabs .vcal-day.sel {
  z-index: 1;
  background: var(--cl-green);
  border-radius: 6px;
  color: #fff;
  font-weight: 700;
}

.cl-source-period-tabs .vcal-day.range-start {
  border-radius: 6px 0 0 6px;
}

.cl-source-period-tabs .vcal-day.range-end {
  border-radius: 0 6px 6px 0;
}

.cl-source-period-tabs .vcal-day.today::after {
  position: absolute;
  bottom: 3px;
  left: 50%;
  width: 4px;
  height: 4px;
  background: var(--cl-green);
  border-radius: 50%;
  content: "";
  transform: translateX(-50%);
}

.cl-source-period-tabs .vcal-day.sel.today::after {
  background: #fff;
}

.cl-source-sales-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  text-align: center;
}

.cl-source-sales-stats > div {
  min-width: 0;
  padding: 0;
  border-left: 0;
}

.cl-source-sales-stats span {
  display: block;
  margin-bottom: 6px;
  color: var(--cl-text-sub);
  font-size: 12.5px;
  font-weight: 400;
}

.cl-source-sales-stats strong {
  display: block;
  color: var(--cl-green-text);
  font-size: 28px;
  font-weight: 800;
  line-height: 36px;
}

.cl-source-sales-stats strong.date {
  color: var(--cl-text);
  font-size: 15px;
  font-weight: 700;
  white-space: nowrap;
}

.cl-source-sales-stats b {
  font-weight: inherit;
}

.cl-source-sales-stats em {
  margin-left: 2px;
  color: var(--cl-text-sub);
  font-size: 13.5px;
  font-style: normal;
  font-weight: 500;
}

body.cl-dashboard-redesign-page .cl-dashboard-home {
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .cl-home-main-grid {
  display: grid !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 0 !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr);
  gap: 24px;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .cl-home-left,
body.cl-dashboard-redesign-page .cl-dashboard-home .cl-home-right {
  right: auto !important;
  left: auto !important;
  float: none !important;
  width: auto !important;
  min-width: 0;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .cl-home-left {
  grid-column: 1;
  grid-row: 1;
  display: flex !important;
  flex-direction: column;
  gap: 24px;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .cl-home-right {
  display: contents !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .cl-home-notification-panel-wrap {
  grid-column: 2;
  grid-row: 1 / span 2;
  width: auto !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .cl-home-kakao-panel {
  position: relative;
  top: -4px;
  grid-column: 1;
  grid-row: 2;
  width: auto !important;
  height: 79px;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity {
  display: flex;
  height: 672px;
  min-height: 672px;
  height: 100%;
  margin: 0 !important;
  padding: 22px 24px !important;
  flex-direction: column;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity .site-sub-title,
body.cl-dashboard-redesign-page .cl-dashboard-home .site-visit .site-sub-title,
body.cl-dashboard-redesign-page .cl-dashboard-home .site-space .site-sub-title,
body.cl-dashboard-redesign-page .cl-dashboard-home .main-kakaotalk-wrap .main-kt-text {
  float: none !important;
  margin: 0;
  color: var(--cl-text);
  font-size: 16px;
  font-weight: 900;
  line-height: 1.35;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .inbox {
  display: flex;
  min-height: 0;
  flex: 1;
  flex-direction: column;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .inbox .nav-tabs {
  display: flex !important;
  flex: none;
  width: 100%;
  margin: 0 !important;
  border-bottom: 1px solid var(--cl-border);
}

body.cl-dashboard-redesign-page .cl-dashboard-home .inbox .nav-tabs > li {
  flex: 1;
  float: none !important;
  margin: 0 !important;
  border: 0;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .inbox .nav-tabs > li > a {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 58px;
  flex-direction: column;
  gap: 4px;
  margin: 0;
  padding: 9px 4px 12px;
  border: 0;
  border-bottom: 2px solid transparent;
  color: var(--cl-text-muted);
  font-size: 12px;
  font-weight: 400;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .inbox .nav-tabs > li.active > a,
body.cl-dashboard-redesign-page .cl-dashboard-home .inbox .nav-tabs > li.active > a:hover,
body.cl-dashboard-redesign-page .cl-dashboard-home .inbox .nav-tabs > li.active > a:focus {
  background: transparent;
  border: 0;
  border-bottom: 2px solid var(--cl-text);
  color: var(--cl-text);
}

body.cl-dashboard-redesign-page .cl-dashboard-home .inbox .nav-tabs > li.active > a::before {
  content: none;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .inbox .nav-tabs > li > a > div.count {
  /* 기존 모바일 알림 스타일의 건수 숨김을 해제한다. */
  display: block;
  color: inherit;
  font-size: 19px;
  font-weight: 800;
  line-height: 1;
  transition: color .12s ease;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .inbox .nav-tabs > li > a > div.type {
  color: inherit;
  font-weight: 400;
  white-space: nowrap;
  transition: color .12s ease;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .inbox .nav-tabs > li.active > a > div.type {
  font-weight: 600;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .inbox .nav-tabs > li:not(.active) > a:hover,
body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .inbox .nav-tabs > li:not(.active) > a:focus {
  background: transparent !important;
  border-color: transparent !important;
  border-bottom-color: transparent !important;
  color: var(--cl-text) !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .inbox .nav-tabs > li:not(.active) > a:hover > div.count,
body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .inbox .nav-tabs > li:not(.active) > a:focus > div.count,
body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .inbox .nav-tabs > li:not(.active) > a:hover > div.type,
body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .inbox .nav-tabs > li:not(.active) > a:focus > div.type {
  color: var(--cl-text) !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .inbox .tab-content,
body.cl-dashboard-redesign-page .cl-dashboard-home .inbox .tab-content.empty,
body.cl-dashboard-redesign-page .cl-dashboard-home .inbox .tab-content.not-empty,
body.cl-dashboard-redesign-page .cl-dashboard-home .inbox .tab-content.not-empty.inbox-ctrls-on {
  flex: 1;
  width: 100%;
  min-height: 420px;
  height: 420px;
  margin: 0;
  overflow-x: hidden;
  overflow-y: auto;
  background: #fff;
  border: 0;
  border-radius: 0;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .inbox .inbox-ctrls {
  flex: none;
  padding: 12px 0 0;
  border-top: 1px solid var(--cl-border);
}

body.cl-dashboard-redesign-page .cl-dashboard-home .inbox .inbox-ctrls.cl-source-legacy-inbox-ctrls {
  display: none !important;
  padding: 0 !important;
  border: 0 !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .inbox .inbox-ctrls .mark-all-read {
  display: none;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .site-visit {
  height: 345px;
  min-height: 345px;
  margin: 0 !important;
  padding: 22px 24px !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .site-visit .site-sub-title {
  margin-bottom: 14px;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .site-visit .site-date-wrap {
  position: relative;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .site-visit .visit-date {
  position: absolute;
  top: -44px;
  right: 0;
  float: none;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .site-visit .visit-info {
  display: flex;
  float: none;
  width: auto;
  margin: 0 0 8px;
  padding: 0;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .site-visit .visit-chart {
  padding-top: 12px;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .site-visit .visit-chart > canvas {
  width: 100%;
  height: 190px;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .site-space {
  display: block !important;
  box-sizing: border-box !important;
  width: 100%;
  height: 192px;
  min-height: 192px;
  margin: 0 !important;
  padding: 22px 24px !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .site-space .space-captraffic {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  height: 100% !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .site-space .space-capacity,
body.cl-dashboard-redesign-page .cl-dashboard-home .site-space .space-traffic {
  width: auto;
  padding: 0;
  text-align: center;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .main-kakaotalk-wrap .main-pc-wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 79px;
  min-height: 79px;
  margin: 0 !important;
  padding: 18px 24px !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .main-kakaotalk-wrap .kakao-responsive-wrap-top,
body.cl-dashboard-redesign-page .cl-dashboard-home .main-kakaotalk-wrap .kakao-responsive-wrap-bottom {
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .main-kakaotalk-wrap .kakao-responsive-wrap-bottom {
  display: flex;
  align-items: center;
  gap: 12px;
}

/* Source parity pass */
body.cl-dashboard-redesign-page .cl-dashboard-home #pc-banner-popup,
body.cl-dashboard-redesign-page #dashboardTopBanner,
body.cl-dashboard-redesign-page #pc-banner-popup,
body.cl-dashboard-redesign-page .site-bestSite,
body.cl-dashboard-redesign-page #creatorlinkqna,
body.cl-dashboard-redesign-page .creatorlinkqna,
body.cl-dashboard-redesign-page .cl-cts-banner,
body.cl-dashboard-redesign-page .site-cts-banner,
body.cl-dashboard-redesign-page #ch-plugin,
body:has(.cl-dashboard-redesign) .cl-cts-banner,
body:has(.cl-dashboard-redesign) .site-cts-banner,
body:has(.cl-dashboard-redesign) #ch-plugin,
body:has(.cl-source-shopping-page) .cl-cts-banner,
body:has(.cl-source-shopping-page) .site-cts-banner,
body:has(.cl-source-shopping-page) #ch-plugin {
  display: none !important;
  visibility: hidden !important;
  width: 0 !important;
  height: 0 !important;
  max-width: 0 !important;
  max-height: 0 !important;
  min-height: 0 !important;
  opacity: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
}

/* Standalone plan checkout must keep mobile price and payment controls clear. */
@media (max-width: 768px) {
  body.cl-dashboard-plan-payment-page .cl-cts-banner,
  body.cl-dashboard-plan-payment-page .site-cts-banner,
  body.cl-dashboard-plan-payment-page #ch-plugin {
    display: none !important;
  }
}

.cl-source-site-thumb {
  height: auto;
  min-height: 133px;
  padding: 18px 0 14px;
  background: transparent;
  border: 0;
  border-radius: 0;
}

.cl-source-site-thumb img {
  width: 168px;
  height: 133px;
  object-fit: contain;
}

@media (min-width: 901px) {
  body.cl-dashboard-redesign-page .dashboard-section,
  body.cl-dashboard-redesign-page .dashbottom-wrap {
    padding: 28px 0 60px !important;
  }

  body.cl-dashboard-redesign-page .dashboard-section > .container > .row,
  body.cl-dashboard-redesign-page .dashbottom-wrap > .dashbottom-container {
    padding-right: 32px !important;
    padding-left: 32px !important;
  }
}

/* 중간 데스크톱에서는 알림 열이 과도하게 넓어지지 않도록 두 열을 균등 배치한다. */
@media (min-width: 1181px) and (max-width: 1439px) {
  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-home-main-grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }
}

@media (max-width: 1180px) {
  .cl-source-topnav {
    gap: 28px;
  }

  .cl-source-dashboard-head {
    grid-template-columns: 1fr;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-home-main-grid {
    grid-template-columns: 1fr;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-home-notification-panel-wrap,
  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-home-kakao-panel {
    grid-column: 1;
    grid-row: auto;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-home-right {
    display: flex !important;
    flex-direction: column;
    gap: 24px;
  }
}

/* Flow 86618650: 901~1180px 매출 통계에서 기간과 방문자 수가 겹치지 않게 줄을 분리한다. */
@media (min-width: 901px) and (max-width: 1180px) {
  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-source-sales-panel {
    height: auto !important;
    min-height: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-source-sales-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    align-items: start;
    row-gap: 18px;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-source-sales-stats > div:first-child {
    grid-column: 1 / -1;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-source-sales-stats strong {
    font-size: 20px;
    line-height: 26px;
    white-space: nowrap;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-source-sales-stats strong.date {
    font-size: 15px;
    line-height: 22px;
    white-space: normal;
  }
}

@media (max-width: 900px) {
  html:has(body.cl-dashboard-redesign-page .cl-source-topbar) {
    /* 항목 이동·포커스 스크롤 시 고정 메뉴 아래에 내용을 노출한다. */
    scroll-padding-top: calc(var(--cl-source-topbar-h) + 12px);
  }

  body.cl-dashboard-redesign-page {
    padding-top: var(--cl-source-topbar-h);
  }

  body.cl-dashboard-redesign-page .cl-source-topbar {
    display: grid;
    /* 계정 영역의 실제 폭을 확보하고 로고가 남은 공간에 맞춰 줄어든다. */
    grid-template-columns: auto minmax(0, 1fr) auto;
    column-gap: 8px;
    padding: 0 14px;
  }

  body.cl-dashboard-redesign-page .cl-source-brand-area {
    justify-self: center;
    max-width: 100%;
    gap: 8px;
  }

  body.cl-dashboard-redesign-page .cl-source-logo {
    min-width: 0;
  }

  body.cl-dashboard-redesign-page .cl-source-logo .logo-svg {
    max-width: 100%;
    object-fit: contain;
  }

  .cl-source-hamburger {
    display: inline-flex;
  }

  .cl-source-top-actions {
    justify-self: end;
    min-width: 0;
    max-width: 100%;
    gap: 8px;
  }

  .cl-source-top-actions .cl-source-icon-btn,
  .cl-source-user > svg {
    flex: none;
  }

  .cl-source-user {
    min-width: 0;
  }

  body.cl-dashboard-redesign-page .cl-source-user > span {
    max-width: min(160px, 30vw);
    flex: none;
  }

  .cl-source-logo-text {
    font-size: 18px;
  }

  .cl-source-topnav {
    display: none;
  }

  body.cl-dashboard-redesign-page .cl-source-topbar .user_session_refresh.cl-source-user-session-exit {
    order: -1;
    flex: none;
    width: 32px !important;
    max-width: 32px;
    min-width: 32px;
    padding: 0;
  }

  body.cl-dashboard-redesign-page .cl-source-topbar .user_session_refresh.cl-source-user-session-exit span {
    display: none;
  }

  .cl-source-sidebar {
    transform: translateX(-100%);
    transition: transform .18s ease;
  }

  .cl-source-sidebar.open {
    transform: translateX(0);
    box-shadow: 0 14px 44px rgba(20, 24, 32, .3);
  }

  .cl-source-sidebar-backdrop {
    position: fixed;
    inset: var(--cl-source-topbar-h) 0 0 0;
    z-index: 1050;
    display: block;
    pointer-events: none;
    background: rgba(20, 24, 32, .42);
    opacity: 0;
    transition: opacity .18s ease;
  }

  .cl-source-sidebar-backdrop.open {
    pointer-events: auto;
    opacity: 1;
  }

  body.cl-dashboard-redesign-page .dashboard-section,
  body.cl-dashboard-redesign-page .dashbottom-wrap {
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding: 22px 18px 44px !important;
  }

  .cl-source-summary-cards,
  .cl-source-sales-stats {
    grid-template-columns: 1fr;
  }

  .cl-source-sales-stats > div {
    padding: 14px 0;
    border-top: 1px solid var(--cl-border);
    border-left: 0;
  }

  .cl-source-sales-stats > div:first-child {
    border-top: 0;
  }
}

@media (max-width: 640px) {
  .cl-source-dashboard-head {
    gap: 18px;
    margin-bottom: 20px;
  }

  .cl-source-summary-cards {
    gap: 12px;
  }

  .cl-source-notice-panel,
  .cl-source-sales-panel,
  body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity,
  body.cl-dashboard-redesign-page .cl-dashboard-home .site-visit,
  body.cl-dashboard-redesign-page .cl-dashboard-home .site-space,
  body.cl-dashboard-redesign-page .cl-dashboard-home .main-kakaotalk-wrap .main-pc-wrap {
    border-radius: 12px !important;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .site-visit .visit-date {
    position: static;
    margin-bottom: 12px;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .site-space .space-captraffic {
    grid-template-columns: 1fr;
    gap: 22px;
  }
}

body.cl-dashboard-redesign-page .cl-dashboard-home .site-visit.cl-source-visitor-panel {
  position: relative;
  z-index: 1;
  height: 349px !important;
  min-height: 349px !important;
  padding: 22px 24px !important;
  overflow: visible;
}

@media (max-width: 640px) {
  body.cl-dashboard-redesign-page .cl-dashboard-home .site-visit.cl-source-visitor-panel {
    height: auto !important;
    min-height: 0 !important;
    padding: 18px 16px 22px !important;
  }
}

body.cl-dashboard-redesign-page .cl-dashboard-home .site-visit.cl-source-visitor-panel .site-sub-title {
  margin: 0 !important;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.2;
}

@media (min-width: 641px) {
  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-source-visitor-head > .site-sub-title {
    flex: 0 1 auto !important;
    width: auto !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-source-visitor-head > .vcal-wrap {
    width: auto !important;
    height: auto !important;
    margin-left: auto !important;
  }
}

/* Source dashboard notification panel */
body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel {
  height: 664px !important;
  min-height: 664px !important;
  padding: 22px 24px !important;
}

.cl-source-notification-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
}

.cl-source-notification-head h3 {
  margin: 0;
  color: var(--cl-text);
  font-size: 16px;
  font-weight: 700;
  line-height: 1.2;
}

.cl-source-mark-all-read {
  margin-right: -3px;
  padding: 3px 7px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--cl-text);
  font-family: inherit;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.2;
}

.cl-source-mark-all-read:hover,
.cl-source-mark-all-read:focus-visible {
  background: #f1f2f5;
  color: var(--cl-text);
  outline: 0;
}

.cl-source-notification-tabs {
  display: flex;
  flex: none;
  border-bottom: 1px solid var(--cl-border);
}

.cl-source-notification-tabs button {
  flex: 1;
  min-width: 0;
  margin: 0 0 -1px;
  padding: 6px 4px 12px;
  border: 0;
  border-bottom: 2px solid transparent;
  background: transparent;
  color: var(--cl-text-muted);
  font-family: inherit;
  text-align: center;
}

.cl-source-notification-tabs button strong,
.cl-source-notification-tabs button span {
  display: block;
}

.cl-source-notification-tabs button strong {
  font-size: 19px;
  font-weight: 800;
  line-height: 1.15;
}

.cl-source-notification-tabs button span {
  margin-top: 2px;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.2;
}

.cl-source-notification-tabs button:not(.active):hover,
.cl-source-notification-tabs button:not(.active):focus-visible {
  color: var(--cl-text);
}

.cl-source-notification-tabs button.active {
  border-bottom-color: var(--cl-text);
  color: var(--cl-text);
}

.cl-source-notification-tabs button.active span {
  font-weight: 600;
}

.cl-source-notification-list {
  flex: 1;
  min-height: 0;
  margin: 0 -6px;
  overflow-x: hidden;
  overflow-y: auto;
}

.cl-source-notification-item {
  position: relative;
  display: flex;
  width: 100%;
  min-height: 64px;
  align-items: flex-start;
  gap: 10px;
  padding: 12px 8px;
  border: 0;
  border-top: 1px solid var(--cl-border);
  background: transparent;
  color: var(--cl-text);
  cursor: default;
  font-family: inherit;
  text-align: left;
}

.cl-source-notification-item:first-child {
  border-top: 0;
}

.cl-source-notification-item:hover,
.cl-source-notification-item:focus-visible {
  background: transparent;
  outline: 0;
}

.cl-source-notification-item.unread {
  cursor: pointer;
}

.cl-source-notification-item.unread:hover,
.cl-source-notification-item.unread:focus-visible {
  margin: 0 -12px;
  width: calc(100% + 24px);
  padding-left: 20px;
  padding-right: 20px;
  border-radius: 8px;
  background: #f7f8fa;
}

.cl-source-notification-avatar {
  display: flex;
  width: 30px;
  height: 30px;
  flex: none;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #edeef0;
  color: var(--cl-text);
}

.cl-source-notification-avatar svg {
  width: 15px;
  height: 15px;
}

.cl-source-notification-item:not(.unread) .cl-source-notification-avatar {
  background: #eef0f3;
  color: #9ba1a9;
}

.cl-source-notification-body {
  min-width: 0;
  flex: 1;
}

.cl-source-notification-top {
  display: flex;
  align-items: baseline;
  gap: 14px;
  margin-bottom: 3px;
}

.cl-source-notification-top strong {
  max-width: 160px;
  overflow: hidden;
  color: var(--cl-text);
  font-size: 13.5px;
  font-weight: 700;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cl-source-notification-item:not(.unread) .cl-source-notification-top strong {
  color: var(--cl-text-sub);
}

.cl-source-notification-top em {
  flex: none;
  color: var(--cl-text-muted);
  font-size: 11.5px;
  font-style: normal;
  font-weight: 400;
  line-height: 1.25;
  white-space: nowrap;
}

.cl-source-notification-message {
  display: -webkit-box;
  overflow: hidden;
  color: var(--cl-text-sub);
  font-size: 13px;
  font-weight: 400;
  line-height: 1.5;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.cl-source-notification-item.unread .cl-source-notification-message {
  color: var(--cl-text);
  font-weight: 700;
}

.cl-source-notification-empty {
  margin: 0;
  padding: 36px 0;
  color: var(--cl-text-muted);
  font-size: 13px;
  text-align: center;
}

/* Source dashboard capacity and traffic gauges */
.cl-source-gauge-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.cl-source-gauge-item {
  min-width: 0;
}

.cl-source-gauge-item h3 {
  display: flex;
  align-items: center;
  gap: 5px;
  margin: 0 0 18px;
  color: var(--cl-text);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.2;
}

.cl-source-gauge-item h3 svg {
  width: 14px;
  height: 14px;
  flex: none;
  fill: var(--cl-accent-blue);
}

.cl-source-gauge-wrap {
  position: relative;
  width: 112px;
  height: 112px;
  margin: 0 0 0 77px;
}

.cl-source-gauge-wrap > svg {
  display: block;
  width: 112px;
  height: 112px;
}

.cl-source-gauge-label {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  text-align: center;
}

.cl-source-gauge-label strong {
  color: var(--cl-text);
  font-size: 18px;
  font-weight: 800;
  line-height: 1.15;
}

.cl-source-gauge-label span {
  margin-top: 2px;
  color: var(--cl-text-sub);
  font-size: 11.5px;
  font-weight: 400;
  line-height: 1.2;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .site-space .space-captraffic {
  align-items: start !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .site-space .space-capacity,
body.cl-dashboard-redesign-page .cl-dashboard-home .site-space .space-traffic {
  display: block !important;
  min-width: 0 !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .site-space .space-capacity > .site-sub-title,
body.cl-dashboard-redesign-page .cl-dashboard-home .site-space .space-traffic > .site-sub-title {
  display: flex !important;
  align-items: center !important;
  gap: 5px !important;
  min-height: 17px !important;
  margin: 0 0 8px !important;
  color: var(--cl-text) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .site-space .space-capacity > .site-sub-title svg.cm-popover-info,
body.cl-dashboard-redesign-page .cl-dashboard-home .site-space .space-traffic > .site-sub-title svg.cm-popover-info {
  width: 14px !important;
  height: 14px !important;
  flex: none !important;
  margin: 0 !important;
  fill: var(--cl-accent-blue) !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .site-capacity,
body.cl-dashboard-redesign-page .cl-dashboard-home .site-traffic {
  width: 112px !important;
  height: 112px !important;
  min-height: 112px !important;
  margin: 0 0 0 77px !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .site-capacity .circles-wrp,
body.cl-dashboard-redesign-page .cl-dashboard-home .site-traffic .circles-wrp {
  display: block !important;
  width: 112px !important;
  height: 112px !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .site-capacity .circles-wrp > svg,
body.cl-dashboard-redesign-page .cl-dashboard-home .site-traffic .circles-wrp > svg {
  display: block !important;
  width: 112px !important;
  height: 112px !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .site-capacity .circles-text,
body.cl-dashboard-redesign-page .cl-dashboard-home .site-traffic .circles-text {
  position: absolute !important;
  inset: 0 !important;
  display: flex !important;
  width: 100% !important;
  height: 112px !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-size: 18px !important;
  font-weight: 800 !important;
  line-height: 1.15 !important;
  text-align: center !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .site-capacity .circles-text > div,
body.cl-dashboard-redesign-page .cl-dashboard-home .site-traffic .circles-text > div {
  position: static !important;
  width: auto !important;
  color: var(--cl-text) !important;
  font-size: 18px !important;
  font-weight: 800 !important;
  line-height: 1.15 !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .site-capacity .circles-text div > span:first-child,
body.cl-dashboard-redesign-page .cl-dashboard-home .site-capacity .circles-text div > label,
body.cl-dashboard-redesign-page .cl-dashboard-home .site-traffic .circles-text div > span:first-child,
body.cl-dashboard-redesign-page .cl-dashboard-home .site-traffic .circles-text div > label {
  color: var(--cl-text) !important;
  font-size: 18px !important;
  font-weight: 800 !important;
  line-height: 1.15 !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .site-capacity .circles-text div > span.val,
body.cl-dashboard-redesign-page .cl-dashboard-home .site-traffic .circles-text div > span.val {
  display: block !important;
  margin: 2px 0 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 11.5px !important;
  font-weight: 400 !important;
  line-height: 1.2 !important;
}

/* Source dashboard interaction motion */
.cl-source-summary-card,
.cl-source-notice-panel,
.cl-source-sales-panel,
body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity,
body.cl-dashboard-redesign-page .cl-dashboard-home .site-visit,
body.cl-dashboard-redesign-page .cl-dashboard-home .site-space,
body.cl-dashboard-redesign-page .cl-dashboard-home .main-kakaotalk-wrap .main-pc-wrap {
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background-color .18s ease;
}

.cl-source-notice-panel:hover,
.cl-source-sales-panel:hover,
body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity:hover,
body.cl-dashboard-redesign-page .cl-dashboard-home .site-visit:hover,
body.cl-dashboard-redesign-page .cl-dashboard-home .site-space:hover,
body.cl-dashboard-redesign-page .cl-dashboard-home .main-kakaotalk-wrap .main-pc-wrap:hover {
  transform: none;
  box-shadow: var(--cl-shadow-panel) !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .site-visit.cl-source-visitor-panel.cl-source-vcal-open {
  z-index: 20;
}

.cl-source-site-select,
.cl-source-site-add,
.cl-source-site-actions a,
.cl-source-site-mgmt-modal,
.cl-source-site-mgmt-add,
.cl-source-site-row,
.cl-source-site-drag-handle,
.cl-source-site-row-menu-btn,
.cl-source-site-row-menu,
.cl-source-period-tabs > span,
.cl-source-period-tabs .period-cal-btn,
.cl-source-visitor-panel .vperiod,
.cl-source-visitor-panel .cl-source-inflow-btn,
.cl-source-mark-all-read,
.cl-source-notification-tabs button,
.cl-source-alimtalk-charge,
.cl-source-alimtalk-settings {
  transition: box-shadow .16s ease, border-color .16s ease, background-color .16s ease, color .16s ease;
}

.cl-source-site-add:hover,
.cl-source-site-add:focus {
  background: #f1fbf5;
  border-color: #b7e7c9;
  transform: none;
}

.cl-source-site-add.site-create-btn:not(.site-list-wrap):hover,
.cl-source-site-add.site-create-btn:not(.site-list-wrap):focus {
  background: #f1fbf5;
  border-color: #b7e7c9;
  transform: none;
}

.cl-source-site-add:active {
  transform: none;
}

.cl-source-site-add.site-create-btn:not(.site-list-wrap):active {
  transform: none;
}

.cl-source-site-add:hover svg,
.cl-source-site-add:focus svg {
  transform: none;
}

.cl-source-site-add.site-create-btn:not(.site-list-wrap):hover svg,
.cl-source-site-add.site-create-btn:not(.site-list-wrap):focus svg {
  transform: none;
}

[data-cl-count] {
  font-variant-numeric: tabular-nums;
}

.cl-source-gauge-progress {
  transition: stroke-dashoffset 1.5s cubic-bezier(.22, 1, .36, 1);
}

@media (prefers-reduced-motion: reduce) {
  .cl-source-summary-card,
  .cl-source-notice-panel,
  .cl-source-sales-panel,
  body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity,
  body.cl-dashboard-redesign-page .cl-dashboard-home .site-visit,
  body.cl-dashboard-redesign-page .cl-dashboard-home .site-space,
  body.cl-dashboard-redesign-page .cl-dashboard-home .main-kakaotalk-wrap .main-pc-wrap,
  .cl-source-site-select,
  .cl-source-site-add,
  .cl-source-site-actions a,
  .cl-source-period-tabs > span,
  .cl-source-period-tabs .period-cal-btn,
  .cl-source-visitor-panel .vperiod,
  .cl-source-visitor-panel .cl-source-inflow-btn,
  .cl-source-mark-all-read,
  .cl-source-notification-tabs button,
  .cl-source-alimtalk-charge,
  .cl-source-alimtalk-settings,
  .cl-source-gauge-progress,
  .cl-source-visitor-panel .cl-source-visitor-area,
  .cl-source-visitor-panel .cl-source-visitor-line,
  .cl-source-visitor-panel .cl-source-visitor-dot-point {
    animation: none !important;
    transition: none !important;
  }

  .cl-source-visitor-panel .cl-source-visitor-area,
  .cl-source-visitor-panel .cl-source-visitor-dot-point {
    opacity: 1 !important;
    transform: none !important;
  }

  .cl-source-visitor-panel .cl-source-visitor-line {
    stroke-dasharray: none !important;
    stroke-dashoffset: 0 !important;
  }
}

/* Source dashboard remaining Alimtalk bar */
body.cl-dashboard-redesign-page .cl-dashboard-home .main-kakaotalk-wrap .main-pc-wrap.cl-source-alimtalk-panel.charge-bar-inline {
  display: flex !important;
  height: 79px !important;
  min-height: 79px !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: nowrap !important;
  gap: 12px !important;
  margin: 0 !important;
  padding: 20px 24px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: var(--cl-radius-lg) !important;
  box-shadow: var(--cl-shadow-panel) !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .charge-left,
body.cl-dashboard-redesign-page .cl-dashboard-home .charge-right {
  display: flex !important;
  align-items: center !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .charge-left {
  gap: 10px !important;
  min-width: 0 !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .charge-label {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  line-height: 14px !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .charge-label .help-ico {
  position: relative !important;
  top: 0 !important;
  display: block !important;
  align-self: center !important;
  flex: none !important;
  width: 14px !important;
  height: 14px !important;
  margin: 0 !important;
  fill: var(--cl-green) !important;
  color: var(--cl-green) !important;
  cursor: pointer !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .charge-input {
  box-sizing: border-box !important;
  width: 110px !important;
  height: 32px !important;
  min-height: 32px !important;
  margin: 0 !important;
  padding: 8px 10px !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: var(--cl-radius-sm) !important;
  background: #f4f5f9 !important;
  color: var(--cl-text-muted) !important;
  font-family: inherit !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.2 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .charge-right {
  flex: none !important;
  gap: 12px !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .charge-btn.cl-source-alimtalk-charge {
  display: inline-flex !important;
  box-sizing: border-box !important;
  width: 81px !important;
  min-width: 81px !important;
  max-width: 81px !important;
  height: 37px !important;
  min-height: 37px !important;
  max-height: 37px !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  padding: 9px 18px !important;
  border: 0 !important;
  border-radius: var(--cl-radius-sm) !important;
  background: var(--cl-green) !important;
  box-shadow: none !important;
  color: #fff !important;
  font-family: inherit !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 19px !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .charge-btn.cl-source-alimtalk-charge:hover,
body.cl-dashboard-redesign-page .cl-dashboard-home .charge-btn.cl-source-alimtalk-charge:focus-visible {
  background: var(--cl-green-hover) !important;
  border-color: transparent !important;
  color: #fff !important;
  outline: 0 !important;
  text-decoration: none !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .charge-settings.cl-source-alimtalk-settings {
  display: inline-flex !important;
  width: 18px !important;
  height: 18px !important;
  align-items: center !important;
  justify-content: center !important;
  color: var(--cl-green-text) !important;
  text-decoration: none !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .charge-settings.cl-source-alimtalk-settings:hover,
body.cl-dashboard-redesign-page .cl-dashboard-home .charge-settings.cl-source-alimtalk-settings:focus-visible {
  color: var(--cl-green-text) !important;
  outline: 0 !important;
  text-decoration: none !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .charge-settings.cl-source-alimtalk-settings svg {
  display: block !important;
  width: 18px !important;
  height: 18px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

@media (max-width: 640px) {
  body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel {
    height: 560px !important;
    min-height: 560px !important;
    padding: 20px 16px !important;
  }

  .cl-source-notification-tabs button strong {
    font-size: 16px;
  }

  .cl-source-notification-tabs button span {
    font-size: 11px;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .site-space.cl-home-space-panel {
    height: auto;
    min-height: 0;
  }

  .cl-source-gauge-grid {
    gap: 20px;
  }

  .cl-source-gauge-wrap,
  body.cl-dashboard-redesign-page .cl-dashboard-home .site-capacity,
  body.cl-dashboard-redesign-page .cl-dashboard-home .site-traffic {
    margin-right: auto !important;
    margin-left: auto !important;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .main-kakaotalk-wrap .main-pc-wrap.cl-source-alimtalk-panel.charge-bar-inline {
    height: auto !important;
    min-height: 79px !important;
    gap: 10px !important;
    padding: 16px !important;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .charge-left {
    flex: 1 1 auto !important;
    gap: 8px !important;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .charge-input {
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .charge-right {
    gap: 10px !important;
  }
}

/* Source dashboard Alimtalk charge modal */
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-s-talkPayCharge) {
  position: fixed !important;
  inset: 0 !important;
  z-index: 1000002 !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  width: 100vw !important;
  height: 100vh !important;
  padding: 24px 16px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  background: rgba(0, 0, 0, .45) !important;
}

/* 충전창이 열려 있을 때만 KCP SDK의 인라인 z-index(9999)보다 우선한다. */
body.cl-dashboard-redesign-page:has(.modal.in .modal-dialog.cl-s-talkPayCharge) #NAX_BLOCK {
  z-index: 1000003 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-s-talkPayCharge) + .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-s-talkPayCharge) + .modal-backdrop.fade,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-s-talkPayCharge) + .modal-backdrop.in,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-s-talkPayCharge) + .modal-backdrop.fade.in,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-s-talkPayCharge) .modal-backdrop.fade.in {
  display: none !important;
  opacity: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default:has(.modal-dialog.cl-s-talkPayCharge) {
  position: static !important;
  inset: auto !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
  width: 100% !important;
  height: auto !important;
  min-height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-talkPayCharge {
  width: min(560px, calc(100vw - 32px)) !important;
  max-width: min(560px, calc(100vw - 32px)) !important;
  margin: 0 auto !important;
  padding: 0 !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-talkPayCharge .modal-content {
  position: relative !important;
  width: 100% !important;
  max-height: none !important;
  padding: 36px 40px 30px !important;
  overflow: visible !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 14px !important;
  box-shadow: 0 24px 64px rgba(0, 0, 0, .28) !important;
  color: var(--cl-text) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-talkPayCharge .modal-body {
  width: 100% !important;
  max-width: none !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-talkPayCharge .modal-body > .cl-source-talk-charge-form {
  width: 100% !important;
  max-width: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-talkPayCharge .modal-title {
  margin: 0 40px 28px !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-size: 22px !important;
  font-weight: 800 !important;
  line-height: 30px !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-talkPayCharge .modal-content > .close.close-button-dialog {
  position: absolute !important;
  top: 20px !important;
  right: 22px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub) !important;
  font-size: 0 !important;
  line-height: 1 !important;
  opacity: 1 !important;
  text-shadow: none !important;
  transition: color .15s, background-color .15s, transform .18s cubic-bezier(.34, 1.56, .64, 1) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-talkPayCharge .modal-content > .close.close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-talkPayCharge .modal-content > .close.close-button-dialog:focus {
  background: #f1f2f5 !important;
  color: var(--cl-text) !important;
  outline: 0 !important;
  transform: rotate(90deg) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-talkPayCharge .modal-content > .close.close-button-dialog svg {
  display: block !important;
  width: 9px !important;
  height: 9px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default:has(.modal-dialog.cl-s-talkPayCharge) > .cl-mobile-btn.close {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-talk-charge-form,
body.cl-dashboard-redesign-page .cl-source-talk-charge-form *,
body.cl-dashboard-redesign-page .cl-source-talk-charge-form *::before,
body.cl-dashboard-redesign-page .cl-source-talk-charge-form *::after {
  box-sizing: border-box;
}

body.cl-dashboard-redesign-page .cl-source-talk-charge-form {
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-talk-charge-grid {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  width: 100% !important;
  margin: 0 0 14px !important;
}

body.cl-dashboard-redesign-page .cl-s-talkPayCharge .cl-source-talk-charge-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100% !important;
  min-height: 72px !important;
  height: auto !important;
  margin: 0 !important;
  padding: 15px 18px !important;
  background: #fff !important;
  border: 1.5px solid var(--cl-border) !important;
  border-radius: 12px !important;
  color: var(--cl-text) !important;
  cursor: pointer !important;
  float: none !important;
  line-height: 1.35 !important;
  transition: border-color .12s, background-color .12s !important;
}

body.cl-dashboard-redesign-page .cl-s-talkPayCharge .cl-source-talk-charge-row:hover {
  border-color: #b7e7c9 !important;
}

body.cl-dashboard-redesign-page .cl-s-talkPayCharge .cl-source-talk-charge-row.active,
body.cl-dashboard-redesign-page .cl-s-talkPayCharge .cl-source-talk-charge-row.sel,
body.cl-dashboard-redesign-page .cl-s-talkPayCharge .cl-source-talk-charge-row:has(input[name="good_mny"]:checked) {
  background: #f1fbf5 !important;
  border-color: var(--cl-green) !important;
}

body.cl-dashboard-redesign-page .cl-s-talkPayCharge .cl-source-talk-charge-option {
  display: flex !important;
  align-items: center !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  line-height: 18px !important;
}

body.cl-dashboard-redesign-page .cl-s-talkPayCharge .cl-source-talk-charge-option label {
  position: static !important;
  top: auto !important;
  left: auto !important;
  display: flex !important;
  align-items: center !important;
  gap: 13px !important;
  margin: 0 !important;
  min-height: 18px !important;
  padding: 0 !important;
  line-height: 18px !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-s-talkPayCharge .cl-source-talk-charge-radio-wrap {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 18px !important;
  height: 18px !important;
  flex: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  line-height: 0 !important;
  vertical-align: middle !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-s-talkPayCharge .cl-source-talk-charge-radio-wrap input {
  position: absolute !important;
  inset: 0 !important;
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
  opacity: 0 !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .cl-s-talkPayCharge .cl-source-talk-charge-radio {
  position: relative !important;
  display: block !important;
  box-sizing: border-box !important;
  flex: 0 0 18px !important;
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 2px solid var(--cl-border) !important;
  border-radius: 50% !important;
  background: #fff !important;
  line-height: 0 !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-s-talkPayCharge .cl-source-talk-charge-row.active .cl-source-talk-charge-radio,
body.cl-dashboard-redesign-page .cl-s-talkPayCharge .cl-source-talk-charge-row.sel .cl-source-talk-charge-radio,
body.cl-dashboard-redesign-page .cl-s-talkPayCharge .cl-source-talk-charge-row:has(input[name="good_mny"]:checked) .cl-source-talk-charge-radio {
  border-color: var(--cl-green) !important;
}

body.cl-dashboard-redesign-page .cl-s-talkPayCharge .cl-source-talk-charge-row.active .cl-source-talk-charge-radio::after,
body.cl-dashboard-redesign-page .cl-s-talkPayCharge .cl-source-talk-charge-row.sel .cl-source-talk-charge-radio::after,
body.cl-dashboard-redesign-page .cl-s-talkPayCharge .cl-source-talk-charge-row:has(input[name="good_mny"]:checked) .cl-source-talk-charge-radio::after {
  content: "" !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  display: block !important;
  width: 9px !important;
  height: 9px !important;
  margin: 0 !important;
  border-radius: 50% !important;
  background: var(--cl-green) !important;
  transform: translate(-50%, -50%) !important;
}

body.cl-dashboard-redesign-page .cl-s-talkPayCharge .cl-source-talk-charge-amount {
  color: var(--cl-text) !important;
  font-size: 17px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-s-talkPayCharge .cl-source-talk-charge-info {
  display: block !important;
  margin-left: auto !important;
  color: var(--cl-text-sub) !important;
  float: none !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
  text-align: right !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-s-talkPayCharge .cl-source-talk-charge-type {
  display: block !important;
  color: var(--cl-text-sub) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
}

body.cl-dashboard-redesign-page .cl-s-talkPayCharge .cl-source-talk-charge-count {
  display: block !important;
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
}

body.cl-dashboard-redesign-page .cl-s-talkPayCharge .cl-source-talk-charge-count b,
body.cl-dashboard-redesign-page .cl-s-talkPayCharge .cl-source-talk-charge-count strong,
body.cl-dashboard-redesign-page .cl-s-talkPayCharge .cl-source-talk-charge-count .charge-extra-count {
  color: var(--cl-green-text) !important;
  font-weight: 800 !important;
}

body.cl-dashboard-redesign-page .cl-s-talkPayCharge .cl-source-talk-charge-note {
  display: block !important;
  width: 100% !important;
  margin: 0 0 20px !important;
  color: var(--cl-danger) !important;
  float: none !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  line-height: 1.95 !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-s-talkPayCharge .cl-source-talk-charge-note span {
  display: block !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .cl-s-talkPayCharge .cl-source-talk-charge-note svg {
  display: inline-block !important;
  width: 12px !important;
  height: 12px !important;
  margin: 0 4px 0 0 !important;
  vertical-align: -2px !important;
}

body.cl-dashboard-redesign-page .cl-s-talkPayCharge .cl-common-form-wrap {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  width: 100% !important;
  margin: 0 0 14px !important;
  padding: 0 !important;
  border: 0 !important;
  float: none !important;
}

body.cl-dashboard-redesign-page .cl-s-talkPayCharge .cl-common-form-group {
  flex: 1 1 auto !important;
  width: auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .cl-s-talkPayCharge .pay-charge-field-title {
  flex: 0 0 120px !important;
  width: 120px !important;
  margin: 0 !important;
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  line-height: 20px !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-s-talkPayCharge .plus-payCharge-input {
  display: block !important;
  width: 100% !important;
  height: 40px !important;
  margin: 0 !important;
  padding: 0 13px !important;
  background: #fff !important;
  border: 1px solid #dde2e8 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  line-height: 38px !important;
}

body.cl-dashboard-redesign-page .cl-s-talkPayCharge .plus-payCharge-input::placeholder {
  color: #b0b6bf !important;
}

body.cl-dashboard-redesign-page .cl-s-talkPayCharge .plus-payCharge-input:hover {
  border-color: #c9d1db !important;
}

body.cl-dashboard-redesign-page .cl-s-talkPayCharge .plus-payCharge-input:focus {
  border-color: var(--cl-green) !important;
  outline: 0 !important;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .12) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-talkPayCharge .modal-content > .modal-footer,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-talkPayCharge .modal-footer {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  gap: 14px !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 22px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-talkPayCharge .modal-footer > button.btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
  align-self: stretch !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 46px !important;
  min-height: 46px !important;
  margin: 0 !important;
  padding: 0 18px !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-talkPayCharge .modal-footer > button.ok-button-dialog,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-talkPayCharge .modal-footer > button.ok-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-talkPayCharge .modal-footer > button.ok-button-dialog:focus {
  background: var(--cl-green) !important;
  border: 1px solid var(--cl-green) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-talkPayCharge .modal-footer > button.ok-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-talkPayCharge .modal-footer > button.ok-button-dialog:focus {
  background: var(--cl-green-hover) !important;
  border-color: var(--cl-green-hover) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-talkPayCharge .modal-footer > button.close-button-dialog,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-talkPayCharge .modal-footer > button.close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-talkPayCharge .modal-footer > button.close-button-dialog:focus {
  background: transparent !important;
  border: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-talkPayCharge .modal-footer > button.close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-talkPayCharge .modal-footer > button.close-button-dialog:focus {
  background: #eaf9f1 !important;
  color: var(--cl-green-text) !important;
}

@media (max-width: 640px) {
  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-s-talkPayCharge) {
    padding: 14px 12px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-talkPayCharge {
    width: calc(100vw - 24px) !important;
    max-width: calc(100vw - 24px) !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-talkPayCharge .modal-content {
    max-height: none !important;
    overflow: visible !important;
    padding: 32px 20px 24px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-talkPayCharge .modal-title {
    margin-bottom: 24px !important;
    font-size: 20px !important;
    line-height: 28px !important;
  }

  body.cl-dashboard-redesign-page .cl-s-talkPayCharge .cl-source-talk-charge-row {
    min-height: 68px !important;
    padding: 13px 14px !important;
  }

  body.cl-dashboard-redesign-page .cl-s-talkPayCharge .cl-source-talk-charge-option label {
    gap: 10px !important;
  }

  body.cl-dashboard-redesign-page .cl-s-talkPayCharge .cl-source-talk-charge-amount {
    font-size: 16px !important;
  }

  body.cl-dashboard-redesign-page .cl-s-talkPayCharge .cl-source-talk-charge-info {
    white-space: normal !important;
  }

  body.cl-dashboard-redesign-page .cl-s-talkPayCharge .cl-common-form-wrap {
    align-items: flex-start !important;
    flex-direction: column !important;
    gap: 8px !important;
  }

  body.cl-dashboard-redesign-page .cl-s-talkPayCharge .pay-charge-field-title {
    flex: none !important;
    width: 100% !important;
  }

  body.cl-dashboard-redesign-page .cl-s-talkPayCharge .cl-common-form-group {
    width: 100% !important;
  }
}

/* Source notification talk send history modal */
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-source-call-history-modal) {
  position: fixed !important;
  inset: 0 !important;
  z-index: 1000002 !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  width: 100vw !important;
  height: 100vh !important;
  padding: 40px 16px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  background: rgba(20, 24, 32, .45) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-source-call-history-modal) + .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-source-call-history-modal) + .modal-backdrop.fade,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-source-call-history-modal) + .modal-backdrop.in,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-source-call-history-modal) + .modal-backdrop.fade.in,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-source-call-history-modal) .modal-backdrop.fade.in {
  display: none !important;
  opacity: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default:has(.modal-dialog.cl-source-call-history-modal) {
  position: static !important;
  inset: auto !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  margin: auto !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default:has(.modal-dialog.cl-source-call-history-modal) > .cl-mobile-btn.close {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-call-history-modal {
  width: min(1040px, calc(100vw - 32px)) !important;
  max-width: min(1040px, calc(100vw - 32px)) !important;
  height: auto !important;
  max-height: none !important;
  margin: 0 auto !important;
  padding: 0 !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-call-history-modal .modal-content {
  position: relative !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  padding: 36px 40px 30px !important;
  overflow: visible !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 14px !important;
  box-shadow: 0 24px 64px rgba(0, 0, 0, .28) !important;
  color: var(--cl-text) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-call-history-modal .modal-body {
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-call-history-modal .modal-title {
  margin: 2px 44px 24px !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-size: 21px !important;
  font-weight: 800 !important;
  line-height: 29px !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-call-history-modal .modal-content > .close.close-button-dialog {
  position: absolute !important;
  top: 20px !important;
  right: 22px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub) !important;
  font-size: 0 !important;
  line-height: 1 !important;
  opacity: 1 !important;
  text-shadow: none !important;
  transition: color .15s, background-color .15s, transform .18s cubic-bezier(.34, 1.56, .64, 1) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-call-history-modal .modal-content > .close.close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-call-history-modal .modal-content > .close.close-button-dialog:focus {
  background: #f1f2f5 !important;
  color: var(--cl-text) !important;
  outline: 0 !important;
  transform: rotate(90deg) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-call-history-modal .modal-content > .close.close-button-dialog svg {
  display: block !important;
  width: 10px !important;
  height: 10px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal,
body.cl-dashboard-redesign-page .cl-source-call-history-modal *,
body.cl-dashboard-redesign-page .cl-source-call-history-modal *::before,
body.cl-dashboard-redesign-page .cl-source-call-history-modal *::after {
  box-sizing: border-box;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-filter {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: 8px !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 0 18px !important;
  padding: 0 !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-date {
  display: inline-flex !important;
  align-items: center !important;
  flex: 0 0 auto !important;
  width: auto !important;
  max-width: none !important;
  height: 38px !important;
  margin: 0 !important;
  padding: 0 !important;
  gap: 8px !important;
  float: none !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-range {
  display: inline-flex !important;
  align-items: center !important;
  flex: 0 0 auto !important;
  width: auto !important;
  height: 38px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  float: none !important;
  gap: 6px !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-vcal-wrap {
  position: relative !important;
  z-index: 40 !important;
  display: inline-flex !important;
  align-items: center !important;
  flex: 0 0 auto !important;
  width: auto !important;
  height: 38px !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-period.vperiod {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  min-width: 210px !important;
  min-height: 34px !important;
  height: auto !important;
  margin: 0 !important;
  padding: 7px 12px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text) !important;
  font-family: inherit !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  cursor: pointer !important;
  transition: border-color .12s, background .12s, box-shadow .12s !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-period.vperiod:hover {
  background: #fafbfc !important;
  border-color: #d5d9e0 !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-period.vperiod:focus-visible {
  border-color: var(--cl-green) !important;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .18) !important;
  outline: none !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-period.vperiod > svg {
  flex: none !important;
  width: 14px !important;
  height: 14px !important;
  color: var(--cl-text-muted) !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-period.vperiod .vperiod-dash {
  color: var(--cl-text-muted) !important;
  font-weight: 500 !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-range .input-group {
  position: relative !important;
  display: block !important;
  flex: 0 0 114px !important;
  width: 114px !important;
  max-width: 114px !important;
  height: 38px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  float: none !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-range .input-group > input[readonly] {
  position: relative !important;
  z-index: 2 !important;
  display: block !important;
  width: 100% !important;
  height: 36px !important;
  margin: 0 !important;
  padding: 0 30px 0 12px !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: var(--cl-text) !important;
  font-size: 13px !important;
  line-height: 36px !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-range .input-group .site-visit-datetext {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-range .input-group .site-visit-datetext + svg {
  position: absolute !important;
  z-index: 1 !important;
  top: 50% !important;
  right: 12px !important;
  display: block !important;
  width: 14px !important;
  height: 16px !important;
  margin: 0 !important;
  fill: var(--cl-text-sub) !important;
  transform: translateY(-50%) !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-range .input-group + .fa {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 8px !important;
  height: 38px !important;
  margin: 0 !important;
  background: transparent !important;
  color: var(--cl-text-muted) !important;
  float: none !important;
  font-size: 0 !important;
  line-height: 1 !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-range .input-group + .fa::before {
  content: "-" !important;
  display: block !important;
  color: var(--cl-text-muted) !important;
  font-family: inherit !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-vcal-wrap .vcal {
  position: absolute !important;
  top: calc(100% + 8px) !important;
  left: 0 !important;
  right: auto !important;
  z-index: 500 !important;
  display: none !important;
  width: 288px !important;
  margin: 0 !important;
  padding: 14px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 12px !important;
  box-shadow: 0 12px 30px rgba(20, 24, 32, .16) !important;
  color: var(--cl-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-vcal-wrap .vcal.open {
  display: block !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-vcal-wrap .vcal-presets {
  display: flex !important;
  gap: 6px !important;
  margin: 0 0 12px !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-vcal-wrap .vcal-preset {
  flex: 1 1 0 !important;
  min-width: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 6px 0 !important;
  background: #f4f5f9 !important;
  border: 0 !important;
  border-radius: 6px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub) !important;
  font-family: inherit !important;
  font-size: 11.5px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  text-align: center !important;
  cursor: pointer !important;
  transition: background .12s, color .12s !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-vcal-wrap .vcal-preset:hover {
  background: #e4f7ec !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-vcal-wrap .vcal-preset.active {
  background: #03C75A !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-vcal-wrap .vcal-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin: 0 0 8px !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-vcal-wrap .vcal-title {
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-vcal-wrap .vcal-nav {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 26px !important;
  height: 26px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 6px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub) !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-vcal-wrap .vcal-nav:hover {
  background: #f4f5f9 !important;
  color: var(--cl-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-vcal-wrap .vcal-nav svg {
  width: 16px !important;
  height: 16px !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-vcal-wrap .vcal-grid {
  display: grid !important;
  grid-template-columns: repeat(7, 1fr) !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-vcal-wrap .vcal-wd {
  padding: 4px 0 6px !important;
  color: var(--cl-text-muted) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-vcal-wrap .vcal-wd.sun {
  color: #e5484d !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-vcal-wrap .vcal-wd.sat {
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-vcal-wrap .vcal-day {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 7px 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: var(--cl-text) !important;
  font-family: inherit !important;
  font-size: 12.5px !important;
  font-weight: 400 !important;
  line-height: 1.2 !important;
  text-align: center !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-vcal-wrap .vcal-day.other {
  color: var(--cl-text-muted) !important;
  opacity: .45 !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-vcal-wrap .vcal-day:hover:not(.sel) {
  background: #f1f2f5 !important;
  border-radius: 6px !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-vcal-wrap .vcal-day.in-range {
  background: #e4f7ec !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-vcal-wrap .vcal-day.in-range:hover {
  background: #d6f0e0 !important;
  border-radius: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-vcal-wrap .vcal-day.sel {
  z-index: 1 !important;
  background: var(--cl-green) !important;
  border-radius: 6px !important;
  color: #fff !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-vcal-wrap .vcal-day.range-start {
  border-radius: 6px 0 0 6px !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-vcal-wrap .vcal-day.range-end {
  border-radius: 0 6px 6px 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-vcal-wrap .vcal-day.today::after {
  position: absolute !important;
  bottom: 3px !important;
  left: 50% !important;
  width: 4px !important;
  height: 4px !important;
  background: var(--cl-green) !important;
  border-radius: 50% !important;
  content: "" !important;
  transform: translateX(-50%) !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-vcal-wrap .vcal-day.sel.today::after {
  background: #fff !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-select {
  --cl-call-history-select-width: 92px;
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  flex: 0 0 var(--cl-call-history-select-width) !important;
  box-sizing: border-box !important;
  width: var(--cl-call-history-select-width) !important;
  min-width: 0 !important;
  max-width: var(--cl-call-history-select-width) !important;
  height: 38px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  float: none !important;
  transition: background-color .12s, border-color .12s, box-shadow .12s !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-select:hover,
body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-select:focus-within,
body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-select:has(.bootstrap-select.open) {
  background: #fafbfc !important;
  border-color: #d5d9e0 !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-select-phone {
  --cl-call-history-select-width: 148px;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-select-type {
  --cl-call-history-select-width: 86px;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-select-content {
  --cl-call-history-select-width: 92px;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-select-status {
  --cl-call-history-select-width: 92px;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-select > .bootstrap-select.dropdown,
body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-select .bootstrap-select.dropdown,
body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-select > .bootstrap-select .btn.btn-default,
body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-select .bootstrap-select .btn.btn-default {
  box-sizing: border-box !important;
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 36px !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-select .bootstrap-select .btn.btn-default {
  min-height: 36px !important;
  padding: 0 30px 0 12px !important;
  overflow: hidden !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: var(--cl-text) !important;
  font-family: inherit !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 36px !important;
  text-align: left !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-select .bootstrap-select.open .btn.btn-default,
body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-select .bootstrap-select .btn.btn-default:hover,
body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-select .bootstrap-select .btn.btn-default:focus {
  border-color: transparent !important;
  background: transparent !important;
  color: var(--cl-text) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-select .bootstrap-select .filter-option {
  position: absolute !important;
  top: 0 !important;
  right: 30px !important;
  left: 12px !important;
  float: none !important;
  display: block !important;
  width: auto !important;
  max-width: none !important;
  height: 36px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  color: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  line-height: 36px !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-select .bootstrap-select .filter-option-inner,
body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-select .bootstrap-select .filter-option-inner-inner {
  display: block !important;
  width: 100% !important;
  height: 36px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  color: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  line-height: 36px !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-select > svg {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-select::after {
  position: absolute !important;
  top: 50% !important;
  right: 8px !important;
  width: 14px !important;
  height: 14px !important;
  margin-top: -7px !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238A8F98' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: 14px !important;
  content: "" !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-select .bootstrap-select .caret {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-select .dropdown-menu {
  top: calc(100% + 4px) !important;
  min-width: max(100%, 150px) !important;
  margin-top: 4px !important;
  padding: 4px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  box-shadow: 0 8px 24px rgba(20, 24, 32, .14) !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-select .dropdown-menu.inner {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-select .dropdown-menu li a {
  min-height: 0 !important;
  padding: 8px 12px !important;
  border-radius: 6px !important;
  color: var(--cl-text) !important;
  font-size: 12.5px !important;
  font-weight: 400 !important;
  line-height: 18px !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-select .dropdown-menu li a:hover,
body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-select .dropdown-menu li a:focus,
body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-select .dropdown-menu li.selected a,
body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-select .dropdown-menu li.active a {
  background: #e4f7ec !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-select .dropdown-menu li.selected a,
body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-select .dropdown-menu li.active a {
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-keyword-wrap {
  display: block !important;
  flex: 1 1 0 !important;
  width: auto !important;
  min-width: 92px !important;
  max-width: none !important;
  height: 38px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  float: none !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-keyword-group {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  height: 38px !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-keyword {
  display: block !important;
  width: 100% !important;
  height: 38px !important;
  margin: 0 !important;
  padding: 0 12px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text) !important;
  font-family: inherit !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 36px !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-keyword::placeholder {
  color: var(--cl-text-muted) !important;
  opacity: 1 !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-keyword:focus {
  border-color: var(--cl-green) !important;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .12) !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-submit {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 78px !important;
  max-width: none !important;
  height: 38px !important;
  margin: 0 !important;
  padding: 0 24px !important;
  background: var(--cl-green) !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: #fff !important;
  font-family: inherit !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  cursor: pointer !important;
  float: none !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-submit:hover,
body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-submit:focus {
  background: var(--cl-green-hover) !important;
  color: #fff !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-head {
  display: grid !important;
  grid-template-columns: 70px 148px 130px 130px 84px minmax(120px, 1fr) 96px !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: #fafbfc !important;
  border-top: 1px solid var(--cl-border) !important;
  color: var(--cl-text-sub) !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  line-height: 18px !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-head > div {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  height: auto !important;
  min-height: 46px !important;
  padding: 14px 10px !important;
  border-bottom: 1px solid var(--cl-border) !important;
  color: var(--cl-text-sub) !important;
  float: none !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  line-height: 18px !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-scroll {
  width: 100% !important;
  height: auto !important;
  min-height: 260px !important;
  max-height: 520px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  color: var(--cl-text) !important;
  font-size: 13px !important;
  border: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-scroll::-webkit-scrollbar {
  width: 8px !important;
  height: 8px !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-scroll::-webkit-scrollbar-track {
  background: #f3f4f6 !important;
  border-radius: 8px !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-scroll::-webkit-scrollbar-thumb {
  background: #d6dbe2 !important;
  border-radius: 8px !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-row {
  display: grid !important;
  grid-template-columns: 70px 148px 130px 130px 84px minmax(120px, 1fr) 96px !important;
  width: 100% !important;
  height: auto !important;
  min-height: 50px !important;
  margin: 0 !important;
  overflow: visible !important;
  background: #fff !important;
  border-bottom: 1px solid #f0f1f3 !important;
  color: var(--cl-text) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 18px !important;
  text-align: center !important;
  transition: background-color .14s ease !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-row:hover {
  background: #f7f8fa !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-row > div {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  height: auto !important;
  min-height: 50px !important;
  padding: 15px 10px !important;
  overflow: hidden !important;
  color: var(--cl-text) !important;
  float: none !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 18px !important;
  text-align: center !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-empty {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: auto !important;
  min-height: 220px !important;
  margin: 0 !important;
  padding: 24px !important;
  color: var(--cl-text-muted) !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  line-height: 20px !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-pager {
  width: 100% !important;
  margin: 18px 0 0 !important;
  padding: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-pager > ul {
  position: static !important;
  left: auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-pager > ul > li {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 8px !important;
  background: transparent !important;
  border: 1px solid transparent !important;
  border-radius: 6px !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-pager > ul > li:hover {
  background: #f3f5f7 !important;
  color: var(--cl-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-pager > ul > li.active {
  background: #f1fbf5 !important;
  border-color: var(--cl-green) !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-pager > ul > li svg {
  display: block !important;
  width: 8px !important;
  height: 10px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .bootstrap-datetimepicker-widget {
  margin-top: 4px !important;
  padding: 10px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 10px !important;
  box-shadow: 0 14px 32px rgba(21, 31, 46, .16) !important;
  color: var(--cl-text) !important;
  font-family: inherit !important;
  font-size: 12px !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .bootstrap-datetimepicker-widget table td.active,
body.cl-dashboard-redesign-page .cl-source-call-history-modal .bootstrap-datetimepicker-widget table td.active:hover {
  background-color: var(--cl-green) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .cl-source-call-history-modal .bootstrap-datetimepicker-widget table thead th:hover,
body.cl-dashboard-redesign-page .cl-source-call-history-modal .bootstrap-datetimepicker-widget table td.day:hover,
body.cl-dashboard-redesign-page .cl-source-call-history-modal .bootstrap-datetimepicker-widget table span:hover {
  background: #f3f5f7 !important;
  color: var(--cl-text) !important;
}

@media (max-width: 960px) {
  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-source-call-history-modal) {
    padding: 24px 12px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-call-history-modal {
    width: calc(100vw - 24px) !important;
    max-width: calc(100vw - 24px) !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-call-history-modal .modal-content {
    padding: 32px 20px 24px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-filter {
    flex-wrap: wrap !important;
  }

  body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-date,
  body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-range {
    width: 100% !important;
    height: auto !important;
    flex-wrap: wrap !important;
  }

  body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-vcal-wrap,
  body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-period.vperiod {
    width: 100% !important;
  }

  body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-vcal-wrap .vcal {
    width: min(288px, calc(100vw - 56px)) !important;
  }

  body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-range .input-group {
    flex: 1 1 0 !important;
    width: auto !important;
    max-width: none !important;
  }

  body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-select,
  body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-select-phone,
  body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-select-type,
  body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-select-content,
  body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-select-status {
    flex: 1 1 calc(50% - 4px) !important;
    width: auto !important;
    max-width: none !important;
  }

  body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-keyword-wrap {
    flex: 1 1 calc(100% - 98px) !important;
  }

  body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-head,
  body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-row {
    grid-template-columns: 52px 128px 104px 112px 72px minmax(120px, 1fr) 82px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-scroll {
    overflow-x: auto !important;
  }

  body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-head,
  body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-row {
    min-width: 760px !important;
  }
}

@media (max-width: 640px) {
  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-source-call-history-modal) {
    padding: 14px 12px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-call-history-modal .modal-content {
    padding: 30px 16px 22px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-call-history-modal .modal-title {
    margin-bottom: 20px !important;
    font-size: 20px !important;
    line-height: 28px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-select,
  body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-select-phone,
  body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-select-type,
  body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-select-content,
  body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-select-status,
  body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-keyword-wrap,
  body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-submit {
    flex: 1 1 100% !important;
    width: 100% !important;
    max-width: none !important;
  }

  body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-submit {
    min-width: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-head {
    display: none !important;
  }

  body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-scroll {
    min-height: 220px !important;
    max-height: 56vh !important;
    overflow-x: hidden !important;
  }

  body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-row {
    display: none !important;
  }

  body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-mobile-row {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    min-height: 68px !important;
    padding: 14px 4px !important;
    border-bottom: 1px solid #f0f1f3 !important;
    color: var(--cl-text) !important;
    line-height: 1.4 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-mobile-row > div {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    height: auto !important;
    padding: 0 !important;
    float: none !important;
    gap: 12px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-mobile-row > div + div {
    margin-top: 8px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-mobile-row span {
    overflow: hidden !important;
    color: var(--cl-text) !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  body.cl-dashboard-redesign-page .cl-source-call-history-modal .cl-source-call-history-mobile-row .dateStatus {
    color: var(--cl-text-sub) !important;
    font-size: 12.5px !important;
    font-weight: 500 !important;
  }
}

/* Source notification talk charge history modal */
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-source-charge-history-modal) {
  position: fixed !important;
  inset: 0 !important;
  z-index: 1000002 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  width: 100vw !important;
  height: 100vh !important;
  padding: 40px 16px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  background: rgba(20, 24, 32, .45) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-source-charge-history-modal) + .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-source-charge-history-modal) + .modal-backdrop.fade,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-source-charge-history-modal) + .modal-backdrop.in,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-source-charge-history-modal) + .modal-backdrop.fade.in,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-source-charge-history-modal) .modal-backdrop.fade.in {
  display: none !important;
  opacity: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default:has(.modal-dialog.cl-source-charge-history-modal) {
  position: static !important;
  inset: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default:has(.modal-dialog.cl-source-charge-history-modal) > .cl-mobile-btn.close {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-charge-history-modal {
  width: min(820px, calc(100vw - 32px)) !important;
  max-width: min(820px, calc(100vw - 32px)) !important;
  height: auto !important;
  max-height: none !important;
  margin: 0 auto !important;
  padding: 0 !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-charge-history-modal .modal-content {
  position: relative !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  padding: 36px 40px 30px !important;
  overflow: visible !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 14px !important;
  box-shadow: 0 24px 64px rgba(0, 0, 0, .28) !important;
  color: var(--cl-text) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-charge-history-modal .modal-body {
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-charge-history-modal .modal-title {
  margin: 2px 44px 24px !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-size: 21px !important;
  font-weight: 800 !important;
  line-height: 29px !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-charge-history-modal .modal-content > .close.close-button-dialog {
  position: absolute !important;
  top: 20px !important;
  right: 22px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub) !important;
  font-size: 0 !important;
  line-height: 1 !important;
  opacity: 1 !important;
  text-shadow: none !important;
  transition: color .15s, background-color .15s, transform .18s cubic-bezier(.34, 1.56, .64, 1) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-charge-history-modal .modal-content > .close.close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-charge-history-modal .modal-content > .close.close-button-dialog:focus {
  background: #f1f2f5 !important;
  color: var(--cl-text) !important;
  outline: 0 !important;
  transform: rotate(90deg) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-charge-history-modal .modal-content > .close.close-button-dialog svg {
  display: block !important;
  width: 10px !important;
  height: 10px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .cl-source-charge-history-modal,
body.cl-dashboard-redesign-page .cl-source-charge-history-modal *,
body.cl-dashboard-redesign-page .cl-source-charge-history-modal *::before,
body.cl-dashboard-redesign-page .cl-source-charge-history-modal *::after {
  box-sizing: border-box;
}

body.cl-dashboard-redesign-page .cl-source-charge-history-modal .cl-source-charge-history-head,
body.cl-dashboard-redesign-page .cl-source-charge-history-modal .cl-source-charge-history-row {
  display: grid !important;
  grid-template-columns: 158px minmax(180px, 1fr) 132px 120px 96px !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  color: var(--cl-text) !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .cl-source-charge-history-modal.chargegabia .cl-source-charge-history-head,
body.cl-dashboard-redesign-page .cl-source-charge-history-modal.chargegabia .cl-source-charge-history-row {
  grid-template-columns: 170px minmax(220px, 1fr) 150px 130px !important;
}

body.cl-dashboard-redesign-page .cl-source-charge-history-modal .cl-source-charge-history-head {
  background: #fafbfc !important;
  border-top: 1px solid var(--cl-border) !important;
  color: var(--cl-text-sub) !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  line-height: 18px !important;
}

body.cl-dashboard-redesign-page .cl-source-charge-history-modal .cl-source-charge-history-head > div {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  height: auto !important;
  min-height: 46px !important;
  padding: 14px 10px !important;
  border-bottom: 1px solid var(--cl-border) !important;
  color: var(--cl-text-sub) !important;
  float: none !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  line-height: 18px !important;
}

body.cl-dashboard-redesign-page .cl-source-charge-history-modal .cl-source-charge-history-scroll {
  width: 100% !important;
  height: auto !important;
  min-height: 220px !important;
  max-height: 520px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  color: var(--cl-text) !important;
  border: 0 !important;
  scrollbar-width: thin;
  scrollbar-color: #d1d3d5 transparent;
}

body.cl-dashboard-redesign-page .cl-source-charge-history-modal .cl-source-charge-history-scroll::-webkit-scrollbar {
  width: 9px !important;
  height: 9px !important;
}

body.cl-dashboard-redesign-page .cl-source-charge-history-modal .cl-source-charge-history-scroll::-webkit-scrollbar-track {
  background: transparent !important;
}

body.cl-dashboard-redesign-page .cl-source-charge-history-modal .cl-source-charge-history-scroll::-webkit-scrollbar-thumb {
  background: #d1d3d5 !important;
  background-clip: padding-box !important;
  border: 2px solid transparent !important;
  border-radius: 6px !important;
}

body.cl-dashboard-redesign-page .cl-source-charge-history-modal .cl-source-charge-history-scroll::-webkit-scrollbar-button {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-charge-history-modal .cl-source-charge-history-row {
  min-height: 50px !important;
  background: #fff !important;
  border-bottom: 1px solid #f0f1f3 !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 18px !important;
  transition: background-color .14s ease !important;
}

body.cl-dashboard-redesign-page .cl-source-charge-history-modal .cl-source-charge-history-row:hover {
  background: #f7f8fa !important;
}

body.cl-dashboard-redesign-page .cl-source-charge-history-modal .cl-source-charge-history-row > div {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  height: auto !important;
  min-height: 50px !important;
  padding: 15px 10px !important;
  overflow: hidden !important;
  color: var(--cl-text) !important;
  float: none !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 18px !important;
  text-align: center !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-charge-history-modal .cl-source-charge-history-row > div:nth-child(2) {
  justify-content: flex-start !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-charge-history-modal .cl-source-charge-history-receipt,
body.cl-dashboard-redesign-page .cl-source-charge-history-modal .cl-source-charge-history-receipt a {
  color: var(--cl-green-text) !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .cl-source-charge-history-modal .cl-source-charge-history-receipt:hover,
body.cl-dashboard-redesign-page .cl-source-charge-history-modal .cl-source-charge-history-receipt a:hover {
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-charge-history-modal .cl-source-charge-history-mobile-row {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-charge-history-modal .cl-source-charge-history-empty {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: auto !important;
  min-height: 220px !important;
  margin: 0 !important;
  padding: 24px !important;
  color: var(--cl-text-muted) !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  line-height: 20px !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .cl-source-charge-history-modal .cl-source-charge-history-pager {
  width: 100% !important;
  margin: 18px 0 0 !important;
  padding: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .cl-source-charge-history-modal .cl-source-charge-history-pager > ul {
  position: static !important;
  left: auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-source-charge-history-modal .cl-source-charge-history-pager > ul > li {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 8px !important;
  background: transparent !important;
  border: 1px solid transparent !important;
  border-radius: 6px !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .cl-source-charge-history-modal .cl-source-charge-history-pager > ul > li:hover {
  background: #f3f5f7 !important;
  color: var(--cl-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-charge-history-modal .cl-source-charge-history-pager > ul > li.active {
  background: #f1fbf5 !important;
  border-color: var(--cl-green) !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-charge-history-modal .cl-source-charge-history-pager > ul > li svg {
  display: block !important;
  width: 8px !important;
  height: 10px !important;
  fill: currentColor !important;
}

@media (max-width: 960px) {
  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-source-charge-history-modal) {
    padding: 24px 12px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-charge-history-modal {
    width: calc(100vw - 24px) !important;
    max-width: calc(100vw - 24px) !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-charge-history-modal .modal-content {
    padding: 32px 20px 24px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-charge-history-modal .cl-source-charge-history-head,
  body.cl-dashboard-redesign-page .cl-source-charge-history-modal .cl-source-charge-history-row {
    grid-template-columns: 142px minmax(170px, 1fr) 120px 108px 84px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-charge-history-modal.chargegabia .cl-source-charge-history-head,
  body.cl-dashboard-redesign-page .cl-source-charge-history-modal.chargegabia .cl-source-charge-history-row {
    grid-template-columns: 150px minmax(190px, 1fr) 132px 112px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-charge-history-modal .cl-source-charge-history-scroll {
    overflow-x: auto !important;
  }

  body.cl-dashboard-redesign-page .cl-source-charge-history-modal .cl-source-charge-history-head,
  body.cl-dashboard-redesign-page .cl-source-charge-history-modal .cl-source-charge-history-row {
    min-width: 660px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-charge-history-modal.chargegabia .cl-source-charge-history-head,
  body.cl-dashboard-redesign-page .cl-source-charge-history-modal.chargegabia .cl-source-charge-history-row {
    min-width: 584px !important;
  }
}

@media (max-width: 640px) {
  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-source-charge-history-modal) {
    padding: 14px 12px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-charge-history-modal .modal-content {
    padding: 30px 16px 22px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-charge-history-modal .modal-title {
    margin-bottom: 20px !important;
    font-size: 20px !important;
    line-height: 28px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-charge-history-modal .cl-source-charge-history-head {
    display: none !important;
  }

  body.cl-dashboard-redesign-page .cl-source-charge-history-modal .cl-source-charge-history-scroll {
    min-height: 220px !important;
    max-height: 56vh !important;
    overflow-x: hidden !important;
  }

  body.cl-dashboard-redesign-page .cl-source-charge-history-modal .cl-source-charge-history-row {
    display: none !important;
  }

  body.cl-dashboard-redesign-page .cl-source-charge-history-modal .cl-source-charge-history-mobile-row {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    min-height: 68px !important;
    padding: 14px 4px !important;
    border-bottom: 1px solid #f0f1f3 !important;
    color: var(--cl-text) !important;
    line-height: 1.4 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-charge-history-modal .cl-source-charge-history-mobile-row > div {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    height: auto !important;
    padding: 0 !important;
    float: none !important;
    gap: 12px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-charge-history-modal .cl-source-charge-history-mobile-row > div + div {
    margin-top: 8px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-charge-history-modal .cl-source-charge-history-mobile-row span {
    float: none !important;
    overflow: hidden !important;
    padding-right: 0 !important;
    color: var(--cl-text) !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  body.cl-dashboard-redesign-page .cl-source-charge-history-modal .cl-source-charge-history-mobile-row .dateStatus {
    color: var(--cl-text-sub) !important;
    font-size: 12.5px !important;
    font-weight: 500 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-charge-history-modal .cl-source-charge-history-mobile-row .dateStatus:last-child,
  body.cl-dashboard-redesign-page .cl-source-charge-history-modal .cl-source-charge-history-mobile-row .dateStatus a {
    color: var(--cl-green-text) !important;
    font-weight: 700 !important;
    text-decoration: none !important;
  }
}

/* Source dashboard domain pages */
body.cl-dashboard-redesign-page .cl-dashboard-redesign.dashboard.cl-source-domain-shell > .container {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-redesign.dashboard.cl-source-domain-shell > .container > .multi-columns-row {
  margin-right: 0 !important;
  margin-left: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page {
  box-sizing: border-box;
  width: 100%;
  max-width: none;
  min-height: calc(100vh - var(--cl-source-topbar-h) - 88px);
  margin: 0;
  padding: 0;
  background: transparent;
  color: var(--cl-text);
}

body.cl-dashboard-redesign-page .sub.sub-page.sub-domain.cl-source-domain-page.domaincheck {
  width: auto !important;
  max-width: none !important;
  min-height: calc(100vh - var(--cl-source-topbar-h));
  margin-top: 0 !important;
  margin-right: var(--cl-source-app-gutter) !important;
  margin-left: calc(var(--cl-source-app-gutter) + var(--cl-source-sidebar-w)) !important;
  padding: 36px 32px 60px !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page *,
body.cl-dashboard-redesign-page .cl-source-domain-page *::before,
body.cl-dashboard-redesign-page .cl-source-domain-page *::after {
  box-sizing: border-box;
}

body.cl-dashboard-redesign-page .cl-source-domain-page > .container {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .row {
  margin-right: 0;
  margin-left: 0;
}

body.cl-dashboard-redesign-page .cl-source-domain-page [class*="col-"] {
  float: none;
  width: 100%;
  min-height: 0;
  padding-right: 0;
  padding-left: 0;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .breadcrumb {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 26px;
  margin: 0 0 9px !important;
  padding: 0 !important;
  background: transparent;
  border-radius: 0;
  color: var(--cl-text);
  font-size: 20px;
  font-weight: 700;
  line-height: 26px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .breadcrumb > li {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: inherit;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .breadcrumb > li + li::before {
  display: none;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .breadcrumb a {
  color: var(--cl-text);
  font-size: 20px;
  font-weight: 700;
  text-decoration: none;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .breadcrumb .current {
  color: var(--cl-text-sub);
  font-size: 20px;
  font-weight: 700;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .breadcrumb .sep {
  color: var(--cl-text-muted);
  font-size: 23px;
  font-weight: 400;
  line-height: 1;
}

.cl-source-domain-subtitle {
  margin: 0 0 16px;
  color: var(--cl-text-sub);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.5;
}

.cl-source-domain-layout {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 24px;
  width: 100%;
  max-width: 1127px;
}

body.cl-dashboard-redesign-page .cl-source-domain-panel {
  flex: 1 1 760px;
  width: auto;
  max-width: 760px;
  min-width: 0;
  margin: 0;
  padding: 0 !important;
  overflow: hidden;
  background: var(--cl-surface);
  border: 1px solid var(--cl-border);
  border-radius: var(--cl-radius-lg);
  box-shadow: var(--cl-shadow-panel);
}

.cl-source-domain-guide {
  flex: 0 0 343px;
  width: 343px;
  max-width: 343px;
  align-self: flex-start;
  height: auto;
  padding: 20px 20px 22px;
  background: var(--cl-surface);
  border: 1px solid var(--cl-border);
  border-radius: var(--cl-radius-lg);
  box-shadow: var(--cl-shadow-panel);
}

/* 외부 도메인 연결 영상 제작 완료 후 이 숨김 규칙을 제거하면 다시 노출됩니다. */
body.cl-dashboard-redesign-page .cl-source-domain-page .cl-source-domain-guide {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.add .cl-source-domain-panel {
  min-height: 486px;
}

.cl-source-dg-head {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-bottom: 14px;
  color: var(--cl-text);
  font-size: 15px;
  font-weight: 800;
  line-height: 1.35;
}

.cl-source-dg-head svg {
  flex: none;
  width: 18px;
  height: 18px;
  color: var(--cl-green);
}

.cl-source-dg-video {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: linear-gradient(135deg, #03C75A 0%, #00c4cb 52%, #2e8bf0 100%);
  border-radius: 10px;
  cursor: pointer;
}

.cl-source-dg-video::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(20, 24, 32, .14);
}

.cl-source-dg-chip {
  position: absolute;
  top: 8px;
  left: 8px;
  z-index: 2;
  padding: 2px 7px;
  background: rgba(20, 24, 32, .55);
  border-radius: 4px;
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .04em;
}

.cl-source-dg-thumb-center {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 11px;
  padding: 0 16px;
  text-align: center;
}

.cl-source-dg-thumb-name {
  color: #fff;
  font-size: 15px;
  font-weight: 800;
  line-height: 1.35;
  text-shadow: 0 1px 5px rgba(0, 0, 0, .28);
}

.cl-source-dg-play {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 54px;
  height: 54px;
  background: rgba(255, 255, 255, .94);
  border-radius: 50%;
  box-shadow: 0 4px 16px rgba(20, 24, 32, .28);
  line-height: 0;
  transition: transform .12s;
}

.cl-source-dg-video:hover .cl-source-dg-play {
  transform: scale(1.06);
}

.cl-source-dg-play svg {
  display: block;
  flex: none;
  width: 18px;
  height: 18px;
  margin: 0;
  fill: var(--cl-green);
}

.cl-source-dg-duration {
  position: absolute;
  right: 8px;
  bottom: 8px;
  z-index: 1;
  padding: 2px 7px;
  background: rgba(20, 24, 32, .66);
  border-radius: 4px;
  color: #fff;
  font-size: 11px;
  font-weight: 600;
}

.cl-source-dg-vtitle {
  margin: 14px 0 5px;
  color: var(--cl-text);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.35;
}

.cl-source-dg-desc {
  margin-bottom: 12px;
  color: var(--cl-text-sub);
  font-size: 12.5px;
  font-weight: 500;
  line-height: 1.6;
}

.cl-source-dg-clabel {
  margin-bottom: 4px;
  color: var(--cl-text-muted);
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: .03em;
}

.cl-source-dg-chapters {
  display: flex;
  flex-direction: column;
}

.cl-source-dg-chapter {
  appearance: none;
  display: flex;
  align-items: center;
  gap: 9px;
  width: 100%;
  min-height: 34px;
  padding: 8px;
  background: transparent;
  border: 0;
  border-radius: 8px;
  color: var(--cl-text);
  font-family: inherit;
  font-size: 12.5px;
  font-weight: 500;
  line-height: 1.35;
  text-align: left;
  cursor: pointer;
  transition: background .12s, color .12s, box-shadow .12s;
}

.cl-source-dg-chapter:hover,
.cl-source-dg-chapter.active {
  background: #e4f7ec;
  color: var(--cl-green-text);
}

.cl-source-dg-chapter:focus {
  outline: none;
}

.cl-source-dg-chapter:focus-visible {
  box-shadow: 0 0 0 2px rgba(3, 199, 90, .18);
}

.cl-source-dg-chapter.active {
  font-weight: 700;
}

.cl-source-dg-chapter .ch-num {
  flex: none;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  background: #e4f7ec;
  border-radius: 50%;
  color: var(--cl-green-text);
  font-size: 10.5px;
  font-weight: 800;
}

.cl-source-dg-chapter:hover .ch-num,
.cl-source-dg-chapter.active .ch-num {
  background: var(--cl-green);
  color: #fff;
}

.cl-source-dg-chapter .ch-name {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cl-source-dg-chapter .ch-time {
  flex: none;
  margin-left: auto;
  padding-left: 8px;
  color: var(--cl-text-muted);
  font-size: 11px;
  font-weight: 500;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .sub-title {
  min-height: 64px;
  margin: 0;
  padding: 20px 24px 16px;
  border-bottom: 1px solid var(--cl-line);
}

body.cl-dashboard-redesign-page .cl-source-domain-page .sub-title .text {
  margin: 0;
  padding: 0;
  color: var(--cl-text);
  font-size: 15px;
  font-weight: 700;
  line-height: 1.5;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .btn,
body.cl-dashboard-redesign-page .cl-source-domain-page button,
body.cl-dashboard-redesign-page .cl-source-domain-page a.btn {
  transform: none;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .go-add-domain,
body.cl-dashboard-redesign-page .cl-source-domain-page .cl-source-domain-buy-btn,
body.cl-dashboard-redesign-page .cl-source-domain-page .check-domain,
body.cl-dashboard-redesign-page .cl-source-domain-page .connect-mx-btn,
body.cl-dashboard-redesign-page .cl-source-domain-page .domain-btn .btn-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 96px;
  height: 34px;
  padding: 0 14px;
  background: var(--cl-green) !important;
  border: 1px solid var(--cl-green) !important;
  border-radius: 8px;
  box-shadow: none !important;
  color: #fff !important;
  font-size: 13px;
  font-weight: 700;
  line-height: 34px;
  text-decoration: none;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .go-add-domain:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page .cl-source-domain-buy-btn:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page .check-domain:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page .connect-mx-btn:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page .domain-btn .btn-primary:hover {
  background: var(--cl-green-hover) !important;
  border-color: var(--cl-green-hover) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .go-add-domain svg,
body.cl-dashboard-redesign-page .cl-source-domain-page .cl-source-domain-buy-btn svg {
  flex: none;
  width: 11px;
  height: 11px;
  margin-right: 7px;
  fill: currentColor;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.add .check-domain,
body.cl-dashboard-redesign-page .cl-source-domain-page.add .connect-mx-btn,
body.cl-dashboard-redesign-page .cl-source-domain-page.add .domain-btn .btn-primary {
  min-width: 122px;
  height: 47px;
  padding: 0 48px;
  font-size: 14.5px;
  line-height: 47px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .sub-content {
  width: 100%;
  margin: 0;
  padding: 64px 24px 72px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.add .sub-content {
  min-height: 335px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .connect-stap {
  position: relative;
  width: 100%;
  border-bottom: 0;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .connect-stap::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 2;
  height: 1px;
  background: var(--cl-border);
  pointer-events: none;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .connect-stap ul {
  display: flex;
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .connect-stap li {
  position: relative;
  display: flex;
  flex: 1 1 0;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: 68px;
  margin: 0;
  padding: 0 12px;
  background: #fff;
  border-right: 0;
  border-bottom: 0;
  color: var(--cl-text-sub);
  font-size: 15px;
  font-weight: 600;
  line-height: 1;
  z-index: 1;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .connect-stap li.last {
  border-right: 0;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .connect-stap li.active {
  background: #fff;
  color: var(--cl-green-text);
}

body.cl-dashboard-redesign-page .cl-source-domain-page .connect-stap li.active::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 3;
  height: 2px;
  background: var(--cl-green);
  pointer-events: none;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .connect-stap li.complete {
  color: var(--cl-green-text);
}

body.cl-dashboard-redesign-page .cl-source-domain-page .connect-stap .number {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border: 1px solid #dfe3e8;
  border-radius: 50%;
  background: #fff;
  color: var(--cl-text-muted);
  font-size: 13px;
  font-weight: 700;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .connect-stap li.active .number,
body.cl-dashboard-redesign-page .cl-source-domain-page .connect-stap li.complete .number {
  border-color: var(--cl-green);
  background: var(--cl-green);
  color: #fff;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .connect-stap span.complete {
  display: none;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .connect-stap span.complete svg {
  width: 18px;
  height: 18px;
  fill: currentColor;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .stap-title {
  margin: 0 0 28px;
  color: var(--cl-text);
  font-size: 19px;
  font-weight: 700;
  line-height: 1.45;
  text-align: center;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .stap-title b {
  font-weight: 800;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .domainconnect-input {
  max-width: 480px;
  margin: 0 auto;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .content-input-box {
  position: relative;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .check-domain-form {
  display: flex;
  align-items: center;
  width: 100%;
  height: 43px;
  overflow: hidden;
  background: #fff;
  border: 1px solid #dfe3e8;
  border-radius: 6px;
  transition: border-color .12s, box-shadow .12s;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .check-domain-form.focus {
  border-color: var(--cl-green);
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .1);
}

body.cl-dashboard-redesign-page .cl-source-domain-page .check-domain-form .input-group-addon {
  display: flex;
  align-items: center;
  width: auto;
  height: 100%;
  padding: 0 0 0 14px;
  background: transparent;
  border: 0;
  color: var(--cl-text-sub);
  font-size: 14px;
  font-weight: 400;
  line-height: 43px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .check-domain-form .form-control {
  flex: 1 1 auto;
  width: auto;
  height: 100%;
  min-width: 0;
  padding: 0 14px 0 3px;
  background: transparent;
  border: 0;
  box-shadow: none;
  color: var(--cl-text);
  font-size: 14px;
  font-weight: 400;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .working {
  position: absolute;
  top: 50%;
  right: 12px;
  display: none;
  transform: translateY(-50%);
  color: var(--cl-text-sub);
  font-size: 12px;
  font-weight: 600;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .working img {
  width: 14px;
  height: 14px;
  margin-right: 5px;
  vertical-align: -2px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .info-text,
body.cl-dashboard-redesign-page .cl-source-domain-page label.error {
  display: block;
  margin: 12px 0 0;
  color: var(--cl-text-sub);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.55;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .info-text svg,
body.cl-dashboard-redesign-page .cl-source-domain-page label.error svg {
  margin-right: 5px;
  fill: var(--cl-accent-blue);
  vertical-align: -2px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page label.error {
  color: var(--cl-danger);
}

body.cl-dashboard-redesign-page .cl-source-domain-page label.error svg {
  fill: var(--cl-danger);
}

body.cl-dashboard-redesign-page .cl-source-domain-page .info-text a {
  color: var(--cl-green-text);
  font-weight: 700;
  text-decoration: none;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .domain-btn {
  margin-top: 28px;
  text-align: center;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .domain-list {
  width: 100%;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .user-domain-wrap {
  margin: 0 0 16px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .list-item {
  margin: 0;
  padding: 0;
  list-style: none;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .list-item > li {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  margin: 0 0 12px;
  padding: 18px 20px;
  background: #fff;
  border: 1px solid var(--cl-line);
  border-radius: 10px;
  color: var(--cl-text);
}

body.cl-dashboard-redesign-page .cl-source-domain-page .list-item > li.none {
  justify-content: center;
  color: var(--cl-text-sub);
  font-size: 13px;
  font-weight: 600;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .list-title {
  flex: none;
  min-width: 112px;
  color: var(--cl-text);
  font-size: 14px;
  font-weight: 800;
  line-height: 1.45;
}

body.cl-dashboard-redesign-page .sub-domain.index.cl-source-domain-page .list-item > li > .list-title + div {
  flex: 1 1 auto !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .accordion-toggle,
body.cl-dashboard-redesign-page .cl-source-domain-page .creatorlink-domain p {
  margin: 0;
  color: var(--cl-text);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.5;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .zone-domain {
  word-break: break-all;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .ns-notice,
body.cl-dashboard-redesign-page .cl-source-domain-page .panel-collapse,
body.cl-dashboard-redesign-page .cl-source-domain-page .ns-info,
body.cl-dashboard-redesign-page .cl-source-domain-page .ns-info-box {
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .info-content {
  margin-top: 14px;
  padding: 14px;
  background: #fbfcfd;
  border: 1px solid var(--cl-line);
  border-radius: 8px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .zone-state {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 10px;
  color: var(--cl-text-sub);
  font-size: 13px;
  font-weight: 700;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .zone-state.active {
  color: var(--cl-green-text);
}

body.cl-dashboard-redesign-page .cl-source-domain-page .zone-state.wait {
  color: #f59331;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .ns-info-box ul,
body.cl-dashboard-redesign-page .cl-source-domain-page .domain_mail ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .ns-info-box li {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 0;
  border-top: 1px solid var(--cl-line);
  color: var(--cl-text-sub);
  font-size: 12.5px;
  line-height: 1.5;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .ns-info-box .display-ns,
body.cl-dashboard-redesign-page .cl-source-domain-page .ns-info-box .display-ip {
  display: flex;
  align-items: center;
  min-width: 0;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .ns-info-box .display-ns {
  flex: 1 1 58%;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .ns-info-box .display-ip {
  flex: 1 1 220px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .domain-nmsvinfo,
body.cl-dashboard-redesign-page .cl-source-domain-page .domain-ipinfo {
  flex: none;
  width: auto;
  min-width: 26px;
  margin: 0 8px 0 0;
  padding: 0;
  color: var(--cl-text-sub);
  font-weight: 600;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .domain-ipinfo {
  min-width: 16px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .name-server-text {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .ns-copy,
body.cl-dashboard-redesign-page .cl-source-domain-page .ns-disconnection-btn,
body.cl-dashboard-redesign-page .cl-source-domain-page .ns-record-btn,
body.cl-dashboard-redesign-page .cl-source-domain-page .mx-record-btn {
  display: inline-flex;
  flex: none;
  align-items: center;
  justify-content: center;
  height: 28px;
  margin-right: 6px;
  padding: 0 10px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 7px;
  color: var(--cl-text);
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  transition: background .12s, border-color .12s, color .12s;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .ns-copy:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page .ns-record-btn:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page .mx-record-btn:hover {
  background: var(--cl-green-soft);
  border-color: var(--cl-green-line);
  color: var(--cl-green-text);
}

body.cl-dashboard-redesign-page .cl-source-domain-page .ns-disconnection-btn:hover {
  background: #fdecee;
  border-color: #f6c9cc;
  color: var(--cl-danger);
}

body.cl-dashboard-redesign-page .cl-source-domain-page .domain_mail {
  display: flex;
  gap: 12px;
  margin: 16px 0 0;
  padding: 16px;
  background: #fbfcfd;
  border: 1px solid var(--cl-line);
  border-radius: 10px;
  color: var(--cl-text-sub);
}

body.cl-dashboard-redesign-page .cl-source-domain-page .domain_mail > svg {
  flex: none;
  width: 24px;
  height: 24px;
  fill: var(--cl-accent-blue);
}

body.cl-dashboard-redesign-page .cl-source-domain-page .domain_mtitle {
  margin: 0 0 6px;
  color: var(--cl-text);
  font-size: 14px;
  font-weight: 800;
  line-height: 1.4;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .domain_mail li {
  color: var(--cl-text-sub);
  font-size: 12.5px;
  line-height: 1.6;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .domain_mail li.danger {
  color: var(--cl-danger);
}

body.cl-dashboard-redesign-page .cl-source-domain-page .dom-namesv {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .nmSeverinfo-wrap,
body.cl-dashboard-redesign-page .cl-source-domain-page .nameserver-wrap,
body.cl-dashboard-redesign-page .cl-source-domain-page .ipaddress-wrap,
body.cl-dashboard-redesign-page .cl-source-domain-page .nmserver,
body.cl-dashboard-redesign-page .cl-source-domain-page .nmserip {
  display: flex;
  align-items: center;
  gap: 8px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .nameserver-wrap,
body.cl-dashboard-redesign-page .cl-source-domain-page .ipaddress-wrap {
  flex: 1 1 0;
  min-width: 0;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .namesv_numip {
  display: inline-block;
  min-width: 54px;
  color: var(--cl-text-sub);
  font-size: 12px;
  font-weight: 700;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .nmserver,
body.cl-dashboard-redesign-page .cl-source-domain-page .nmserip {
  flex: 1 1 auto;
  min-width: 0;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .nmserver .form-control,
body.cl-dashboard-redesign-page .cl-source-domain-page .nmserip .form-control {
  display: flex;
  align-items: center;
  flex: 1 1 auto;
  min-width: 0;
  height: 34px;
  padding: 0 10px;
  overflow: hidden;
  background: #f8f9fb;
  border: 1px solid var(--cl-border);
  border-radius: 7px;
  box-shadow: none;
  color: var(--cl-text);
  font-size: 12.5px;
  font-weight: 600;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .copy-btn,
body.cl-dashboard-redesign-page .cl-source-domain-page .popup-btn-wrap .btn-default {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 34px;
  padding: 0 12px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 7px;
  color: var(--cl-text);
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
}

body.cl-dashboard-redesign-page .cl-source-domain-page .copy-btn:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page .popup-btn-wrap .btn-default:hover {
  background: var(--cl-green-soft);
  border-color: var(--cl-green-line);
  color: var(--cl-green-text);
}

@media (max-width: 1024px) {
  body.cl-dashboard-redesign-page .sub.sub-page.sub-domain.cl-source-domain-page.domaincheck {
    padding: 24px 20px 48px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page {
    padding: 0;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-panel,
  .cl-source-domain-guide {
    flex: 1 1 100%;
    width: 100%;
    max-width: 100%;
  }
}

@media (max-width: 900px) {
  body.cl-dashboard-redesign-page .sub.sub-page.sub-domain.cl-source-domain-page.domaincheck {
    margin-right: 0 !important;
    margin-left: 0 !important;
  }
}

@media (max-width: 640px) {
  body.cl-dashboard-redesign-page .sub.sub-page.sub-domain.cl-source-domain-page.domaincheck {
    padding: 20px 14px 40px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page {
    padding: 0;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page .sub-content {
    padding: 28px 18px;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page .connect-stap ul,
  body.cl-dashboard-redesign-page .cl-source-domain-page .list-item > li,
  body.cl-dashboard-redesign-page .cl-source-domain-page .nmSeverinfo-wrap {
    flex-direction: column;
    align-items: stretch;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page .connect-stap li {
    min-height: 48px;
    border-right: 0;
    border-bottom: 0;
    margin-bottom: 0;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page .connect-stap li.last {
    border-bottom: 0;
  }
}

/* Source dashboard domain flow page */
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page {
  font-family: var(--cl-source-font) !important;
  --domain-flow-table-columns: minmax(156px, 1.3fr) minmax(52px, .45fr) minmax(144px, 1fr) minmax(164px, .75fr) minmax(148px, .85fr) 52px;
  --domain-flow-setting-columns: minmax(280px, 329px) minmax(0, 596px);
  --domain-flow-dns-width: 596px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-mobile-title {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .breadcrumb.cl-source-domain-breadcrumb {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  width: 1127px !important;
  max-width: 100% !important;
  min-height: 27px !important;
  margin: 0 0 16px !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .breadcrumb.cl-source-domain-breadcrumb a,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .breadcrumb.cl-source-domain-breadcrumb .current {
  font: inherit !important;
  text-decoration: none !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .breadcrumb.cl-source-domain-breadcrumb a {
  color: var(--cl-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .breadcrumb.cl-source-domain-breadcrumb .current {
  color: var(--cl-text-sub) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .breadcrumb.cl-source-domain-breadcrumb .sep {
  color: var(--cl-text-muted) !important;
  font-size: 23px !important;
  font-weight: 400 !important;
  line-height: 1 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-head {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 16px !important;
  width: 1127px !important;
  max-width: 100% !important;
  margin: 0 0 24px !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-title-wrap {
  min-width: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-head h1 {
  margin: 0 0 8px !important;
  color: var(--cl-text) !important;
  font-size: 20px !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
  letter-spacing: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-description-row {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 8px 12px !important;
  height: auto !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-head p {
  margin: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 1.55 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-guide-link {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  color: var(--cl-green-text) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1.45 !important;
  text-decoration: none !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-guide-link:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-guide-link:focus {
  color: var(--cl-green-text) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-guide-link svg {
  flex: none !important;
  width: 13px !important;
  height: 13px !important;
  margin: 0 !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-buy-wrap {
  display: flex !important;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  flex: none !important;
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 3px 0 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-buy-wrap > .domain-flow-buy-btn {
  width: auto !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-pending-open {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 36px;
  padding: 0 14px;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
  background: var(--cl-surface);
  color: var(--cl-text);
  font-family: var(--cl-source-font);
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: background .12s ease, border-color .12s ease;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-pending-open:hover {
  background: var(--cl-bg-2);
  border-color: var(--cl-text-muted);
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-pending-open:focus-visible {
  outline: 2px solid var(--cl-green);
  outline-offset: 2px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-pending-total {
  color: var(--cl-green-text);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-buy-btn,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-save,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-save,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-save {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 92px !important;
  height: 36px !important;
  min-height: 36px !important;
  max-height: 36px !important;
  padding: 0 14px !important;
  border: 1px solid var(--cl-green) !important;
  border-radius: 8px !important;
  background: var(--cl-green) !important;
  box-shadow: none !important;
  color: #fff !important;
  font-family: var(--cl-source-font) !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  text-align: center !important;
  text-decoration: none !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-buy-btn:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-buy-btn:focus,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-save:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-save:focus,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-save:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-save:focus,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-save:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-save:focus {
  border-color: var(--cl-green-hover) !important;
  background: var(--cl-green-hover) !important;
  color: #fff !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-box {
  width: 1127px !important;
  max-width: 100% !important;
  min-height: 0 !important;
  margin: 0 0 12px !important;
  padding: 0 !important;
  overflow: visible !important;
  background: var(--cl-surface) !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: var(--cl-radius-lg) !important;
  box-shadow: var(--cl-shadow-panel) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-owned-box {
  margin: 0 0 12px !important;
  background: var(--cl-surface) !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: var(--cl-radius-lg) !important;
  box-shadow: var(--cl-shadow-panel) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-box.domain-owned-box .sub-content {
  padding: 32px 24px 40px !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-connected-layout {
  position: relative !important;
  display: block !important;
  width: 1488px !important;
  max-width: 100% !important;
  margin: 0 0 12px !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-connected-layout .domain-connected-box {
  flex: 0 1 1127px !important;
  width: 1127px !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-guide-card {
  position: absolute !important;
  top: 0 !important;
  left: calc(1127px + 18px) !important;
  width: 343px !important;
  max-width: 343px !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-box .sub-content {
  width: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 24px 24px 32px !important;
  overflow: visible !important;
  border: 0 !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-list,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .user-domain-wrap,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-section {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  margin-right: 0 !important;
  margin-left: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-section {
  margin-top: 24px !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-box.domain-owned-box .owned-domain-section {
  width: 100% !important;
  max-width: none !important;
  margin-right: 0 !important;
  margin-left: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-section:first-child {
  margin-top: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-site-row {
  position: relative !important;
  z-index: 70 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin: 0 0 24px !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-site-select-wrap,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-select-wrap,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-type-wrap,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-external-select-wrap {
  position: relative !important;
  z-index: 45 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-site-select-wrap.open,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-select-wrap.open,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-type-wrap.open,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-external-select-wrap.open {
  z-index: 300 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-site-select {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  width: auto !important;
  max-width: 100% !important;
  height: 36px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--cl-text) !important;
  font-family: var(--cl-source-font) !important;
  font-size: 20px !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
  text-align: left !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-site-select:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-site-select:focus {
  color: var(--cl-green-text) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-site-select-text {
  display: block !important;
  flex: 0 1 auto !important;
  min-width: 0 !important;
  max-width: min(580px, calc(100vw - 430px)) !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-site-select .domain-flow-site-plan-badge {
  display: inline-flex !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-site-select .domain-flow-site-chevron {
  flex: none !important;
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
  fill: none !important;
  stroke: var(--cl-text-muted) !important;
  stroke-width: 2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  transition: transform .15s, stroke .15s !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-site-select:hover .domain-flow-site-chevron,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-site-select:focus .domain-flow-site-chevron {
  stroke: var(--cl-green) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-site-select-wrap.open .domain-flow-site-chevron {
  transform: rotate(180deg) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-site-arrow-up,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-select-arrow-up,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-type-arrow-up,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-external-arrow-up {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-site-select-wrap.open .domain-flow-site-arrow-down,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-select-wrap.open .domain-flow-setting-select-arrow-down,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-type-wrap.open .domain-flow-dns-type-arrow-down,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-external-select-wrap.open .domain-flow-external-arrow-down {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-site-select-wrap.open .domain-flow-site-arrow-up,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-select-wrap.open .domain-flow-setting-select-arrow-up,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-type-wrap.open .domain-flow-dns-type-arrow-up,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-external-select-wrap.open .domain-flow-external-arrow-up {
  display: block !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-site-menu,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-select-menu,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-type-menu,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-external-select-menu {
  position: absolute !important;
  z-index: 310 !important;
  display: none !important;
  max-height: 240px !important;
  padding: 6px !important;
  overflow: auto !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  box-shadow: 0 12px 24px rgba(20, 24, 32, .14) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-site-menu {
  top: calc(100% + 6px) !important;
  left: 0 !important;
  width: 320px !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-select-menu {
  top: calc(100% + 6px) !important;
  left: 0 !important;
  width: 240px !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-type-menu {
  top: calc(100% + 6px) !important;
  left: 0 !important;
  width: 108px !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-external-select-menu {
  top: calc(100% + 6px) !important;
  left: 0 !important;
  width: 100% !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-site-select-wrap.open .domain-flow-site-menu,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-select-wrap.open .domain-flow-setting-select-menu,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-type-wrap.open .domain-flow-dns-type-menu,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-external-select-wrap.open .domain-flow-external-select-menu {
  display: block !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-site-option,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-select-option,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-type-option,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-external-select-option {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  width: 100% !important;
  height: 36px !important;
  margin: 0 !important;
  padding: 0 10px !important;
  border: 0 !important;
  border-radius: 6px !important;
  background: #fff !important;
  color: var(--cl-text) !important;
  font-family: var(--cl-source-font) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
  text-align: left !important;
  white-space: nowrap !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-site-option:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-site-option:focus,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-site-option.active,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-select-option:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-select-option:focus,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-select-option.active,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-type-option:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-type-option:focus,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-type-option.active,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-external-select-option:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-external-select-option:focus,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-external-select-option.active {
  background: var(--cl-green-soft) !important;
  color: var(--cl-green-text) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-site-option-text,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-select-option-text {
  flex: 0 1 auto !important;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-site-plan-badge {
  display: inline-flex !important;
  flex: none !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 0 !important;
  height: auto !important;
  padding: 2px 7px !important;
  border: 0 !important;
  border-radius: 4px !important;
  font-size: 11px !important;
  font-style: normal !important;
  font-weight: 500 !important;
  line-height: 13px !important;
  letter-spacing: .2px !important;
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
  text-rendering: geometricPrecision !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-site-plan-badge.free,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-site-plan-badge.micro,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-site-plan-badge.domain-flow-site-plan-badge-free,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-site-plan-badge.domain-flow-site-plan-badge-micro {
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  color: var(--cl-text-sub) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-site-plan-badge.shopping,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-site-plan-badge.domain-flow-site-plan-badge-shopping {
  background: #f4778d !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-site-plan-badge.business,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-site-plan-badge.domain-flow-site-plan-badge-business {
  background: #3b6fe0 !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-site-plan-badge.basic,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-site-plan-badge.domain-flow-site-plan-badge-basic {
  background: #16a34a !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-gray-btn,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-primary-set-btn,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-toggle,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-disconnect-btn,
body.cl-dashboard-redesign-page .cl-dashboard-redesign .domain-flow-payment-cancel,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-external-delete-btn,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-detail-edit,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-add,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-cancel,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-address-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: var(--domain-flow-control-min-width, 92px);
  height: var(--domain-flow-control-height, 34px);
  padding: var(--domain-flow-control-padding, 0 12px);
  background: var(--domain-flow-control-background, #fff);
  border: var(--domain-flow-control-border, 1px solid var(--cl-border));
  border-radius: var(--domain-flow-control-radius, 8px);
  box-shadow: var(--domain-flow-control-shadow, none);
  color: var(--cl-text);
  font-family: var(--cl-source-font);
  font-size: var(--domain-flow-control-font-size, 13px);
  font-weight: 700;
  line-height: 1;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-external-connect-btn {
  min-width: 111px !important;
  height: 34px !important;
  padding: 0 14px !important;
  background: #fff !important;
  border-color: var(--cl-border) !important;
  border-radius: 8px !important;
  color: var(--cl-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-external-connect-btn.noplan,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-external-connect-btn.noplan:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-external-connect-btn.noplan:focus {
  background: #f7f8fa !important;
  border-color: var(--cl-border) !important;
  color: var(--cl-text-muted) !important;
  cursor: pointer !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-external-connect-btn:is(.ss_user_noActive, .member_disabled, .disabled),
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-external-connect-btn:is(.ss_user_noActive, .member_disabled, .disabled):hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-external-connect-btn:is(.ss_user_noActive, .member_disabled, .disabled):focus,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-external-connect-btn:is(.ss_user_noActive, .member_disabled, .disabled):active {
  background: #f7f8fa !important;
  border-color: var(--cl-disabled-button-border, #AEB5BF) !important;
  color: var(--cl-text-muted, #B4B8BF) !important;
  cursor: default !important;
  opacity: 1 !important;
  pointer-events: none !important;
  box-shadow: none !important;
  outline: 0 !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-gray-btn:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-gray-btn:focus,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-primary-set-btn:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-primary-set-btn:focus,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-toggle:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-toggle:focus,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-detail-edit:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-detail-edit:focus,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-add:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-add:focus,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-cancel:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-cancel:focus,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-address-btn:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-address-btn:focus {
  background: var(--domain-flow-control-hover-background, var(--cl-green-soft));
  border-color: var(--domain-flow-control-hover-border-color, var(--cl-green-line));
  color: var(--cl-green-text);
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-detail-edit {
  gap: 8px !important;
  background: transparent !important;
  border: 0 !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-detail-edit:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-detail-edit:focus {
  background: transparent !important;
  border-color: transparent !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-disconnect-btn,
body.cl-dashboard-redesign-page .cl-dashboard-redesign .domain-flow-payment-cancel,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-external-delete-btn {
  border-color: rgba(229, 72, 77, .28);
  color: var(--cl-danger);
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-disconnect-btn:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-disconnect-btn:focus,
body.cl-dashboard-redesign-page .cl-dashboard-redesign .domain-flow-payment-cancel:not(:disabled):hover,
body.cl-dashboard-redesign-page .cl-dashboard-redesign .domain-flow-payment-cancel:not(:disabled):focus,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-external-delete-btn:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-external-delete-btn:focus {
  background: var(--domain-flow-disconnect-hover-background, var(--cl-danger-soft)) !important;
  border-color: var(--domain-flow-disconnect-hover-border-color, rgba(229, 72, 77, .42)) !important;
  color: var(--domain-flow-disconnect-hover-color, var(--cl-danger)) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-primary-set-btn {
  min-width: var(--domain-flow-primary-min-width, 132px);
  height: var(--domain-flow-primary-height, 32px);
  border-color: var(--domain-flow-primary-border-color, var(--cl-green-line));
  color: var(--cl-green-text) !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-primary-set-btn.is-disabled,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-primary-set-btn.is-disabled:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-primary-set-btn.is-disabled:focus,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-primary-set-btn[disabled],
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-primary-set-btn[disabled]:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-primary-set-btn[disabled]:focus {
  background: transparent !important;
  border-color: transparent !important;
  color: var(--cl-text-muted) !important;
  cursor: default !important;
  pointer-events: auto !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-select-btn[disabled],
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-add.is-disabled,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-add[disabled],
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-save[disabled],
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-save[disabled],
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-disconnect-btn.is-disabled,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-disconnect-btn[disabled],
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-external-delete-btn.is-disabled,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-external-delete-btn[disabled],
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-detail-edit.is-disabled,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-detail-edit[disabled] {
  background: #f4f6f8;
  border-color: var(--cl-border);
  color: var(--cl-text-muted);
  cursor: default;
  pointer-events: none;
  opacity: 1;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-save {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-panel.is-setting-site-changed .domain-flow-setting-save {
  display: inline-flex !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-section-title {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  height: auto !important;
  margin: 0 0 14px !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-section-title h2 {
  margin: 0 !important;
  color: var(--cl-text) !important;
  font-size: 15px !important;
  font-weight: 800 !important;
  line-height: 1.45 !important;
  letter-spacing: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-help-icon {
  flex: none !important;
  width: 13px !important;
  height: 13px !important;
  margin: 0 !important;
  fill: var(--cl-green) !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-help-icon:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-help-icon:focus,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-help-icon:active {
  fill: var(--cl-accent-blue) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-section-title .domain-flow-help-icon + .popover {
  z-index: 1200 !important;
  max-width: 320px !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-section-title .domain-flow-help-icon + .popover .popover-content {
  padding: 10px 12px !important;
  color: var(--cl-text) !important;
  font-family: var(--cl-source-font) !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
  text-align: left !important;
  word-break: keep-all !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page :is(.external-domain-wrap, .purchased-domain-wrap) ul,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .list-item {
  margin: 0;
  padding: 0;
  list-style: none;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .list-item > li {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
}

body.cl-dashboard-redesign-page .sub-domain.index.cl-source-domain-page.domain-flow-page .list-item > li > div:nth-child(2):not(.domain-flow-row-body):not(.domain-flow-summary-row),
body.cl-dashboard-redesign-page .sub-domain.index.cl-source-domain-page.domain-flow-page .list-item > li > div:not(.list-title):not(.domain-flow-row-body):not(.domain-flow-summary-row) {
  flex: none !important;
  width: 100% !important;
  max-width: none !important;
  margin-bottom: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .list-title {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .list-item > li > div:not(.list-title) {
  width: 100%;
  min-width: 0;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-section-title h2,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-table-head span,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-table-head span {
  font-size: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-section-title h2::before,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-table-head span::before,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-table-head span::before {
  display: block !important;
  color: inherit !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-section-title h2::before {
  content: "연결된 도메인" !important;
  font-size: 15px !important;
  line-height: 1.45 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-table-head span:nth-child(1)::before,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-table-head span:nth-child(1)::before {
  content: "도메인" !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-table-head span:nth-child(2)::before,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-table-head span:nth-child(2)::before {
  content: "종류" !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-table-head span:nth-child(3)::before,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-table-head span:nth-child(3)::before {
  content: "만기일" !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-table-head span:nth-child(4)::before,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-table-head span:nth-child(5)::before {
  content: "상태" !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-table-head span:nth-child(5)::before,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-table-head span:nth-child(6)::before {
  content: "" !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-table-head span:nth-child(4)::before {
  content: "연결 사이트" !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-external-owned-item .domain-flow-summary-row > span:nth-child(2) {
  color: transparent !important;
  font-size: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-external-owned-item .domain-flow-summary-row > span:nth-child(2)::before {
  content: "보유" !important;
  color: var(--cl-text-sub) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 1.45 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-summary-row:has(> span:nth-child(7)) {
  grid-template-rows: repeat(2, minmax(18px, auto)) !important;
  align-items: center !important;
  min-height: 70px !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-summary-row:has(> span:nth-child(7)) > span:nth-child(1),
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-summary-row:has(> span:nth-child(7)) > span:nth-child(2),
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-summary-row:has(> span:nth-child(7)) > span:nth-child(3),
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-summary-row:has(> span:nth-child(7)) > span:nth-child(6),
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-summary-row:has(> span:nth-child(7)) > span:nth-child(7) {
  grid-row: 1 / 3 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-summary-row:has(> span:nth-child(7)) > span:nth-child(1) {
  grid-column: 1 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-summary-row:has(> span:nth-child(7)) > span:nth-child(2) {
  grid-column: 2 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-summary-row:has(> span:nth-child(7)) > span:nth-child(3) {
  grid-column: 4 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-summary-row:has(> span:nth-child(7)) > span:nth-child(4) {
  grid-column: 5 !important;
  grid-row: 1 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-summary-row:has(> span:nth-child(7)) > span:nth-child(5) {
  grid-column: 5 !important;
  grid-row: 2 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-summary-row:has(> span:nth-child(7)) > span:nth-child(6) {
  grid-column: 3 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-summary-row:has(> span:nth-child(7)) > span:nth-child(7) {
  grid-column: 6 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-dns-connect-notice,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-dns-connect-notice *,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-ns-guide a {
  color: var(--cl-green-text) !important;
  fill: var(--cl-green) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-dns-add {
  border-color: var(--cl-green) !important;
  background: #fff !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-dns-add:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-dns-add:focus {
  border-color: var(--cl-green) !important;
  background: var(--cl-green-soft) !important;
  color: var(--cl-green-text) !important;
}

@media only screen and (min-width: 992px) {
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-table-head,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-summary-row {
    grid-template-columns: var(--domain-flow-table-columns) !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-table-head {
    height: 36px !important;
    min-height: 36px !important;
    margin: 0 !important;
    border-radius: 8px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-summary-row {
    min-height: 70px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-table-head span,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-summary-row > span {
    justify-content: flex-start !important;
    text-align: left !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body {
    width: 100%;
    max-width: none;
    min-width: 0;
    height: auto;
    min-height: 0;
    padding: 16px;
    background: #f4f5f9;
    border: 0;
    border-bottom: 1px solid var(--cl-border);
    border-radius: 0;
    box-sizing: border-box;
    overflow: visible;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-detail-tabs {
    height: 42px !important;
    min-height: 42px !important;
    background: #f4f5f9 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-detail-tab {
    height: 42px !important;
    min-height: 42px !important;
    padding: 0 16px !important;
    border-radius: 8px 8px 0 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-detail-tab.is-active {
    background: #fff !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-setting-panel {
    width: auto !important;
    max-width: none !important;
    padding: 20px 20px 20px 20px !important;
    background: #fff !important;
    border-radius: 0 5px 5px 5px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-setting-top {
    display: grid;
    grid-template-columns: var(--domain-flow-setting-columns);
    column-gap: 0;
    align-items: flex-start;
    justify-content: space-between;
    width: 100%;
    min-width: 0;
    margin: 0 0 32px;
    padding: 0;
    box-sizing: border-box;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-site-control {
    display: flex !important;
    align-items: center !important;
    gap: 21px !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    min-height: 36px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-site-control label {
    flex: none !important;
    width: 68px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-setting-select-wrap,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-setting-select-btn,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-setting-select-menu {
    width: 100% !important;
    max-width: 240px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-setting-select-btn span {
    width: calc(100% - 20px) !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-dns-connect-notice {
    grid-column: 2;
    align-self: center;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    margin: 0;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-setting-grid {
    display: grid !important;
    grid-template-columns: var(--domain-flow-setting-columns) !important;
    column-gap: 0 !important;
    justify-content: space-between !important;
    align-items: start !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-dns-col,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-dns-record-section,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-dns-list,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-dns-add,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-dns-head,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-dns-list li,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-setting-note,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-setting-footer {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
  }
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-table-head,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-summary-row {
  display: grid !important;
  grid-template-columns: var(--domain-flow-table-columns) !important;
  align-items: center !important;
  justify-items: stretch !important;
  gap: 0 !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-table-head,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-summary-row,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-table-head,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-summary-row {
  grid-template-columns: var(--domain-flow-table-columns) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-table-head {
  min-height: 36px !important;
  overflow: hidden !important;
  background: #f4f6f8 !important;
  border: 0 !important;
  border-radius: 8px !important;
  color: var(--cl-text-muted) !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-table-head span,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-summary-row > span {
  display: var(--domain-flow-summary-cell-display, flex);
  align-items: var(--domain-flow-summary-cell-align, center);
  justify-content: var(--domain-flow-summary-cell-justify, flex-start);
  min-width: 0;
  padding: var(--domain-flow-summary-cell-padding, 0 16px);
  text-align: left;
  word-break: normal;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-table-head span {
  min-height: 36px !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-table-head span:nth-child(4) {
  grid-column: 5 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-table-head span:nth-child(5) {
  grid-column: 6 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-summary-row > span:nth-child(4) {
  grid-column: var(--domain-flow-connected-primary-column, 4);
  grid-row: var(--domain-flow-connected-primary-row, auto);
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-summary-row > span:nth-child(5) {
  grid-column: var(--domain-flow-connected-status-column, 5);
  grid-row: var(--domain-flow-connected-status-row, auto);
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-summary-row > span:nth-child(6) {
  grid-column: var(--domain-flow-connected-action-column, 6);
  grid-row: var(--domain-flow-connected-action-row, auto);
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .user-domain-wrap {
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-summary-row {
  min-height: 70px !important;
  background: #fff !important;
  border-bottom: 1px solid var(--cl-line) !important;
  color: var(--cl-text-sub) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 1.45 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-connected-item.open .domain-flow-summary-row,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-summary-row:hover {
  background: #fbfcfd !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-connected-item.open .domain-flow-summary-row {
  background: #f4f5f9 !important;
  border-bottom-color: transparent !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-connected-item,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-summary-row,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-summary-row > span {
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-domain {
  display: inline-flex;
  align-items: center;
  gap: 6px !important;
  overflow: hidden;
  color: var(--cl-text);
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-break: normal;
  font-size: 15px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-primary-label {
  display: inline-flex !important;
  flex: none !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 31px !important;
  height: 18px !important;
  padding: 0 6px !important;
  border-radius: 4px !important;
  background: var(--cl-green) !important;
  color: #fff !important;
  font-size: 11px !important;
  font-style: normal !important;
  font-weight: 800 !important;
  line-height: 1 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-expire,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-expire-value,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-expire-text {
  display: var(--domain-flow-expire-display, inline-flex);
  align-items: center;
  min-width: 0;
  gap: 4px;
  color: var(--cl-text);
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-expire-value {
  gap: 8px !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-expire strong {
  color: var(--cl-text) !important;
  font-size: inherit !important;
  font-weight: 800 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-renew-link {
  display: inline-flex !important;
  flex: none !important;
  align-items: center !important;
  align-self: center !important;
  gap: 5px !important;
  height: 20px !important;
  margin-left: 0 !important;
  color: var(--cl-green-text) !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  vertical-align: middle !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-renew-link svg {
  display: block !important;
  flex: none !important;
  width: 6px !important;
  height: 10px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-primary-action,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-default-primary-action {
  display: flex !important;
  align-items: center !important;
  justify-content: var(--domain-flow-primary-action-justify, center);
  min-height: var(--domain-flow-primary-action-min-height, 70px);
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-status-list {
  display: inline-flex !important;
  flex-direction: var(--domain-flow-status-direction, column);
  gap: var(--domain-flow-status-gap, 4px);
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-status-item {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 18px !important;
  color: var(--cl-text) !important;
  font-size: 13px !important;
  font-style: normal !important;
  font-weight: 500 !important;
  line-height: 1.35 !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-status-dot,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-status-pending-icon {
  display: inline-block !important;
  flex: none !important;
  width: 6px !important;
  height: 6px !important;
  margin-right: 8px !important;
  border-radius: 50% !important;
  object-fit: contain !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-status-pending-icon {
  margin-left: 0;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-status-dot.active {
  background: var(--cl-green) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-status-dot.wait {
  background: #ff9100 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-status-dot.danger {
  background: #ee445f !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-status-dot.disabled {
  background: #c9ced6 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-action {
  position: relative !important;
  z-index: 5 !important;
  display: flex !important;
  justify-content: flex-end !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-action-wrap,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-copy-wrap,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-edit-wrap,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-delete-wrap {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 36px !important;
  height: 36px !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-action-wrap:hover {
  z-index: 60 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-action-toggle,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-copy-btn,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-edit,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-delete {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 34px !important;
  min-width: 34px !important;
  height: 34px !important;
  padding: 0 !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub) !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-action-toggle:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-action-toggle:focus,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-copy-btn:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-copy-btn:focus,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-edit:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-edit:focus,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-delete:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-delete:focus {
  background: var(--cl-green-soft) !important;
  border-color: var(--cl-green-line) !important;
  color: var(--cl-green-text) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-action-toggle svg,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-copy-btn svg,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-edit svg,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-delete svg,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-add svg,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-detail-edit svg {
  flex: none !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-detail-edit svg {
  width: 12px !important;
  height: 14px !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-connected-item.open .domain-flow-action-toggle svg {
  transform: rotate(180deg) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-action-menu {
  position: absolute !important;
  top: auto !important;
  bottom: calc(100% + 8px) !important;
  left: 50% !important;
  z-index: 30 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 36px !important;
  height: 26px !important;
  padding: 0 8px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 6px !important;
  box-shadow: 0 8px 16px rgba(20, 24, 32, .12) !important;
  color: var(--cl-text) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  transform: translateX(-50%) !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-action-menu::before {
  content: "" !important;
  position: absolute !important;
  bottom: -5px !important;
  left: 50% !important;
  width: 8px !important;
  height: 8px !important;
  background: #fff !important;
  border-right: 1px solid var(--cl-border) !important;
  border-bottom: 1px solid var(--cl-border) !important;
  transform: translateX(-50%) rotate(45deg) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-action .domain-flow-action-menu {
  right: auto !important;
  left: 50% !important;
  min-width: 56px !important;
  transform: translateX(-50%) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-action .domain-flow-action-menu::before {
  right: auto !important;
  left: 50% !important;
  transform: translateX(-50%) rotate(45deg) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-action-wrap:hover > .domain-flow-action-menu,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-action-toggle:hover + .domain-flow-action-menu,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-copy-btn:hover + .domain-flow-action-menu,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-edit:hover + .domain-flow-action-menu,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-delete:hover + .domain-flow-action-menu {
  opacity: 1 !important;
  visibility: visible !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-empty {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 64px !important;
  margin: 8px 0 0 !important;
  padding: 20px 16px !important;
  background: #fafbfc !important;
  border: 0 !important;
  border-radius: 8px !important;
  color: var(--cl-text-muted) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.45 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body {
  width: 100%;
  min-height: 0;
  padding: 20px 16px;
  background: #f4f5f9;
  border-bottom: 1px solid var(--cl-border);
  border-radius: 0;
  box-sizing: border-box;
  overflow: visible;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-body {
  width: 100%;
  min-height: 0;
  padding: 0;
  background: #f4f5f9;
  border-bottom: 0;
  border-radius: 0;
  box-sizing: border-box;
  overflow: visible;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-detail-tabs {
  display: flex !important;
  align-items: flex-end !important;
  gap: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #f4f5f9 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-detail-tab {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 0 !important;
  height: 42px !important;
  min-height: 42px !important;
  padding: 0 18px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--cl-text-sub) !important;
  font-family: var(--cl-source-font) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  cursor: pointer !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-detail-tab:hover {
  background: rgba(255, 255, 255, 0.72) !important;
  border-radius: 8px 8px 0 0 !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-detail-tab.is-active {
  background: #fff !important;
  color: var(--cl-text) !important;
  font-weight: 800 !important;
  border-radius: 8px 8px 0 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-tab-panel {
  position: relative !important;
  width: auto !important;
  padding: 46px 28px 20px !important;
  background: #fff !important;
  border-radius: 0 !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-panel {
  padding: 20px 20px 20px 0 !important;
  border-radius: 0 5px 5px 5px !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-tab-panel {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body:not(.is-registrant-active):not(.is-payment-active) .domain-flow-setting-panel,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body.is-setting-active .domain-flow-setting-panel {
  display: block !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body.is-registrant-active .domain-flow-setting-panel {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body.is-registrant-active .domain-flow-registrant-panel:not(.domain-flow-payment-panel),
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body.is-payment-active .domain-flow-payment-panel {
  display: block !important;
}

/* 결제정보: 소유자/관리자와 같은 상세형으로 현재 입금정보만 표시한다. */
body.cl-dashboard-redesign-page .cl-dashboard-redesign.domain-flow-payment-details {
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

body.cl-dashboard-redesign-page .cl-dashboard-redesign .domain-flow-payment-actions {
  display: flex;
  justify-content: flex-end;
  margin-top: 20px;
}

body.cl-dashboard-redesign-page .cl-dashboard-redesign .domain-flow-payment-cancel {
  position: relative;
  white-space: nowrap;
}

/* 외형은 연결 해제와 같게 유지하면서 작은 화면에서도 세로 터치 목표는 확보한다. */
body.cl-dashboard-redesign-page .cl-dashboard-redesign .domain-flow-payment-cancel::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  height: max(100%, 44px);
  transform: translateY(-50%);
}

body.cl-dashboard-redesign-page .cl-dashboard-redesign .domain-flow-payment-cancel:not(:disabled):focus-visible {
  outline: 2px solid var(--cl-danger) !important;
  outline-offset: 2px;
}

body.cl-dashboard-redesign-page .cl-dashboard-redesign .domain-flow-payment-cancel:disabled {
  opacity: .5;
  cursor: not-allowed;
}

body.cl-dashboard-redesign-page .cl-dashboard-redesign .domain-flow-payment-empty {
  margin: 0;
  color: var(--cl-text-sub);
  font-size: 13px;
}

/* 결제정보와 구매 대기 팝업 모두 기존 정보 행과 반응형 그리드를 사용한다. */
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-payment-fields > .domain-flow-registrant-view-item {
  min-width: 0;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-payment-order + .domain-flow-payment-order {
  margin-top: 28px;
  padding-top: 28px;
  border-top: 1px solid var(--cl-line);
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-payment-pending {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 8px;
  min-width: 0;
  font-size: 13px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-payment-open {
  padding: 4px 0;
  border: 0;
  background: transparent;
  color: var(--cl-green-text);
  font: inherit;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-payment-open:hover {
  color: var(--cl-green-text);
  text-decoration: underline;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-payment-open:focus-visible {
  outline: 2px solid var(--cl-green);
  outline-offset: 3px;
}

@media only screen and (max-width: 767px) {
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-detail-tabs.has-domain-payment-tab .domain-flow-detail-tab {
    flex: 1 1 0 !important;
    padding: 0 6px !important;
    white-space: normal;
    line-height: 1.35 !important;
    overflow-wrap: anywhere;
  }
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-top {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 0;
  margin: 0 0 32px;
  padding: 0 0 0 20px;
  box-sizing: border-box;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-site-control {
  display: flex !important;
  align-items: center !important;
  gap: 21px !important;
  min-width: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-site-control label {
  flex: 0 0 68px !important;
  width: 68px !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1.5 !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-col h3,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-col h3 {
  margin: 0 !important;
  padding: 0 0 0 20px !important;
  color: var(--cl-text) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1.5 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-col h3 {
  margin-bottom: 16px !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-col h3 {
  padding-left: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-col,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-record-section {
  width: 100%;
  max-width: var(--domain-flow-dns-width);
  min-width: 0;
  box-sizing: border-box;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-connect-notice {
  display: flex;
  align-items: flex-start;
  gap: 3px;
  min-width: 0;
  max-width: 100%;
  margin: 0;
  color: var(--cl-green-text);
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-connect-notice-icon {
  flex: 0 0 16px !important;
  width: 16px !important;
  height: 16px !important;
  margin-top: 1px !important;
  color: var(--cl-green) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-connect-notice-icon svg,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-connect-notice-icon svg * {
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-connect-notice-text {
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  color: var(--cl-green-text) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
  word-break: keep-all !important;
  overflow-wrap: anywhere !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registration-failed-note {
  display: flex !important;
  align-items: flex-start !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 0 16px !important;
  padding: 12px 14px !important;
  background: var(--cl-danger-soft) !important;
  border: 1px solid rgba(229, 72, 77, .24) !important;
  border-radius: 5px !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registration-failed-note p {
  min-width: 0 !important;
  margin: 0 !important;
  color: var(--cl-danger) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1.5 !important;
  word-break: keep-all !important;
  overflow-wrap: anywhere !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-select {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-select-wrap,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-select-btn,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-select-menu {
  width: 100% !important;
  max-width: 240px !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-select-wrap {
  display: inline-block !important;
  height: 36px !important;
  min-width: 240px !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-type-wrap,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-type-btn {
  width: 100%;
  max-width: 108px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-type-wrap {
  display: block !important;
  height: 36px !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-type-btn span {
  display: block;
  width: 64px;
  overflow: hidden;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-select-btn,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-type-btn,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-external-select,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-external-input,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-input,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-edit-control,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-value-control input,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-value-control textarea {
  display: inline-flex;
  align-items: center;
  height: 36px;
  margin: 0;
  padding: 0 12px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 5px;
  box-shadow: none;
  color: var(--cl-text);
  font-family: var(--cl-source-font);
  font-size: 15px;
  font-weight: 400;
  line-height: 1.5;
  box-sizing: border-box;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-select-btn,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-type-btn,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-external-select {
  justify-content: space-between;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-edit-control {
  display: block !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-value-control input,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-value-control textarea {
  display: block !important;
  width: 100% !important;
  height: 34px !important;
  margin: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-value-control input {
  padding: 0 12px !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-value-control textarea {
  min-height: 34px !important;
  max-height: 102px !important;
  padding: 5px 12px !important;
  overflow: hidden !important;
  resize: none !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-value-control input:focus,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-value-control textarea:focus {
  box-shadow: none !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-select-btn:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-select-btn:focus,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-type-btn:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-type-btn:focus,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-external-select:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-external-select:focus,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-external-input:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-external-input:focus,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-input:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-input:focus,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-edit-control:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-edit-control:focus {
  border-color: var(--cl-green-line) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-select-wrap.open .domain-flow-setting-select-btn,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-type-wrap.open .domain-flow-dns-type-btn {
  border-color: var(--cl-green) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-select-btn:focus,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-type-btn:focus,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-edit-control:focus,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-value-control:focus-within {
  border-color: var(--cl-green) !important;
  box-shadow: none !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-edit-control.is-error,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-edit-control.is-error:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-edit-control.is-error:focus,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-value-control.is-error,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-value-control.is-error:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-value-control.is-error:focus-within {
  border-color: var(--cl-danger) !important;
  box-shadow: none !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-select-btn span,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-external-select span {
  display: block !important;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-select-btn span {
  width: 192px !important;
  line-height: normal !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-select-arrow,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-type-arrow,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-external-arrow {
  flex: none !important;
  width: 8px !important;
  height: 4px !important;
  margin-left: 10px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-connected-label {
  flex: none !important;
  margin-left: auto !important;
  color: var(--cl-green-text) !important;
  font-size: 12px !important;
  font-style: normal !important;
  font-weight: 500 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-select-option.is-disabled {
  background: #eeeff3 !important;
  color: #d1d3d5 !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-select-option,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-type-option {
  height: 36px !important;
  font-size: 15px !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-select-option {
  border-radius: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-type-option {
  border-radius: 5px !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-select-menu,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-type-menu {
  top: calc(100% + 4px) !important;
  padding: 4px 0 !important;
  border-color: var(--cl-border) !important;
  border-radius: 5px !important;
  box-shadow: 0 8px 20px rgba(34, 36, 40, 0.12) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-grid {
  display: grid !important;
  grid-template-columns: var(--domain-flow-setting-columns) !important;
  column-gap: 0 !important;
  gap: 0 !important;
  justify-content: space-between !important;
  align-items: start !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-ns-list,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-ns-list {
  padding-left: 20px !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list {
  width: 100% !important;
  max-width: var(--domain-flow-dns-width) !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-ns-list li {
  display: grid !important;
  grid-template-columns: 50px 20px 219px 8px 32px !important;
  align-items: start !important;
  gap: 0 !important;
  min-height: 0 !important;
  margin: 0 0 20px !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-ns-order {
  max-width: 50px !important;
  padding-top: 9px !important;
  color: #b1b3b7 !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1.5 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-ns-value {
  display: block !important;
  grid-column: 3 !important;
  min-width: 0 !important;
  padding-top: 7px !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-ns-name {
  display: block !important;
  overflow: hidden !important;
  color: var(--cl-text) !important;
  font-size: 15px !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-ns-ip {
  display: block !important;
  margin-top: 4px !important;
  color: var(--cl-text-sub) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-copy-wrap {
  width: 32px !important;
  height: 32px !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-ns-list .domain-flow-copy-wrap {
  grid-column: 5 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-copy-btn {
  width: 32px !important;
  min-width: 32px !important;
  height: 32px !important;
  border: 0 !important;
  border-radius: 5px !important;
  background: transparent !important;
  color: var(--cl-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-copy-btn:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-copy-btn:focus {
  background: #fafafa !important;
  border-color: transparent !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list .domain-flow-copy-wrap {
  flex: 0 0 36px !important;
  width: 36px !important;
  min-width: 36px !important;
  max-width: 36px !important;
  height: 36px !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list .domain-flow-copy-btn {
  width: 28px !important;
  min-width: 28px !important;
  height: 28px !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list .domain-flow-copy-btn svg {
  width: 12px !important;
  height: 13px !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-ns-empty,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-empty,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-empty {
  color: var(--cl-text-muted) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-ns-guide {
  margin-top: 32px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-note,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-note,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-owner-note {
  margin-top: 12px !important;
  padding: 12px !important;
  background: #fafafa !important;
  border: 0 !important;
  border-radius: 5px !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-ns-guide strong {
  display: block !important;
  margin: 0 0 12px !important;
  padding: 0 0 0 20px !important;
  color: var(--cl-text) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1.5 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-ns-guide div {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 16px !important;
  padding: 0 0 0 12px !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-ns-guide a {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 5px 8px !important;
  border-radius: 12px !important;
  background: transparent !important;
  color: var(--cl-green-text) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  line-height: 1.5 !important;
  text-decoration: none !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-ns-guide a:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-ns-guide a:focus {
  background: #fafafa !important;
  color: var(--cl-green-text) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-ns-guide a svg {
  width: 12px !important;
  height: 12px !important;
  fill: currentColor !important;
}

@media only screen and (min-width: 992px) {
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-setting-col h3 {
    margin: 0 0 14px !important;
    padding-left: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-ns-list {
    width: 100% !important;
    padding-left: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-ns-list li {
    grid-template-columns: 50px minmax(0, 1fr) 32px !important;
    width: 100% !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-ns-list li:last-child {
    margin-bottom: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-ns-order {
    width: 40px !important;
    max-width: 40px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-ns-value {
    grid-column: 2 !important;
    width: calc(100% - 8px) !important;
    max-width: none !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-ns-name {
    display: -webkit-box !important;
    white-space: normal !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-ns-list .domain-flow-copy-wrap {
    grid-column: 3 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-ns-guide strong,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-ns-guide div {
    padding-left: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-ns-guide div {
    gap: 28px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-ns-guide a {
    justify-content: space-between !important;
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    line-height: 1.5 !important;
    white-space: nowrap !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-ns-guide a:nth-child(1),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-ns-guide a:nth-child(2) {
    flex: 0 0 59px !important;
    width: 59px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-ns-guide a:nth-child(3) {
    flex: 0 0 65px !important;
    width: 65px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-ns-guide a:hover,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-ns-guide a:focus {
    background: transparent !important;
  }
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-add {
  width: 100% !important;
  max-width: var(--domain-flow-dns-width) !important;
  min-width: 0 !important;
  height: 40px !important;
  margin: 0 0 20px !important;
  padding: 0 !important;
  border: 1px solid var(--cl-green) !important;
  border-radius: 5px !important;
  background: #fff !important;
  color: var(--cl-green-text) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  line-height: 1.5 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-add:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-add:focus {
  background: var(--cl-green-soft) !important;
  border-color: var(--cl-green) !important;
  color: var(--cl-green-text) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-add-icon {
  width: 12px !important;
  height: 12px !important;
  margin-right: 7px !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-head,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li {
  display: grid !important;
  grid-template-columns: minmax(72px, 108px) minmax(72px, 108px) minmax(0, 1fr) !important;
  gap: 8px !important;
  width: 100% !important;
  max-width: var(--domain-flow-dns-width) !important;
  min-width: 0 !important;
  align-items: start !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-head {
  margin: 0 0 12px !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-head span {
  color: #b1b3b7 !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-head.domain-flow-dns-empty-head {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li {
  min-height: 44px !important;
  margin: 0 0 12px !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li > span {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  min-width: 0;
  min-height: 36px;
  height: auto;
  padding: 3px 12px;
  background: #f4f5f9;
  border: 1px solid var(--cl-border);
  border-radius: 5px;
  color: var(--cl-text);
  font-size: 15px;
  font-weight: 400;
  line-height: 1.5;
  text-align: left;
  box-sizing: border-box;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-empty {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: var(--domain-flow-dns-width) !important;
  min-width: 0 !important;
  min-height: 72px !important;
  margin: 0 !important;
  background: #fafbfc !important;
  border-radius: 5px !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-read-label {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-read-value,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-value-text,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-read-record-value {
  min-width: 0 !important;
  text-align: left;
  overflow-wrap: anywhere !important;
  word-break: break-all !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-value-text {
  line-height: normal !important;
  white-space: pre-line !important;
  text-overflow: clip !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-read-record-value > .domain-flow-dns-read-value {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  width: 100% !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li[data-record-type="TXT"] > .domain-flow-dns-read-record-value,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li[data-record-type="TXT"] > .domain-flow-dns-read-record-value > .domain-flow-dns-read-value {
  max-height: 72px;
  overflow-y: auto;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li[data-record-type="MX"] > .domain-flow-dns-read-record-value,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li[data-record-type="MX"] > .domain-flow-dns-read-record-value > .domain-flow-dns-read-value {
  max-height: 104px;
  overflow-y: auto;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-saved-editable-row {
  grid-template-columns: minmax(72px, 108px) 8px minmax(72px, 108px) 8px minmax(0, 1fr) 4px 36px 4px 36px !important;
  align-items: stretch !important;
  column-gap: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-saved-editable-row > span:nth-child(1) {
  grid-column: 1 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-saved-editable-row > span:nth-child(2) {
  grid-column: 3 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-saved-editable-row > span:nth-child(3) {
  grid-column: 5;
  justify-content: flex-start;
  padding: 3px 12px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-saved-editable-row > .domain-flow-dns-edit-wrap {
  grid-column: 7 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-saved-editable-row > .domain-flow-dns-delete-wrap {
  grid-column: 9 !important;
  background: transparent !important;
  border: none !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-edit-row {
  position: relative !important;
  grid-template-columns: minmax(72px, 108px) minmax(72px, 108px) minmax(0, 1fr) !important;
  min-height: 36px !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-edit-cell,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-value-zone,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-value-control {
  min-width: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-value-zone {
  display: grid !important;
  grid-column: 3 / 4 !important;
  grid-template-columns: minmax(0, 1fr) 36px !important;
  gap: 4px !important;
  width: 100% !important;
  max-width: 100% !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-value-control {
  width: 100% !important;
  max-width: 100% !important;
  height: 36px !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 5px !important;
  background: #fff !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-value-control:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-value-control:focus-within {
  border-color: var(--cl-green-line) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-value-control:focus-within {
  border-color: var(--cl-green) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-value-control.is-error,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-value-control.is-error:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-value-control.is-error:focus-within {
  border-color: var(--cl-danger) !important;
  box-shadow: none !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-edit-row.is-multiline-value {
  align-items: flex-start !important;
  min-height: 36px !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-edit-row.is-multiline-value .domain-flow-dns-value-zone {
  align-items: flex-start !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-edit-row.is-multiline-value .domain-flow-dns-value-control {
  min-height: 36px !important;
  max-height: 104px !important;
  height: auto !important;
  overflow: hidden !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-edit-row.is-multiline-value .domain-flow-dns-value-control textarea {
  min-height: 34px !important;
  max-height: 102px !important;
  height: 34px !important;
  overflow-y: hidden !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-error {
  display: none !important;
  grid-template-columns: 16px minmax(0, 1fr) !important;
  column-gap: 3px !important;
  align-items: flex-start !important;
  min-width: 0 !important;
  min-height: 16px !important;
  height: auto !important;
  margin: 0 !important;
  color: var(--cl-danger) !important;
  font-family: var(--cl-source-font) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-name-error {
  grid-column: 2 / 3 !important;
  grid-row: 2 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-value-error {
  grid-column: 3 / 4 !important;
  grid-row: 2 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-edit-row.has-name-error .domain-flow-dns-name-error,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-edit-row.has-value-error .domain-flow-dns-value-error {
  display: grid !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-error svg {
  display: block !important;
  flex: 0 0 16px !important;
  width: 16px !important;
  min-width: 16px !important;
  height: 16px !important;
  margin: 2px 0 0 !important;
  align-self: start !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-error svg path {
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-error span {
  display: block !important;
  max-width: 305px !important;
  color: var(--cl-danger) !important;
  line-height: 1.5 !important;
  align-self: start !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-note {
  min-height: 62px !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-note p {
  margin: 0 !important;
  padding-left: 12px !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-error,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-external-error {
  color: var(--cl-danger) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-footer {
  display: flex !important;
  justify-content: flex-end !important;
  gap: 0 !important;
  margin-top: 20px !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-save-wrap {
  display: none !important;
  position: static !important;
  justify-content: flex-start !important;
  margin-top: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-edit-mode .domain-flow-dns-save-wrap {
  position: absolute !important;
  top: 20px !important;
  right: 20px !important;
  display: block !important;
  width: 74px !important;
  max-width: 74px !important;
  height: 36px !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-panel.is-setting-site-changed .domain-flow-dns-save-wrap {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-save,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-save {
  align-items: center !important;
  justify-content: center !important;
  width: 74px !important;
  min-width: 74px !important;
  height: 36px !important;
  min-height: 36px !important;
  max-height: 36px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 5px !important;
  background: var(--cl-green) !important;
  color: #fff !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  line-height: 1.5 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-save:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-save:focus,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-save:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-save:focus {
  background: var(--cl-green-hover) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-disconnect-btn,
body.cl-dashboard-redesign-page .cl-dashboard-redesign .domain-flow-payment-cancel,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-external-delete-btn {
  width: var(--domain-flow-disconnect-width, 95px);
  min-width: var(--domain-flow-disconnect-min-width, 95px);
  height: var(--domain-flow-disconnect-height, 36px);
  min-height: var(--domain-flow-disconnect-min-height, 36px);
  max-height: var(--domain-flow-disconnect-max-height, 36px);
  padding: var(--domain-flow-disconnect-padding, 0);
  border: var(--domain-flow-disconnect-border, 1px solid var(--cl-danger));
  border-radius: var(--domain-flow-disconnect-radius, 5px);
  background: var(--domain-flow-disconnect-background, #fff);
  color: var(--domain-flow-disconnect-color, var(--cl-danger));
  font-size: var(--domain-flow-disconnect-font-size, 15px);
  font-weight: var(--domain-flow-disconnect-font-weight, 600);
  line-height: var(--domain-flow-disconnect-line-height, 1.5);
  text-decoration: var(--domain-flow-disconnect-text-decoration, none);
  text-underline-offset: var(--domain-flow-disconnect-text-underline-offset, auto);
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-external-delete-btn {
  margin-left: 8px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-saved-editable-row > span.domain-flow-dns-edit-wrap,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-delete-wrap {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 36px !important;
  width: 36px !important;
  min-width: 0 !important;
  max-width: 36px !important;
  height: 36px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  overflow: visible !important;
  transform: none !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-edit,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list .domain-flow-dns-delete {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 36px !important;
  min-width: 0 !important;
  max-width: 36px !important;
  height: 36px !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 5px !important;
  background: transparent !important;
  color: var(--cl-text) !important;
  line-height: 1.5 !important;
  cursor: pointer !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list .domain-flow-dns-delete {
  color: var(--cl-danger) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-edit:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-edit:focus,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list .domain-flow-dns-delete:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list .domain-flow-dns-delete:focus {
  background: #fafafa !important;
  border-color: transparent !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-edit svg {
  flex: 0 0 16px !important;
  width: 16px !important;
  height: 18px !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list .domain-flow-dns-delete svg {
  display: block !important;
  flex: 0 0 16px !important;
  width: 16px !important;
  min-width: 16px !important;
  height: 16px !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  min-height: 36px !important;
  margin: 0 0 20px !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-panel.is-editing .domain-flow-detail-edit {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-cancel,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-save {
  display: none !important;
  min-width: 74px !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-panel.is-editing .domain-flow-registrant-cancel,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-panel.is-editing .domain-flow-registrant-save {
  display: inline-flex !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-panel.is-editing .domain-flow-registrant-view {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 24px !important;
  width: 100% !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-edit {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-panel.is-editing .domain-flow-registrant-edit {
  display: grid !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-view-list {
  width: 100% !important;
  margin: 12px 0 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-view-item,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-field {
  display: block !important;
  margin: 14px 0 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-view-item:first-child,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-field:first-child {
  margin-top: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-view-label,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-label {
  display: block !important;
  margin: 0 0 5px !important;
  padding: 0 !important;
  color: var(--cl-text-muted) !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-view-value,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-text {
  display: block !important;
  min-width: 0 !important;
  color: var(--cl-text) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1.5 !important;
  overflow-wrap: anywhere !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-fields {
  width: 100% !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-input {
  width: 100% !important;
  max-width: 320px !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-address {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 102px !important;
  gap: 8px !important;
  width: 100% !important;
  max-width: 320px !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-address .domain-flow-registrant-input,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-address-line {
  width: 100% !important;
  max-width: none !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-address-line {
  grid-column: 1 / -1 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-address-btn {
  min-width: 0 !important;
  width: 100% !important;
  height: 36px !important;
  border-radius: 5px !important;
  color: var(--cl-text) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  line-height: 1.5 !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-registrant-panel {
  width: auto !important;
  max-width: none !important;
  min-height: 0 !important;
  padding: 24px 24px 28px !important;
  background: #fff !important;
  border-radius: 5px !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-registrant-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 32px !important;
  align-items: start !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-registrant-col {
  min-width: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-registrant-col h3 {
  margin: 0 0 14px !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-size: 15px !important;
  font-weight: 800 !important;
  line-height: 1.45 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-registrant-view-list,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-registrant-fields {
  width: 100% !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-registrant-view-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-registrant-view-item {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 5px !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border-top: 0 !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-registrant-field {
  display: grid !important;
  grid-template-columns: 96px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 14px !important;
  min-height: 36px !important;
  margin: 0 !important;
  padding: 10px 0 !important;
  border-top: 1px solid var(--cl-line) !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-registrant-field:first-child {
  padding-top: 0 !important;
  border-top: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-registrant-view-label,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-registrant-label {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1.45 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-registrant-view-value,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-registrant-text {
  display: block !important;
  min-width: 0 !important;
  color: var(--cl-text) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.55 !important;
  overflow-wrap: anywhere !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-registrant-view-address {
  line-height: 1.65 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-registrant-input {
  width: 100% !important;
  max-width: none !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-registrant-address {
  grid-template-columns: minmax(0, 1fr) 120px !important;
  max-width: none !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-registrant-owner-note {
  display: flex !important;
  align-items: flex-start !important;
  gap: 8px !important;
  margin: 14px 0 0 !important;
  padding: 12px !important;
  background: #f6fbf8 !important;
  border: 1px solid var(--cl-green-line) !important;
  border-radius: 8px !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-registrant-owner-note-icon {
  flex: 0 0 16px !important;
  width: 16px !important;
  height: 16px !important;
  margin-top: 2px !important;
  color: var(--cl-green) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-registrant-owner-note-icon svg {
  display: block !important;
  width: 16px !important;
  height: 16px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-registrant-owner-note-text {
  min-width: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-registrant-owner-note-text p {
  margin: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.55 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-registrant-owner-note-link {
  display: inline-flex !important;
  align-items: center !important;
  gap: 3px !important;
  color: var(--cl-green-text) !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  border-bottom: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-registrant-owner-note-link svg {
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-registrant-owner-note-link:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-registrant-owner-note-link:focus {
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-free-box,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-legacy-notice-box {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .ns-notice,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .info-content,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain_mail {
  margin-top: 12px !important;
  padding: 14px !important;
  background: #fff !important;
  border: 1px solid var(--cl-line) !important;
  border-radius: 8px !important;
  color: var(--cl-text-sub) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .zone-state {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 0 10px !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .zone-state.active {
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .zone-state.wait {
  color: #f59331 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .ns-info-box ul {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .ns-info-box li {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 8px 0 !important;
  border-top: 1px solid var(--cl-line) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .ns-config-wrap {
  display: flex !important;
  gap: 8px !important;
  margin-top: 12px !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .ns-copy,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .ns-disconnection-btn,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .ns-record-btn,
body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .mx-record-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 28px !important;
  padding: 0 10px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 7px !important;
  color: var(--cl-text) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  cursor: pointer !important;
}

/* 도메인 팝업 공통 중앙 정렬: 기존 전용 배치 규칙이 우선하도록 낮은 명시도로 적용한다. */
body.cl-dashboard-redesign-page :where(.flat-modal.cl-source-domain-modal-wrap) {
  position: fixed !important;
  inset: 0 !important;
  z-index: 1000000 !important;
  width: 100vw !important;
  height: 100vh !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}

body.cl-dashboard-redesign-page :where(.cl-source-domain-modal-wrap > .modal-default) {
  position: relative !important;
  inset: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  width: 100% !important;
  height: auto !important;
  min-height: 100% !important;
  margin: 0 !important;
  padding: 24px 16px !important;
  overflow: visible !important;
  background: rgba(0, 0, 0, .45) !important;
}

body.cl-dashboard-redesign-page :where(.cl-source-domain-modal-wrap > .modal-default > .modal-dialog) {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  flex: none !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  margin: auto !important;
  padding: 0 !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page :where(.cl-source-domain-modal-wrap + .modal-backdrop),
body.cl-dashboard-redesign-page :where(.cl-source-domain-modal-wrap > .modal-default > .cl-mobile-btn.close) {
  display: none !important;
}

/* 도메인 신규 구매 대기 목록 / 주문별 결제정보 (기존 결제내역 탭과 같은 정보 뷰) */
body.cl-dashboard-redesign-page .flat-modal.domain-flow-order-modal-wrap {
  position: fixed !important;
  inset: 0 !important;
  z-index: 1000001 !important;
  width: 100vw !important;
  height: 100vh !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  background: rgba(0, 0, 0, .45) !important;
}

body.cl-dashboard-redesign-page .flat-modal.domain-flow-payment-modal-wrap {
  z-index: 1000003 !important;
}

body.cl-dashboard-redesign-page .flat-modal.domain-flow-cancel-modal-wrap {
  z-index: 1000005 !important;
}

body.cl-dashboard-redesign-page .flat-modal.domain-flow-renew-pending-modal-wrap {
  z-index: 1000007 !important;
}

body.cl-dashboard-redesign-page .flat-modal.domain-flow-renew-pending-modal-wrap .modal-dialog.domain-flow-renew-pending-modal {
  width: min(440px, 100%) !important;
}

body.cl-dashboard-redesign-page .flat-modal.domain-flow-renew-pending-modal-wrap .domain-flow-renew-pending-modal .modal-content {
  padding-right: 28px !important;
  padding-left: 28px !important;
}

body.cl-dashboard-redesign-page .domain-flow-renew-pending-modal-wrap .modal-body > p {
  margin: 0;
  color: var(--cl-text-sub);
  font-size: 13px;
  line-height: 1.7;
  text-align: center;
  overflow-wrap: anywhere;
}

body.cl-dashboard-redesign-page .domain-flow-renew-pending-modal-wrap .modal-footer .ok-button-dialog {
  width: 100% !important;
  height: 46px !important;
  padding: 0 16px !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: var(--cl-green) !important;
  color: var(--cl-surface) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
}

body.cl-dashboard-redesign-page .domain-flow-renew-pending-modal-wrap .modal-footer .ok-button-dialog:hover,
body.cl-dashboard-redesign-page .domain-flow-renew-pending-modal-wrap .modal-footer .ok-button-dialog:focus-visible {
  background: var(--cl-green-hover) !important;
}

body.cl-dashboard-redesign-page .flat-modal.domain-flow-cancel-modal-wrap .modal-dialog.domain-flow-cancel-modal {
  width: min(440px, 100%) !important;
}

body.cl-dashboard-redesign-page .flat-modal.domain-flow-cancel-modal-wrap .domain-flow-cancel-modal .modal-content {
  padding-right: 28px !important;
  padding-left: 28px !important;
  border: 0 !important;
}

body.cl-dashboard-redesign-page .domain-flow-cancel-modal-wrap .domain-flow-cancel-modal .modal-footer .btn {
  height: 46px !important;
}

body.cl-dashboard-redesign-page .domain-flow-payment-modal-wrap .domain-flow-pending-cancel {
  width: 100%;
  height: 46px;
  margin: 24px 0 0;
  padding: 0 16px;
  border: 1px solid var(--cl-danger);
  border-radius: 8px;
  background: var(--cl-surface);
  color: var(--cl-danger);
  font: 600 14px/1 var(--cl-source-font);
  cursor: pointer;
}

body.cl-dashboard-redesign-page .domain-flow-payment-modal-wrap .domain-flow-pending-cancel:hover,
body.cl-dashboard-redesign-page .domain-flow-payment-modal-wrap .domain-flow-pending-cancel:focus-visible {
  background: var(--cl-danger-soft);
}

body.cl-dashboard-redesign-page .domain-flow-payment-modal-wrap .domain-flow-pending-cancel:disabled,
body.cl-dashboard-redesign-page .domain-flow-cancel-modal-wrap button:disabled {
  opacity: .5;
  cursor: wait;
}

body.cl-dashboard-redesign-page .domain-flow-cancel-modal-wrap .domain-flow-cancel-modal .modal-footer .ok-button-dialog,
body.cl-dashboard-redesign-page .domain-flow-cancel-modal-wrap .domain-flow-cancel-modal .modal-footer .ok-button-dialog:is(:hover, :focus, :focus-visible) {
  border-color: var(--cl-danger) !important;
  background: var(--cl-danger) !important;
  color: var(--cl-surface) !important;
}

body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap + .modal-backdrop,
body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .modal-backdrop,
body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap > .modal-default > .cl-mobile-btn {
  display: none !important;
}

body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap > .modal-default {
  position: relative !important;
  inset: auto !important;
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  min-height: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 24px 16px !important;
  overflow: visible !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .modal-dialog.domain-flow-order-modal {
  flex: none !important;
  width: min(880px, 100%) !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  margin: auto !important;
  padding: 0 !important;
  overflow: visible !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .modal-dialog.domain-flow-payment-modal {
  width: min(540px, 100%) !important;
}

body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .domain-flow-order-modal .modal-content {
  position: relative !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 36px 32px 28px !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 14px !important;
  background: var(--cl-surface) !important;
  box-shadow: var(--shadow-modal, 0 20px 50px rgba(20, 24, 32, .25)) !important;
  color: var(--cl-text);
  font-family: var(--cl-source-font);
  text-align: left;
}

body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .domain-flow-order-modal .modal-body {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .domain-flow-order-modal .modal-title {
  margin: 0 36px 24px !important;
  color: var(--cl-text) !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.domain-flow-order-modal-wrap .modal-default .modal-dialog.domain-flow-order-modal .modal-content > .close.close-button-dialog {
  position: absolute !important;
  top: 16px !important;
  right: 16px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  min-width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  color: var(--cl-text-sub) !important;
  opacity: 1 !important;
  transition: color .12s ease, background .12s ease, transform .18s cubic-bezier(.34,1.56,.64,1);
}

body.cl-dashboard-redesign-page .flat-modal.domain-flow-order-modal-wrap .modal-default .modal-dialog.domain-flow-order-modal .modal-content > .close.close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.domain-flow-order-modal-wrap .modal-default .modal-dialog.domain-flow-order-modal .modal-content > .close.close-button-dialog:focus-visible {
  background: var(--cl-bg-3) !important;
  color: var(--cl-text) !important;
  transform: rotate(90deg) !important;
}

body.cl-dashboard-redesign-page .flat-modal.domain-flow-order-modal-wrap .modal-default .modal-dialog.domain-flow-order-modal .modal-content > .close.close-button-dialog span,
body.cl-dashboard-redesign-page .flat-modal.domain-flow-order-modal-wrap .modal-default .modal-dialog.domain-flow-order-modal .modal-content > .close.close-button-dialog svg {
  display: block !important;
  width: 15px !important;
  height: 15px !important;
  margin: 0 !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.domain-flow-order-modal-wrap .modal-default .modal-dialog.domain-flow-order-modal .modal-content > .close.close-button-dialog::before,
body.cl-dashboard-redesign-page .flat-modal.domain-flow-order-modal-wrap .modal-default .modal-dialog.domain-flow-order-modal .modal-content > .close.close-button-dialog::after {
  display: none !important;
  content: none !important;
}

body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .domain-flow-order-modal .modal-footer {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  margin: 24px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .modal-footer::before,
body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .modal-footer::after {
  display: none !important;
}

body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .modal-footer .close-button-dialog {
  width: 100% !important;
  height: 46px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--cl-text-sub) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
}

body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .modal-footer .close-button-dialog:hover,
body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .modal-footer .close-button-dialog:focus-visible {
  background: var(--cl-green-soft) !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .domain-flow-pending-content > .domain-flow-pending-notice {
  margin: 0 0 20px;
  color: var(--cl-text-sub);
  font-size: 13px;
  line-height: 1.6;
  word-break: keep-all;
  text-align: left;
}

body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .domain-flow-pending-count {
  margin: 0 0 12px;
  font-size: 13.5px;
  font-weight: 600;
  text-align: left;
}

body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .domain-flow-pending-count strong {
  color: var(--cl-green-text);
}

body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .domain-flow-pending-table {
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
  font-size: 13.5px;
  line-height: 1.55;
}

body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .domain-flow-pending-table th,
body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .domain-flow-pending-table td {
  padding: 14px 8px;
  border-bottom: 1px solid var(--cl-line);
  overflow-wrap: anywhere;
  vertical-align: middle;
  text-align: left;
}

body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .domain-flow-pending-table th {
  background: var(--cl-bg-2);
  color: var(--cl-text-sub);
  font-size: 12px;
  font-weight: 600;
}

body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .domain-flow-pending-table th:first-child {
  width: 30%;
}

body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .domain-flow-pending-domain {
  font-weight: 600;
}

body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .domain-flow-pending-amount {
  font-variant-numeric: tabular-nums;
}

body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .domain-flow-pending-status {
  display: inline-block;
  padding: 3px 6px;
  border-radius: 4px;
  background: var(--cl-bg-3);
  color: var(--cl-text-sub);
  font-size: 12px;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .domain-flow-pending-status.is-processing {
  background: var(--cl-green-soft);
  color: var(--cl-green-text);
}

body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .domain-flow-pending-status.is-attention {
  background: var(--cl-danger-soft);
  color: var(--cl-danger);
}

body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .domain-flow-pending-payment-open {
  min-height: 44px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--cl-green-text);
  font: inherit;
  font-weight: 600;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .domain-flow-pending-payment-open:hover {
  color: var(--cl-green-text);
  text-decoration: underline;
}

body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .domain-flow-pending-payment-open:focus-visible {
  outline: 2px solid var(--cl-green);
  outline-offset: 3px;
}

body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .domain-flow-pending-table .domain-flow-pending-empty {
  height: 100px;
  color: var(--cl-text-sub);
  text-align: center;
}

body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .domain-flow-registrant-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 28px;
}

body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .domain-flow-registrant-col h3 {
  margin: 0 0 18px;
  color: var(--cl-text);
  font-size: 15px;
  font-weight: 700;
  line-height: 1.5;
  text-align: left;
}

body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .domain-flow-registrant-view-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .domain-flow-registrant-view-label {
  display: block;
  margin-bottom: 5px;
  color: var(--cl-text-sub);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.45;
}

body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .domain-flow-registrant-view-value {
  color: var(--cl-text);
  font-size: 14px;
  font-weight: 600;
  line-height: 1.55;
  overflow-wrap: anywhere;
  font-variant-numeric: tabular-nums;
}

body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .domain-flow-copy-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 30px;
  min-height: 30px;
  padding: 0 6px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--cl-text-sub);
  vertical-align: middle;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .domain-flow-copy-btn:hover,
body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .domain-flow-copy-btn:focus-visible {
  background: var(--cl-green-soft);
  color: var(--cl-green-text);
}

body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .domain-flow-copy-btn svg {
  fill: currentColor;
}

body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .domain-flow-copy-menu {
  display: none;
}

/* 구매 대기 주문의 결제정보만 결제 결과 카드 형태로 표시한다. 보유/연장 내역은 유지한다. */
body.cl-dashboard-redesign-page .domain-flow-payment-modal-wrap .domain-flow-payment-modal .modal-content {
  padding: 34px 36px 32px !important;
}

body.cl-dashboard-redesign-page .domain-flow-payment-modal-wrap .domain-flow-payment-modal .modal-title {
  display: none !important;
}

body.cl-dashboard-redesign-page .domain-flow-payment-modal-wrap .domain-flow-payment-result-head {
  text-align: center;
}

body.cl-dashboard-redesign-page .domain-flow-payment-modal-wrap .domain-flow-payment-result-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  margin: 0 auto 18px;
  border-radius: 999px;
  background: var(--cl-green-soft);
  color: var(--cl-green);
}

body.cl-dashboard-redesign-page .domain-flow-payment-modal-wrap .is-paid .domain-flow-payment-result-icon {
  background: var(--cl-green);
  color: #fff;
}

body.cl-dashboard-redesign-page .domain-flow-payment-modal-wrap .is-attention .domain-flow-payment-result-icon {
  background: var(--cl-bg-3);
  color: var(--cl-text-sub);
}

body.cl-dashboard-redesign-page .domain-flow-payment-modal-wrap .domain-flow-payment-result-icon svg {
  width: 26px;
  height: 26px;
}

body.cl-dashboard-redesign-page .domain-flow-payment-modal-wrap .domain-flow-payment-result-head h3 {
  margin: 0 0 14px;
  color: var(--cl-text);
  font-size: 20px;
  font-weight: 700;
  line-height: 1.4;
  overflow-wrap: anywhere;
}

body.cl-dashboard-redesign-page .domain-flow-payment-modal-wrap .domain-flow-payment-result-head p {
  margin: 0 0 26px;
  color: var(--cl-text-sub);
  font-size: 13px;
  line-height: 1.7;
}

body.cl-dashboard-redesign-page .domain-flow-payment-modal-wrap .domain-flow-registrant-grid {
  display: block;
  border-top: 1px solid var(--cl-line);
}

body.cl-dashboard-redesign-page .domain-flow-payment-modal-wrap .domain-flow-registrant-col h3 {
  display: none;
}

body.cl-dashboard-redesign-page .domain-flow-payment-modal-wrap .domain-flow-registrant-view-list {
  display: block;
}

body.cl-dashboard-redesign-page .domain-flow-payment-modal-wrap .domain-flow-registrant-view-item {
  display: flex;
  align-items: center;
  gap: 16px;
  min-height: 42px;
  padding: 10px 2px;
  border-bottom: 1px solid var(--cl-line);
}

body.cl-dashboard-redesign-page .domain-flow-payment-modal-wrap .domain-flow-registrant-view-label {
  flex: none;
  width: 104px;
  margin: 0;
  line-height: 20px;
  text-align: right;
}

body.cl-dashboard-redesign-page .domain-flow-payment-modal-wrap .domain-flow-registrant-view-value {
  flex: 1 1 auto;
  min-width: 0;
  font-size: 13px;
  font-weight: 400;
  line-height: 20px;
}

body.cl-dashboard-redesign-page .domain-flow-payment-modal-wrap .domain-flow-payment-fields > .domain-flow-registrant-view-item:first-child .domain-flow-registrant-view-value {
  color: var(--cl-green-text);
  font-weight: 600;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.domain-flow-payment-modal-wrap .modal-default .modal-dialog.domain-flow-payment-modal .modal-footer .close-button-dialog {
  height: 50px !important;
  background: var(--cl-green) !important;
  color: #fff !important;
  font-size: 15px !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.domain-flow-payment-modal-wrap .modal-default .modal-dialog.domain-flow-payment-modal .modal-footer .close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.domain-flow-payment-modal-wrap .modal-default .modal-dialog.domain-flow-payment-modal .modal-footer .close-button-dialog:focus-visible {
  background: var(--cl-green-hover) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.domain-flow-payment-modal-wrap .modal-default .modal-dialog.domain-flow-payment-modal .modal-footer .close-button-dialog:focus-visible {
  outline: 2px solid var(--cl-green) !important;
  outline-offset: 3px;
}

@media (max-width: 991px) {
  body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .domain-flow-registrant-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 767px) {
  body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap > .modal-default {
    padding: 16px 12px !important;
  }

  body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .domain-flow-order-modal .modal-content {
    padding: 32px 20px 20px !important;
  }

  body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .domain-flow-pending-table thead {
    display: none;
  }

  body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .domain-flow-pending-table,
  body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .domain-flow-pending-table tbody {
    display: block;
  }

  body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .domain-flow-pending-table tr {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px 16px;
    padding: 16px 0;
    border-bottom: 1px solid var(--cl-line);
  }

  body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .domain-flow-pending-table td {
    min-width: 0;
    padding: 0;
    border: 0;
  }

  body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .domain-flow-pending-table td::before {
    display: block;
    margin-bottom: 4px;
    color: var(--cl-text-sub);
    font-size: 12px;
    font-weight: 400;
    content: attr(data-label);
  }

  body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .domain-flow-pending-table td:first-child,
  body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .domain-flow-pending-table .domain-flow-pending-empty {
    grid-column: 1 / -1;
  }

  body.cl-dashboard-redesign-page .domain-flow-order-modal-wrap .domain-flow-pending-table td:last-child::before {
    display: none;
  }
}

@media (max-width: 380px) {
  body.cl-dashboard-redesign-page .domain-flow-payment-modal-wrap .domain-flow-registrant-view-item {
    flex-direction: column;
    align-items: stretch;
    gap: 4px;
  }

  body.cl-dashboard-redesign-page .domain-flow-payment-modal-wrap .domain-flow-registrant-view-label {
    width: auto;
    text-align: left;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.cl-dashboard-redesign-page .flat-modal.domain-flow-order-modal-wrap .modal-default .modal-dialog.domain-flow-order-modal .modal-content > .close.close-button-dialog {
    transition: none !important;
  }
}

body.cl-dashboard-redesign-page .modal-default .modal-dialog:is(.domain-flow-disconnect-flat-modal, .domain-flow-no-site-flat-modal, .domain-flow-external-connect-flat-modal) .modal-content {
  padding: 40px 32px 28px !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: 0 24px 60px rgba(20, 24, 32, .18) !important;
}

body.cl-dashboard-redesign-page .modal-default .modal-dialog:is(.domain-flow-disconnect-flat-modal, .domain-flow-no-site-flat-modal, .domain-flow-external-connect-flat-modal) .modal-title {
  margin: 0 0 22px !important;
  color: var(--cl-text) !important;
  font-size: 22px !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .modal-default .modal-dialog:is(.domain-flow-disconnect-flat-modal, .domain-flow-no-site-flat-modal, .domain-flow-external-connect-flat-modal) .modal-body {
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .modal-default .modal-dialog:is(.domain-flow-disconnect-flat-modal, .domain-flow-no-site-flat-modal, .domain-flow-external-connect-flat-modal) .modal-content > .close.close-button-dialog {
  position: absolute !important;
  top: 16px !important;
  right: 16px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub) !important;
  font-size: 0 !important;
  line-height: 1 !important;
  opacity: 1 !important;
  outline: 0 !important;
  overflow: hidden !important;
  transition: color .15s, background .15s, transform .18s cubic-bezier(.34, 1.56, .64, 1) !important;
}

body.cl-dashboard-redesign-page .modal-default .modal-dialog:is(.domain-flow-disconnect-flat-modal, .domain-flow-no-site-flat-modal, .domain-flow-external-connect-flat-modal) .modal-content > .close.close-button-dialog:hover,
body.cl-dashboard-redesign-page .modal-default .modal-dialog:is(.domain-flow-disconnect-flat-modal, .domain-flow-no-site-flat-modal, .domain-flow-external-connect-flat-modal) .modal-content > .close.close-button-dialog:focus {
  background: #f1f2f5 !important;
  color: var(--cl-text) !important;
  outline: 0 !important;
  transform: rotate(90deg) !important;
}

body.cl-dashboard-redesign-page .modal-default .modal-dialog:is(.domain-flow-disconnect-flat-modal, .domain-flow-no-site-flat-modal, .domain-flow-external-connect-flat-modal) .modal-content > .close.close-button-dialog span,
body.cl-dashboard-redesign-page .modal-default .modal-dialog:is(.domain-flow-disconnect-flat-modal, .domain-flow-no-site-flat-modal, .domain-flow-external-connect-flat-modal) .modal-content > .close.close-button-dialog svg {
  display: block !important;
  width: 15px !important;
  height: 15px !important;
  margin: 0 !important;
  fill: currentColor !important;
  stroke: none !important;
}

body.cl-dashboard-redesign-page .modal-default .modal-dialog:is(.domain-flow-disconnect-flat-modal, .domain-flow-no-site-flat-modal, .domain-flow-external-connect-flat-modal) .modal-content > .close.close-button-dialog svg path {
  fill: currentColor !important;
  stroke: none !important;
}

body.cl-dashboard-redesign-page .domain-flow-external-connect-content {
  width: 420px !important;
  max-width: 100% !important;
  margin: 0 auto !important;
}

body.cl-dashboard-redesign-page .domain-flow-external-field + .domain-flow-external-field {
  margin-top: 18px !important;
}

body.cl-dashboard-redesign-page .domain-flow-external-label {
  display: block !important;
  margin: 0 0 8px !important;
  color: var(--cl-text) !important;
  font-size: 13px !important;
  font-weight: 800 !important;
}

body.cl-dashboard-redesign-page .domain-flow-external-select-wrap,
body.cl-dashboard-redesign-page .domain-flow-external-select,
body.cl-dashboard-redesign-page .domain-flow-external-input,
body.cl-dashboard-redesign-page .domain-flow-external-note {
  width: 100% !important;
}

body.cl-dashboard-redesign-page .domain-flow-external-note {
  margin: 8px 0 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 1.5 !important;
}

body.cl-dashboard-redesign-page .modal-default .modal-dialog:is(.domain-flow-disconnect-flat-modal, .domain-flow-no-site-flat-modal, .domain-flow-external-connect-flat-modal) .modal-footer {
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
  width: 300px !important;
  max-width: 100% !important;
  margin: 28px auto 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .modal-default .modal-dialog:is(.domain-flow-disconnect-flat-modal, .domain-flow-no-site-flat-modal, .domain-flow-external-connect-flat-modal) .modal-footer::before,
body.cl-dashboard-redesign-page .modal-default .modal-dialog:is(.domain-flow-disconnect-flat-modal, .domain-flow-no-site-flat-modal, .domain-flow-external-connect-flat-modal) .modal-footer::after {
  display: none !important;
}

body.cl-dashboard-redesign-page .modal-default .modal-dialog:is(.domain-flow-disconnect-flat-modal, .domain-flow-no-site-flat-modal, .domain-flow-external-connect-flat-modal) .modal-footer .btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 46px !important;
  min-height: 46px !important;
  max-height: 46px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  font-family: var(--cl-source-font) !important;
  line-height: 1 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .modal-default .modal-dialog:is(.domain-flow-disconnect-flat-modal, .domain-flow-no-site-flat-modal, .domain-flow-external-connect-flat-modal) .modal-footer .ok-button-dialog {
  background: var(--cl-green) !important;
  border-color: var(--cl-green) !important;
  color: #fff !important;
  font-size: 15px !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page .modal-default .modal-dialog:is(.domain-flow-disconnect-flat-modal, .domain-flow-no-site-flat-modal, .domain-flow-external-connect-flat-modal) .modal-footer .ok-button-dialog:hover,
body.cl-dashboard-redesign-page .modal-default .modal-dialog:is(.domain-flow-disconnect-flat-modal, .domain-flow-no-site-flat-modal, .domain-flow-external-connect-flat-modal) .modal-footer .ok-button-dialog:focus {
  border-color: var(--cl-green-hover) !important;
  background: var(--cl-green-hover) !important;
  color: #fff !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .modal-default .modal-dialog:is(.domain-flow-disconnect-flat-modal, .domain-flow-no-site-flat-modal, .domain-flow-external-connect-flat-modal) .modal-footer .close-button-dialog {
  margin-top: 14px !important;
  background: transparent !important;
  border-color: transparent !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
}

body.cl-dashboard-redesign-page .modal-default .modal-dialog:is(.domain-flow-disconnect-flat-modal, .domain-flow-no-site-flat-modal, .domain-flow-external-connect-flat-modal) .modal-footer .close-button-dialog:hover,
body.cl-dashboard-redesign-page .modal-default .modal-dialog:is(.domain-flow-disconnect-flat-modal, .domain-flow-no-site-flat-modal, .domain-flow-external-connect-flat-modal) .modal-footer .close-button-dialog:focus {
  background: var(--cl-green-soft) !important;
  color: var(--cl-green-text) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.domain-flow-external-connect-flat-modal) {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  z-index: 999999 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.domain-flow-external-connect-flat-modal) > .modal-default {
  position: fixed !important;
  inset: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100vw !important;
  height: 100vh !important;
  margin: 0 !important;
  padding: 24px 16px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  background: rgba(0, 0, 0, .45) !important;
  z-index: 999999 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.domain-flow-external-connect-flat-modal) + .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.domain-flow-external-connect-flat-modal) .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.domain-flow-external-connect-flat-modal) + .modal-backdrop.fade.in,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.domain-flow-external-connect-flat-modal) .modal-backdrop.fade.in {
  background: transparent !important;
  opacity: 0 !important;
  z-index: 999998 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default:has(.modal-dialog.domain-flow-external-connect-flat-modal) > .cl-mobile-btn.close {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.domain-flow-external-connect-flat-modal {
  width: min(560px, calc(100vw - 32px)) !important;
  max-width: min(560px, calc(100vw - 32px)) !important;
  margin: 0 auto !important;
  padding: 0 !important;
  overflow: visible !important;
  text-align: center !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.domain-flow-external-connect-flat-modal .modal-content {
  position: relative !important;
  display: block !important;
  float: none !important;
  width: 100% !important;
  min-height: 0 !important;
  padding: 36px 40px 30px !important;
  overflow: visible !important;
  background: #fff !important;
  border: 0 !important;
  border-radius: 14px !important;
  box-shadow: 0 24px 64px rgba(20, 24, 32, .24) !important;
  box-sizing: border-box !important;
  color: var(--cl-text) !important;
  font-family: var(--cl-source-font) !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  word-break: keep-all !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.domain-flow-external-connect-flat-modal .modal-body {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text-sub) !important;
  font-family: var(--cl-source-font) !important;
  letter-spacing: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.domain-flow-external-connect-flat-modal .modal-title {
  margin: 0 38px 28px !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-family: var(--cl-source-font) !important;
  font-size: 22px !important;
  font-weight: 800 !important;
  line-height: 30px !important;
  letter-spacing: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-connect-content {
  width: 420px !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  color: var(--cl-text) !important;
  font-family: var(--cl-source-font) !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-field {
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-field + .domain-flow-external-field {
  margin-top: 30px !important;
}

body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-label {
  display: block !important;
  margin: 0 0 8px !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.5 !important;
  letter-spacing: 0 !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-select-wrap {
  position: relative !important;
  z-index: 1 !important;
  width: 100% !important;
}

body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-select-wrap.open {
  z-index: 1000001 !important;
}

body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-select,
body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-input {
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  height: 44px !important;
  margin: 0 !important;
  padding: 0 13px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
  color: var(--cl-text) !important;
  font-family: var(--cl-source-font) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 20px !important;
  letter-spacing: 0 !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-select {
  justify-content: space-between !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-input {
  display: block !important;
  line-height: 42px !important;
}

body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-select:hover,
body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-select:focus,
body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-select-wrap.open .domain-flow-external-select,
body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-input:hover,
body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-input:focus {
  border-color: var(--cl-green) !important;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .13) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-input.is-error {
  border-color: var(--cl-danger) !important;
  box-shadow: 0 0 0 3px rgba(229, 72, 77, .12) !important;
}

body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-input::placeholder {
  color: var(--cl-text-muted) !important;
  opacity: 1 !important;
}

body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-select span {
  display: block !important;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-arrow {
  display: none !important;
}

body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-select::after {
  content: "" !important;
  flex: 0 0 auto !important;
  width: 7px !important;
  height: 7px !important;
  margin-left: 12px !important;
  border-right: 1.5px solid currentColor !important;
  border-bottom: 1.5px solid currentColor !important;
  transform: translateY(-2px) rotate(45deg) !important;
  transform-origin: center !important;
}

body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-select-wrap.open .domain-flow-external-select::after {
  transform: translateY(2px) rotate(225deg) !important;
}

body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-select-menu {
  position: absolute !important;
  top: calc(100% + 6px) !important;
  right: 0 !important;
  left: 0 !important;
  z-index: 1000001 !important;
  display: none !important;
  width: 100% !important;
  max-height: 212px !important;
  margin: 0 !important;
  padding: 6px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  box-shadow: 0 12px 24px rgba(20, 24, 32, .14) !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-select-wrap.open .domain-flow-external-select-menu {
  display: block !important;
}

body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-select-option {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  width: 100% !important;
  height: 36px !important;
  margin: 0 !important;
  padding: 0 10px !important;
  overflow: hidden !important;
  background: #fff !important;
  border: 0 !important;
  border-radius: 6px !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
  color: var(--cl-text) !important;
  font-family: var(--cl-source-font) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
  text-align: left !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-select-option:hover,
body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-select-option:focus,
body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-select-option.active {
  background: var(--cl-green-soft) !important;
  color: var(--cl-green-text) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-select-label,
body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-select-option-label {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  width: 100% !important;
  min-width: 0 !important;
}

body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-select-option-label {
  justify-content: flex-start !important;
}

body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-select-text,
body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-select-option-text {
  display: block !important;
  flex: 0 1 auto !important;
  min-width: 0 !important;
  max-width: none !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-site-plan-badge {
  display: inline-flex !important;
  flex: none !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 0 !important;
  height: auto !important;
  margin-left: 0 !important;
  padding: 2px 7px !important;
  border: 0 !important;
  border-radius: 4px !important;
  font-size: 11px !important;
  font-style: normal !important;
  font-weight: 500 !important;
  line-height: 13px !important;
  letter-spacing: .2px !important;
}

body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-site-plan-badge.free,
body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-site-plan-badge.micro,
body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-site-plan-badge.domain-flow-site-plan-badge-free,
body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-site-plan-badge.domain-flow-site-plan-badge-micro {
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  color: var(--cl-text-sub) !important;
}

body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-site-plan-badge.shopping,
body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-site-plan-badge.domain-flow-site-plan-badge-shopping {
  background: #f4778d !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-site-plan-badge.business,
body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-site-plan-badge.domain-flow-site-plan-badge-business {
  background: #3b6fe0 !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-site-plan-badge.basic,
body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-site-plan-badge.domain-flow-site-plan-badge-basic {
  background: #16a34a !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-select-option.is-disabled,
body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-select-option[data-disabled="1"],
body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-select-option[aria-disabled="true"],
body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-select-option.is-disabled:hover,
body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-select-option[data-disabled="1"]:hover,
body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-select-option[aria-disabled="true"]:hover,
body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-select-option.is-disabled:focus,
body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-select-option[data-disabled="1"]:focus,
body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-select-option[aria-disabled="true"]:focus {
  background: #eeeff3 !important;
  color: #d1d3d5 !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .flat-modal.domain-flow-nested-flat-modal {
  z-index: 1000003 !important;
}

body.cl-dashboard-redesign-page .modal-backdrop.domain-flow-nested-flat-backdrop {
  z-index: 1000002 !important;
}

body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-error {
  margin: 6px 0 0 !important;
  color: var(--cl-danger) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 18px !important;
  letter-spacing: 0 !important;
}

body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-note {
  position: relative !important;
  display: block !important;
  width: 420px !important;
  max-width: 100% !important;
  margin: 8px 0 0 !important;
  padding: 0 0 0 12px !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
  letter-spacing: 0 !important;
  text-align: left !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-note::before {
  content: "*" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
}

body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-note span {
  display: block !important;
  min-width: 0 !important;
}

body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-note a,
body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-note a:hover,
body.cl-dashboard-redesign-page .modal-dialog.domain-flow-external-connect-flat-modal .domain-flow-external-note a:focus {
  color: var(--cl-green-text) !important;
  font-weight: 700 !important;
  text-decoration: underline !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.domain-flow-external-connect-flat-modal .modal-footer {
  width: 420px !important;
  max-width: 100% !important;
  margin: 22px auto 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog:is(.domain-flow-disconnect-flat-modal, .domain-flow-no-site-flat-modal, .domain-flow-external-connect-flat-modal) .modal-footer > :is(.close-button-dialog, .cancel-button-dialog, .cancel-btn, .cancel-button, .btn-cancel, .btn-cancel-dialog) {
  margin-top: 14px !important;
  margin-left: 0 !important;
}

/* Source dashboard: domain disconnect modal */
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.domain-flow-disconnect-flat-modal) {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  z-index: 999999 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.domain-flow-disconnect-flat-modal) > .modal-default,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.domain-flow-disconnect-flat-modal) > .modal-default.in,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.domain-flow-disconnect-flat-modal) > .modal-default.show {
  position: fixed !important;
  inset: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100vw !important;
  height: 100vh !important;
  margin: 0 !important;
  padding: 24px 16px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  background: rgba(0, 0, 0, .45) !important;
  z-index: 999999 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.domain-flow-disconnect-flat-modal) + .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.domain-flow-disconnect-flat-modal) .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.domain-flow-disconnect-flat-modal) + .modal-backdrop.fade.in,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.domain-flow-disconnect-flat-modal) .modal-backdrop.fade.in {
  background: transparent !important;
  opacity: 0 !important;
  z-index: 999998 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default:has(.modal-dialog.domain-flow-disconnect-flat-modal) > .cl-mobile-btn.close {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.domain-flow-disconnect-flat-modal {
  width: min(420px, calc(100vw - 32px)) !important;
  max-width: min(420px, calc(100vw - 32px)) !important;
  margin: 0 auto !important;
  padding: 0 !important;
  overflow: visible !important;
  text-align: center !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default.in .modal-dialog.domain-flow-disconnect-flat-modal,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default.fade .modal-dialog.domain-flow-disconnect-flat-modal,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default.show .modal-dialog.domain-flow-disconnect-flat-modal {
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.domain-flow-disconnect-flat-modal .modal-content {
  position: relative !important;
  display: block !important;
  float: none !important;
  width: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 36px 40px 30px !important;
  overflow: visible !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 14px !important;
  box-shadow: 0 24px 64px rgba(20, 24, 32, .26) !important;
  box-sizing: border-box !important;
  color: var(--cl-text) !important;
  font-family: var(--cl-source-font) !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  word-break: keep-all !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.domain-flow-disconnect-flat-modal .modal-body {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  color: var(--cl-text-sub) !important;
  font-family: var(--cl-source-font) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 22px !important;
  letter-spacing: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.domain-flow-disconnect-flat-modal .modal-title {
  margin: 0 34px 18px !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-family: var(--cl-source-font) !important;
  font-size: 22px !important;
  font-weight: 800 !important;
  line-height: 30px !important;
  letter-spacing: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.domain-flow-disconnect-flat-modal .modal-content > .close.close-button-dialog {
  top: 16px !important;
  right: 16px !important;
  width: 30px !important;
  height: 30px !important;
  border-radius: 8px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.domain-flow-disconnect-flat-modal .modal-content > .close.close-button-dialog span,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.domain-flow-disconnect-flat-modal .modal-content > .close.close-button-dialog svg {
  width: 10px !important;
  height: 10px !important;
}

body.cl-dashboard-redesign-page .modal-dialog.domain-flow-disconnect-flat-modal .domain-flow-disconnect-content {
  width: 100% !important;
  margin: 0 auto !important;
  color: var(--cl-text-sub) !important;
  font-family: var(--cl-source-font) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 22px !important;
  letter-spacing: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .modal-dialog.domain-flow-disconnect-flat-modal .domain-flow-disconnect-question {
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  line-height: inherit !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.domain-flow-disconnect-flat-modal .modal-footer {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  width: 100% !important;
  max-width: none !important;
  margin: 28px auto 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  gap: 12px !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.domain-flow-disconnect-flat-modal .modal-footer > .btn {
  float: none !important;
  width: 100% !important;
  height: 46px !important;
  min-height: 46px !important;
  max-height: 46px !important;
  margin: 0 !important;
  border-radius: 8px !important;
  font-size: 14px !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.domain-flow-disconnect-flat-modal .modal-footer > .ok-button-dialog {
  order: 1 !important;
  background: var(--cl-danger) !important;
  border: 1px solid var(--cl-danger) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.domain-flow-disconnect-flat-modal .modal-footer > .ok-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.domain-flow-disconnect-flat-modal .modal-footer > .ok-button-dialog:focus {
  background: #d63f44 !important;
  border-color: #d63f44 !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.domain-flow-disconnect-flat-modal .modal-footer > .close-button-dialog {
  order: 2 !important;
  height: 40px !important;
  min-height: 40px !important;
  max-height: 40px !important;
  margin: 0 !important;
  background: transparent !important;
  border: 0 !important;
  color: var(--cl-text-sub) !important;
  font-weight: 500 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.domain-flow-disconnect-flat-modal .modal-footer > .close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.domain-flow-disconnect-flat-modal .modal-footer > .close-button-dialog:focus {
  background: var(--cl-danger-soft) !important;
  color: var(--cl-danger) !important;
}

body.cl-dashboard-redesign-page .domain-flow-toast {
  position: fixed !important;
  right: auto !important;
  bottom: 60px !important;
  left: 50% !important;
  z-index: 10004 !important;
  align-items: center !important;
  width: max-content !important;
  min-width: 0 !important;
  max-width: calc(100vw - 40px) !important;
  min-height: 50px !important;
  height: auto !important;
  padding: 14px 16px !important;
  background: rgba(34, 36, 40, .85) !important;
  border-radius: 12px !important;
  box-shadow: 0 8px 16px rgba(0, 0, 0, .1) !important;
  color: #fff !important;
  box-sizing: border-box !important;
  transform: translateX(-50%) !important;
}

body.cl-dashboard-redesign-page .domain-flow-toast-icon {
  flex: 0 0 auto !important;
  width: 16px !important;
  height: 16px !important;
  margin-right: 10px !important;
}

body.cl-dashboard-redesign-page .domain-flow-toast-icon svg {
  display: block !important;
  width: 16px !important;
  height: 16px !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .domain-flow-toast-icon svg path {
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .domain-flow-toast.is-error .domain-flow-toast-icon {
  color: #ee445f !important;
}

body.cl-dashboard-redesign-page .domain-flow-toast.is-success .domain-flow-toast-icon {
  color: var(--cl-green) !important;
}

body.cl-dashboard-redesign-page #domain-flow-toast-text {
  display: block !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  max-width: calc(100vw - 98px) !important;
  color: #fff !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  line-height: 1.5 !important;
  white-space: nowrap !important;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-tab-panel.domain-flow-setting-panel {
    padding: 20px 20px 30px 20px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-site-control {
    display: grid !important;
    grid-template-columns: 68px minmax(0, 1fr) !important;
    column-gap: 16px !important;
    width: 100% !important;
    max-width: 314px !important;
    min-width: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-setting-select-wrap,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-setting-select-btn,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-setting-select-menu {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-dns-connect-notice {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-dns-connect-notice-text br {
    display: none !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-setting-grid {
    grid-template-columns: minmax(280px, 314px) minmax(0, 1fr) !important;
    column-gap: 30px !important;
    justify-content: normal !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-setting-col {
    min-width: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-ns-col,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-dns-col {
    width: auto !important;
    min-width: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-dns-col {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-dns-add,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-dns-head,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-dns-list {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-dns-record-section,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-dns-list li,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-setting-note,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-setting-footer {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    margin-top: 35px;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-dns-head,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-dns-list li.domain-flow-dns-read-row,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-dns-list li.domain-flow-dns-edit-row {
    grid-template-columns: minmax(80px, 100px) minmax(80px, 100px) minmax(0, 1fr) !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-dns-list li.domain-flow-dns-saved-editable-row {
    grid-template-columns: minmax(80px, 100px) 8px minmax(80px, 100px) 8px minmax(0, 1fr) 4px 36px 4px 36px !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-dns-value-zone {
    grid-template-columns: minmax(0, 1fr) 36px !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-dns-value-control {
    width: 100% !important;
    max-width: 100% !important;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1337px) {
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-setting-top,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-top,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-setting-grid,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-setting-top,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-top {
    row-gap: 20px;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-setting-top > *,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-top > * {
    grid-column: 1;
  }
}

@media only screen and (min-width: 1338px) {
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-setting-top,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-setting-grid,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-top,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 332px) minmax(0, 1fr) !important;
    gap: 0 60px !important;
    justify-content: normal !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-top > *:first-child,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-grid > *:first-child {
    width: 100% !important;
    max-width: 352px !important;
    min-width: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-top > *:last-child,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-grid > *:last-child {
    min-width: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-ns-order {
    width: 50px !important;
    max-width: 50px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-panel.is-setting-site-changed .domain-flow-setting-top {
    grid-template-columns: minmax(0, 332px) 60px minmax(0, 1fr) 40px 74px !important;
    column-gap: 0 !important;
    gap: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-panel.is-setting-site-changed .domain-flow-dns-connect-notice {
    grid-column: 3 !important;
    justify-self: stretch !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-panel.is-setting-site-changed .domain-flow-dns-connect-notice-text {
    width: 100% !important;
    max-width: 100% !important;
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: anywhere !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-panel.is-setting-site-changed .domain-flow-setting-save {
    position: static !important;
    grid-column: 5 !important;
    justify-self: start !important;
    align-self: center !important;
    margin: 0 !important;
  }
}

@media only screen and (min-width: 1478px) {
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-dns-connect-notice {
    max-width: 482px;
  }
}

@media only screen and (min-width: 1338px) and (max-width: 1477px) {
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-dns-connect-notice {
    max-width: 346px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1337px) {
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-panel.is-setting-site-changed .domain-flow-setting-top {
    grid-template-columns: minmax(0, 1fr) 40px 74px !important;
    column-gap: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-panel.is-setting-site-changed .domain-flow-site-control {
    grid-column: 1 / -1 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-panel.is-setting-site-changed .domain-flow-dns-connect-notice {
    grid-column: 1 !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-panel.is-setting-site-changed .domain-flow-setting-save {
    position: static !important;
    grid-column: 3 !important;
    justify-self: start !important;
    align-self: center !important;
    margin: 0 !important;
  }
}

@media only screen and (max-width: 991px) {
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-head,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-site-row,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-top {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-top,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-connect-notice {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    gap: 32px 3px !important;
    box-sizing: border-box !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-panel.is-setting-site-changed .domain-flow-setting-save {
    position: static !important;
    margin-top: 28px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-connect-notice-text br {
    display: none !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-buy-wrap,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-buy-btn,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-gray-btn {
    width: 100% !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-table-head {
    display: none !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-summary-row {
    display: block !important;
    min-width: 0 !important;
    min-height: 0 !important;
    padding: 16px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-summary-row > span:not(.domain-flow-primary-action) {
    display: block;
    min-height: 0;
    padding: 4px 0;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-primary-action {
    justify-content: var(--domain-flow-primary-action-justify, flex-start) !important;
    min-height: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-action {
    justify-content: flex-start;
    margin-top: 8px;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-grid,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-grid {
    grid-template-columns: 1fr !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-body .domain-flow-dns-col,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-body .domain-flow-dns-record-section,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-body .domain-flow-dns-add,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-body .domain-flow-dns-head,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-body .domain-flow-dns-list,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-body .domain-flow-dns-list li,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-body .domain-flow-setting-note,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-body .domain-flow-setting-footer {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-body .domain-flow-dns-head,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-body .domain-flow-dns-list li.domain-flow-dns-read-row,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-body .domain-flow-dns-list li.domain-flow-dns-edit-row {
    grid-template-columns: minmax(62px, 84px) minmax(62px, 84px) minmax(0, 1fr) !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-body .domain-flow-dns-list li.domain-flow-dns-saved-editable-row {
    grid-template-columns: minmax(62px, 84px) 6px minmax(62px, 84px) 6px minmax(0, 1fr) 4px 32px 4px 32px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-body .domain-flow-dns-value-zone {
    grid-template-columns: minmax(0, 1fr) 36px !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-body .domain-flow-dns-value-control {
    width: 100% !important;
    max-width: 100% !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-registrant-grid {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-site-select-text {
    max-width: calc(100vw - 80px) !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-connected-layout {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    width: 100% !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-connected-layout .domain-connected-box {
    flex: 1 1 100% !important;
    width: 100% !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-guide-card {
    position: static !important;
    flex: 1 1 100% !important;
    width: 100% !important;
    max-width: 100% !important;
  }
}

@media (max-width: 640px) {
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .breadcrumb.cl-source-domain-breadcrumb,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-head h1,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-site-select {
    font-size: 17px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-box .sub-content,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-tab-panel {
    padding: 18px 14px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-detail-tab {
    flex: 1 1 auto !important;
    height: 40px !important;
    min-height: 40px !important;
    padding: 0 10px !important;
    border-radius: 0 8px 0 0 !important;
    font-size: 13px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-registrant-panel {
    padding: 24px 24px 28px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-registrant-field {
    grid-template-columns: 1fr !important;
    align-items: stretch !important;
    gap: 5px !important;
    padding: 11px 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-registrant-address {
    grid-template-columns: minmax(0, 1fr) 120px !important;
  }

  body.cl-dashboard-redesign-page .domain-flow-toast {
    bottom: 128px !important;
    left: 50% !important;
    width: max-content !important;
    max-width: calc(100vw - 28px) !important;
    transform: translateX(-50%) !important;
  }
}

/* Domain flow responsive width guards */
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-connected-layout {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-connected-layout .domain-connected-box,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-box,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-owned-box {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-table-head,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-summary-row,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-table-head,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-summary-row {
    width: 100% !important;
    min-width: 0 !important;
    grid-template-columns: var(--domain-flow-table-columns);
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-table-head span,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-summary-row > span,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-primary-action,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-default-primary-action {
    min-width: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-table-head span:nth-child(6),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-summary-row > span:nth-child(6) {
    padding-right: 8px !important;
    padding-left: 8px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-primary-set-btn {
    width: var(--domain-flow-primary-responsive-width, auto);
    min-width: var(--domain-flow-primary-min-width, 132px);
    max-width: var(--domain-flow-primary-max-width, 140px);
    padding-right: var(--domain-flow-primary-padding-x, 10px);
    padding-left: var(--domain-flow-primary-padding-x, 10px);
    font-size: var(--domain-flow-primary-font-size, 12px);
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-status-dot,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-status-pending-icon {
    margin-right: 6px !important;
  }
}

@media only screen and (min-width: 992px) {
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-summary-row > span:nth-child(-n+5),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-summary-row > span:nth-child(-n+5) {
    overflow: hidden;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-summary-row > span:nth-child(6) {
    padding-right: 8px !important;
    padding-left: 8px !important;
    overflow: visible !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-primary-set-btn {
    box-sizing: border-box !important;
    max-width: 100% !important;
    white-space: nowrap !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-expire {
    width: 100%;
    max-width: 100%;
    white-space: var(--domain-flow-expire-white-space, normal);
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-expire-value {
    width: var(--domain-flow-expire-value-width, 100%) !important;
    max-width: 100% !important;
    white-space: var(--domain-flow-expire-white-space, normal) !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-expire-value {
    flex-wrap: var(--domain-flow-expire-value-wrap, wrap) !important;
    gap: 2px 8px !important;
    line-height: 1.35 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-expire-text {
    flex: var(--domain-flow-expire-text-flex, 0 1 auto) !important;
    display: inline !important;
    min-width: 0 !important;
    max-width: var(--domain-flow-expire-text-max-width, 100%) !important;
    white-space: var(--domain-flow-expire-text-white-space, normal) !important;
    word-break: keep-all !important;
    overflow-wrap: var(--domain-flow-expire-text-overflow-wrap, break-word) !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-renew-link {
    flex: none !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-connected-site,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-connected-site-text {
    display: block !important;
    max-width: 100% !important;
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: normal !important;
    word-break: break-word !important;
    overflow-wrap: anywhere !important;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1337px) {
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-table-head,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-summary-row,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-table-head,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-summary-row {
    grid-template-columns: var(--domain-flow-table-columns);
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-table-head span,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-summary-row > span {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-domain,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-expire,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-expire-value,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-status-list {
    max-width: 100%;
    min-width: 0;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-summary-row > span:nth-child(6) {
    width: 52px !important;
    max-width: 52px !important;
    min-width: 0 !important;
    justify-content: center !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row {
    --domain-flow-table-columns: 70px minmax(0, 1fr) max-content 52px;
    --domain-flow-summary-cell-padding: 0;
    --domain-flow-status-direction: row;
    --domain-flow-status-gap: 8px 20px;
    --domain-flow-connected-primary-column: 1 / 4;
    --domain-flow-connected-primary-row: 3;
    --domain-flow-connected-status-column: 3;
    --domain-flow-connected-status-row: 1;
    --domain-flow-connected-action-column: 4;
    --domain-flow-connected-action-row: 1 / 4;
    min-height: 0;
    padding: 20px;
    column-gap: 14px;
    row-gap: 8px;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(1) {
    grid-column: 1 / 3;
    grid-row: 1;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(2),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(3) {
    --domain-flow-summary-cell-display: grid;
    --domain-flow-summary-cell-align: center;
    --domain-flow-expire-display: grid;
    --domain-flow-expire-white-space: nowrap;
    --domain-flow-expire-value-width: max-content;
    --domain-flow-expire-value-wrap: nowrap;
    --domain-flow-expire-text-flex: none;
    --domain-flow-expire-text-max-width: max-content;
    --domain-flow-expire-text-white-space: nowrap;
    --domain-flow-expire-text-overflow-wrap: normal;
    grid-template-columns: minmax(0, 70px) minmax(0, 1fr);
    column-gap: 12px;
    justify-items: start;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(2)::before,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(3)::before {
    display: block;
    width: 100%;
    max-width: 70px;
    min-width: 0;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(3) .domain-flow-expire-value {
    --domain-flow-expire-display: inline-flex;
    justify-self: start;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(3) .domain-flow-expire {
    width: auto !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(2) {
    grid-column: 1 / 3;
    grid-row: 2;
    margin-top: 8px;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(2)::before {
    content: "구매처";
    color: var(--cl-text-muted);
    font-weight: 500;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(3) {
    grid-column: 1 / 3;
    grid-row: 3;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(3)::before {
    content: "만기일";
    color: var(--cl-text-muted);
    font-weight: 500;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(4) {
    --domain-flow-primary-action-justify: flex-end;
    --domain-flow-primary-action-min-height: 0;
    width: auto !important;
    max-width: max-content !important;
    padding: 0 !important;
    justify-self: end;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(4) .domain-flow-primary-set-btn {
    --domain-flow-control-min-width: 0;
    --domain-flow-control-height: auto;
    --domain-flow-control-padding: 0;
    --domain-flow-control-background: transparent;
    --domain-flow-control-border: 0;
    --domain-flow-control-radius: 0;
    --domain-flow-control-hover-background: transparent;
    --domain-flow-control-hover-border-color: transparent;
    --domain-flow-control-hover-color: var(--cl-green-text);
    --domain-flow-primary-responsive-width: auto;
    --domain-flow-primary-min-width: 0;
    --domain-flow-primary-max-width: none;
    --domain-flow-primary-height: auto;
    --domain-flow-primary-padding-x: 0;
    --domain-flow-primary-border-color: transparent;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(5) {
    justify-self: end;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(6) {
    align-self: center;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row {
    --domain-flow-table-columns: 70px minmax(0, 1fr) max-content 52px;
    --domain-flow-summary-cell-padding: 0;
    --domain-flow-status-direction: row;
    --domain-flow-status-gap: 8px 20px;
    min-height: 0;
    padding: 20px;
    column-gap: 14px;
    row-gap: 8px;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(1) {
    grid-column: 1 / 3;
    grid-row: 1;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(2),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(3),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(4) {
    --domain-flow-summary-cell-display: grid;
    --domain-flow-summary-cell-align: center;
    --domain-flow-expire-display: grid;
    --domain-flow-expire-white-space: nowrap;
    --domain-flow-expire-value-width: max-content;
    --domain-flow-expire-value-wrap: nowrap;
    --domain-flow-expire-text-flex: none;
    --domain-flow-expire-text-max-width: max-content;
    --domain-flow-expire-text-white-space: nowrap;
    --domain-flow-expire-text-overflow-wrap: normal;
    grid-template-columns: minmax(0, 70px) minmax(0, 1fr);
    column-gap: 12px;
    justify-items: start;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(2)::before,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(3)::before,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(4)::before {
    display: block;
    width: 100%;
    max-width: 70px;
    min-width: 0;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(3) .domain-flow-expire-value {
    --domain-flow-expire-display: inline-flex;
    justify-self: start;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(3) .domain-flow-expire {
    width: auto !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(2) {
    grid-column: 1 / 3;
    grid-row: 2;
    margin-top: 8px;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(2)::before {
    content: "구매처";
    color: var(--cl-text-muted);
    font-weight: 500;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(3) {
    grid-column: 1 / 3;
    grid-row: 4;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(3)::before {
    content: "만기일";
    color: var(--cl-text-muted);
    font-weight: 500;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(4) {
    grid-column: 1 / 3;
    grid-row: 3;
    display: grid !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    justify-content: flex-start;
    justify-self: stretch;
    min-width: 0;
    text-align: left;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(4)::before {
    content: "연결 사이트";
    color: var(--cl-text-muted);
    font-weight: 500;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(5) {
    grid-column: 3;
    grid-row: 1;
    justify-self: end;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(6) {
    grid-column: 4;
    grid-row: 1 / 5;
    align-self: center;
  }
}

@media only screen and (max-width: 1377px) {
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item:first-child .domain-flow-summary-row,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item:first-child .domain-flow-summary-row {
    border-top: 1px solid var(--cl-line) !important;
  }
}

@media only screen and (max-width: 1337px) {
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-table-head {
    display: none !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-box .sub-content,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-box.domain-owned-box .sub-content {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-site-row,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-section-title {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row {
    row-gap: 8px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(4) {
    justify-content: flex-end;
    text-align: right;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(4) .domain-flow-primary-set-btn {
    --cl-green: #02b351;
    --domain-flow-control-background: transparent;
    --domain-flow-control-border: 0;
    --domain-flow-control-hover-background: transparent;
    --domain-flow-control-hover-border-color: transparent;
    --domain-flow-control-hover-color: var(--cl-green-text);
    --domain-flow-primary-border-color: transparent;
    --domain-flow-primary-font-size: 14px;
    margin-left: auto;
  }
}

@media only screen and (max-width: 991px) {
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .breadcrumb,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-head,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-connected-layout,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-connected-layout .domain-connected-box,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-box,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-owned-box,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-box .sub-content,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-list,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-section,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .user-domain-wrap,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .list-item,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .list-item > li,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .list-item > li > div,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-tab-panel,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-grid,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-col,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-ns-col,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-col,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-record-section,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-add,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-head,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-note,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-footer {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .user-domain-wrap {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-table-head,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-summary-row {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-summary-row > span,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-domain,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-expire,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-connected-site,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-primary-action,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-action,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-status-list {
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-detail-tabs {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    overflow-x: auto !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-read-row,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-edit-row,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-empty-row {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-read-value,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-read-name,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-read-type,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-read-ttl {
    min-width: 0 !important;
    max-width: 100% !important;
    overflow-wrap: anywhere !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-expire {
    width: 100% !important;
    max-width: 100% !important;
    white-space: var(--domain-flow-expire-white-space, normal) !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-expire-value {
    width: var(--domain-flow-expire-value-width, 100%) !important;
    max-width: 100% !important;
    white-space: var(--domain-flow-expire-white-space, normal) !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-expire-value {
    flex-wrap: var(--domain-flow-expire-value-wrap, wrap) !important;
    gap: 2px 8px !important;
    line-height: 1.35 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-expire-text {
    flex: var(--domain-flow-expire-text-flex, 0 1 auto) !important;
    display: inline !important;
    min-width: 0 !important;
    max-width: var(--domain-flow-expire-text-max-width, 100%) !important;
    white-space: var(--domain-flow-expire-text-white-space, normal) !important;
    word-break: keep-all !important;
    overflow-wrap: var(--domain-flow-expire-text-overflow-wrap, break-word) !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-connected-site {
    display: var(--domain-flow-connected-site-display, block) !important;
    white-space: normal !important;
    word-break: break-word !important;
    overflow-wrap: anywhere !important;
  }
}

@media (max-width: 991px) {
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .content-box.domain-flow-box.domain-connected-box,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .content-box.domain-flow-box.domain-owned-box {
    border: none !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .content-box.domain-flow-box.domain-connected-box .sub-content,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .content-box.domain-flow-box.domain-owned-box .sub-content {
    padding: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .content-box.domain-flow-box.domain-owned-box .sub-content {
    padding-top: 32px !important;
    padding-bottom: 32px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-site-row {
    padding: 20px 20px 0 20px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-section-title {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-connected-item .domain-flow-summary-row {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 21px 0 24px !important;
    background-color: #fff !important;
    box-sizing: border-box !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body {
    width: 100%;
    max-width: 100%;
    padding: 16px 0 0 0;
    background: #f4f5f9;
    border: 0;
    border-bottom: 0;
    box-shadow: none;
    box-sizing: border-box;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-detail-tabs {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    background: #f4f5f9 !important;
    box-sizing: border-box !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-tab-panel,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-setting-panel {
    width: 100% !important;
    max-width: 100% !important;
    padding: 20px !important;
    background: #fff !important;
    border: 0 !important;
    box-sizing: border-box !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-panel.is-setting-site-changed .domain-flow-setting-save {
    position: static !important;
    display: flex !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    z-index: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 20px 0 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-panel.is-setting-site-changed .domain-flow-setting-save.is-setting-save-fixed {
    position: fixed !important;
    left: var(--domain-flow-setting-save-left, 20px) !important;
    right: auto !important;
    bottom: 24px !important;
    z-index: 240 !important;
    width: var(--domain-flow-setting-save-width, calc(100vw - 40px)) !important;
    max-width: calc(100vw - 40px) !important;
    margin: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-panel .domain-flow-setting-footer {
    position: absolute !important;
    top: 20px !important;
    right: 20px !important;
    z-index: 60 !important;
    justify-content: flex-end !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: calc(100% - 40px) !important;
    margin: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-panel:has(.domain-flow-disconnect-btn) > .domain-flow-registration-failed-note {
    margin-top: 44px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-panel .domain-flow-disconnect-btn,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-panel .domain-flow-disconnect-btn:hover,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-panel .domain-flow-disconnect-btn:focus,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-payment-panel .domain-flow-payment-cancel,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-panel .domain-flow-external-delete-btn,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-panel .domain-flow-external-delete-btn:hover,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-panel .domain-flow-external-delete-btn:focus {
    --domain-flow-disconnect-width: auto;
    --domain-flow-disconnect-min-width: 0;
    --domain-flow-disconnect-height: auto;
    --domain-flow-disconnect-min-height: 0;
    --domain-flow-disconnect-max-height: none;
    --domain-flow-disconnect-padding: 0;
    --domain-flow-disconnect-background: transparent;
    --domain-flow-disconnect-border: 0;
    --domain-flow-disconnect-radius: 0;
    --domain-flow-disconnect-color: var(--cl-danger);
    --domain-flow-disconnect-font-size: 15px;
    --domain-flow-disconnect-font-weight: 600;
    --domain-flow-disconnect-line-height: 1.5;
    --domain-flow-disconnect-text-decoration: underline;
    --domain-flow-disconnect-text-underline-offset: 3px;
    --domain-flow-disconnect-hover-background: transparent;
    --domain-flow-disconnect-hover-border-color: transparent;
    --domain-flow-disconnect-hover-color: var(--cl-danger);
    width: auto;
    min-width: 0;
    height: auto;
    min-height: 0;
    max-height: none;
    padding: 0;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    color: var(--cl-danger);
    font-size: 15px;
    font-weight: 600;
    line-height: 1.5;
    text-decoration: underline;
    text-underline-offset: 3px;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-panel .domain-flow-external-delete-btn {
    margin-left: 12px;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-panel .domain-flow-disconnect-btn:is(.is-disabled, [disabled]),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-panel .domain-flow-external-delete-btn:is(.is-disabled, [disabled]) {
    color: var(--cl-text-muted) !important;
    cursor: default !important;
    background-color: #fff !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-panel:has(.domain-flow-disconnect-btn) .domain-flow-setting-top {
    margin-top: 44px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-edit-mode .domain-flow-dns-save-wrap {
    position: static !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    z-index: auto !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 19px 0 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-edit-mode .domain-flow-dns-save-wrap.is-dns-save-fixed {
    min-height: 40px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-edit-mode .domain-flow-dns-save-wrap.is-dns-save-fixed .domain-flow-dns-save {
    position: fixed !important;
    left: var(--domain-flow-dns-save-left, 20px) !important;
    right: auto !important;
    bottom: 24px !important;
    z-index: 240 !important;
    width: var(--domain-flow-dns-save-width, calc(100vw - 40px)) !important;
    max-width: calc(100vw - 40px) !important;
    box-shadow: 0 10px 24px rgba(15, 23, 42, .16) !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-edit-mode .domain-flow-dns-save {
    display: flex !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: 40px !important;
    min-height: 40px !important;
    max-height: 40px !important;
    background: #03C75A !important;
    border: 0 !important;
    border-radius: 5px !important;
    box-shadow: none !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-edit-mode .domain-flow-dns-save:hover,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-edit-mode .domain-flow-dns-save:focus {
    background: #0f9d50 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-top {
    margin-bottom: 17px !important;
    padding-top: 0 !important;
    padding-left: 0 !important;
    padding-bottom: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-col h3 {
    padding-left: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-site-control {
    flex-direction: column !important;
    align-items: stretch !important;
    width: 100% !important;
    gap: 8px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-site-control label {
    flex: none !important;
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-select-wrap,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-select-btn,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-setting-select-menu,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-type-btn,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-external-select {
    width: 100% !important;
    max-width: 100% !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-ns-guide strong {
    padding-left: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-ns-guide div,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-ns-guide a {
    padding: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-col {
    margin-top: 32px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-connected-item .domain-flow-summary-row {
    padding: 21px 14px 24px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-connected-item .domain-flow-summary-row > span {
    position: static;
    width: var(--domain-flow-mobile-cell-width, 100%);
    max-width: var(--domain-flow-mobile-cell-max-width, 100%);
    min-width: 0;
    min-height: 18px;
    padding: 0;
    box-sizing: border-box;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(1),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(1) {
    order: 1 !important;
    display: block !important;
    width: calc(100% - 66px) !important;
    max-width: calc(100% - 66px) !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(2),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(3),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(2),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(3) {
    display: grid !important;
    grid-template-columns: 70px minmax(0, 1fr) !important;
    column-gap: 12px !important;
    width: calc(100% - 30px) !important;
    max-width: calc(100% - 30px) !important;
    min-width: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(2),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(2) {
    order: 3 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(2)::before {
    content: "구매처";
    color: var(--cl-text-muted);
    font-weight: 500;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(2)::before {
    content: "구매처";
    color: var(--cl-text-muted);
    font-weight: 500;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(3),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(3) {
    order: 4 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(3)::before {
    content: "만기일";
    color: var(--cl-text-muted);
    font-weight: 500;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(3)::before {
    content: "만기일";
    color: var(--cl-text-muted);
    font-weight: 500;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(4),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(4) {
    order: 5;
    display: flex;
    justify-content: flex-end;
    align-self: flex-end;
    width: auto;
    max-width: 100%;
    min-width: 0;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(5),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(5) {
    order: 2 !important;
    width: calc(100% - 81px) !important;
    max-width: calc(100% - 81px) !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(6),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(6) {
    right: 14px;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(6),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(6) {
    position: absolute;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    min-width: 36px;
    max-width: 36px;
    padding: 0;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-ns-list li {
    grid-template-columns: 40px minmax(0, 1fr) 32px !important;
    column-gap: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-ns-order {
    max-width: 40px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-ns-value {
    grid-column: 2 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-ns-list .domain-flow-copy-wrap {
    grid-column: 3 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-expire-value,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-connected-site-text,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-status-list {
    max-width: 100% !important;
    min-width: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-expire-value {
    flex-wrap: var(--domain-flow-expire-value-wrap, wrap) !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-status-list {
    display: inline-flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    gap: 8px 16px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(4) .domain-flow-primary-set-btn {
    --domain-flow-control-min-width: 0;
    --domain-flow-control-height: auto;
    --domain-flow-control-padding: 0;
    --domain-flow-control-background: transparent;
    --domain-flow-control-border: 0;
    --domain-flow-control-radius: 0;
    --domain-flow-control-hover-background: transparent;
    --domain-flow-control-hover-border-color: transparent;
    --domain-flow-control-hover-color: var(--cl-green-text);
    --domain-flow-primary-min-width: 0;
    --domain-flow-primary-height: auto;
    --domain-flow-primary-border-color: transparent;
    width: auto;
    max-width: none;
    min-width: 0;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-read-row,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-edit-row,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-empty-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }
}

@media only screen and (max-width: 992px) {
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row {
    --domain-flow-table-columns: 70px minmax(0, 1fr) 36px;
    --domain-flow-summary-cell-padding: 0;
    --domain-flow-status-direction: row;
    --domain-flow-status-gap: 8px 16px;
    --domain-flow-connected-primary-column: 1 / 4;
    --domain-flow-connected-primary-row: 5;
    --domain-flow-connected-status-column: 1 / 4;
    --domain-flow-connected-status-row: 2;
    --domain-flow-connected-action-column: 3;
    --domain-flow-connected-action-row: 1;
    min-height: 0;
    padding: 21px 14px 24px;
    column-gap: 12px;
    row-gap: 8px;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(1) {
    grid-column: 1 / 3;
    grid-row: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(2),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(3) {
    --domain-flow-summary-cell-display: grid;
    --domain-flow-summary-cell-align: center;
    --domain-flow-expire-white-space: nowrap;
    --domain-flow-expire-value-width: max-content;
    --domain-flow-expire-value-wrap: nowrap;
    --domain-flow-expire-text-flex: none;
    --domain-flow-expire-text-max-width: max-content;
    --domain-flow-expire-text-white-space: nowrap;
    --domain-flow-expire-text-overflow-wrap: normal;
    grid-template-columns: 70px minmax(0, 1fr);
    column-gap: 12px;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(2) {
    grid-column: 1 / 4;
    grid-row: 3;
    margin-top: 0;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(2)::before {
    content: "구매처";
    color: var(--cl-text-muted);
    font-weight: 500;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(3) {
    grid-column: 1 / 4;
    grid-row: 4;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(3) .domain-flow-expire-value {
    --domain-flow-expire-display: inline-flex;
    justify-self: start;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(3)::before {
    content: "만기일";
    color: var(--cl-text-muted);
    font-weight: 500;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(4) {
    --domain-flow-primary-action-justify: flex-end;
    --domain-flow-primary-action-min-height: 0;
    justify-self: end;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(4) .domain-flow-primary-set-btn {
    --domain-flow-control-min-width: 0;
    --domain-flow-control-height: auto;
    --domain-flow-control-padding: 0;
    --domain-flow-control-background: transparent;
    --domain-flow-control-border: 0;
    --domain-flow-control-radius: 0;
    --domain-flow-control-hover-background: transparent;
    --domain-flow-control-hover-border-color: transparent;
    --domain-flow-control-hover-color: var(--cl-green-text);
    --domain-flow-primary-responsive-width: auto;
    --domain-flow-primary-min-width: 0;
    --domain-flow-primary-max-width: none;
    --domain-flow-primary-height: auto;
    --domain-flow-primary-padding-x: 0;
    --domain-flow-primary-border-color: transparent;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(5) {
    justify-self: start;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(6) {
    align-self: start;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row {
    --domain-flow-table-columns: 70px minmax(0, 1fr) 36px;
    --domain-flow-summary-cell-padding: 0;
    --domain-flow-status-direction: row;
    --domain-flow-status-gap: 8px 16px;
    min-height: 0;
    padding: 21px 14px 24px;
    column-gap: 12px;
    row-gap: 8px;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(1) {
    grid-column: 1 / 3;
    grid-row: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(2),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(3) {
    --domain-flow-summary-cell-display: grid;
    --domain-flow-summary-cell-align: center;
    --domain-flow-expire-white-space: nowrap;
    --domain-flow-expire-value-width: max-content;
    --domain-flow-expire-value-wrap: nowrap;
    --domain-flow-expire-text-flex: none;
    --domain-flow-expire-text-max-width: max-content;
    --domain-flow-expire-text-white-space: nowrap;
    --domain-flow-expire-text-overflow-wrap: normal;
    grid-template-columns: 70px minmax(0, 1fr);
    column-gap: 12px;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(2) {
    grid-column: 1 / 4;
    grid-row: 3;
    margin-top: 0;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(2)::before {
    content: "구매처";
    color: var(--cl-text-muted);
    font-weight: 500;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(3) {
    grid-column: 1 / 4;
    grid-row: 4;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(3) .domain-flow-expire-value {
    --domain-flow-expire-display: inline-flex;
    justify-self: start;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(3)::before {
    content: "만기일";
    color: var(--cl-text-muted);
    font-weight: 500;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(4) {
    grid-column: 1 / 4;
    grid-row: 5;
    justify-content: flex-end;
    justify-self: end;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(5) {
    grid-column: 1 / 4;
    grid-row: 2;
    justify-self: start;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(6) {
    grid-column: 3;
    grid-row: 1;
    align-self: start;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row {
    display: grid !important;
    grid-template-columns: var(--domain-flow-table-columns) !important;
    align-items: start !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(6),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(6) {
    position: static;
    right: auto;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    grid-column: 3;
    grid-row: 1;
    align-self: start;
    justify-self: end;
    width: 36px;
    min-width: 36px;
    max-width: 36px;
    margin-top: 0;
  }
}

@media only screen and (max-width: 991px) {
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-primary-action,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-primary-action {
    --domain-flow-mobile-cell-width: auto;
    --domain-flow-mobile-cell-max-width: 100%;
    --domain-flow-primary-action-justify: flex-end;
    align-self: flex-end;
    justify-content: flex-end;
    text-align: right;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-primary-action .domain-flow-primary-set-btn,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-primary-action .domain-flow-primary-set-btn {
    margin-left: auto;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(2) {
    order: 3;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(3) {
    order: 5;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row .domain-flow-connected-site {
    --domain-flow-connected-site-display: grid;
    --domain-flow-mobile-cell-width: 100%;
    --domain-flow-mobile-cell-max-width: 100%;
    order: 4;
    display: grid !important;
    grid-template-columns: minmax(0, 70px) minmax(0, 1fr) !important;
    column-gap: 12px !important;
    align-items: center;
    align-self: stretch;
    justify-content: flex-start;
    text-align: left;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row .domain-flow-connected-site::before {
    content: "연결 사이트";
    display: block;
    width: 100%;
    max-width: 70px;
    min-width: 0;
    color: var(--cl-text-muted);
    font-weight: 500;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row .domain-flow-connected-site-text {
    grid-column: 2;
    min-width: 0;
    max-width: 100%;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1337px) {
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row {
    --domain-flow-table-columns: 70px minmax(0, 1fr) max-content 36px;
    --domain-flow-summary-cell-padding: 0;
    --domain-flow-status-direction: row;
    --domain-flow-status-gap: 8px 16px;
    position: relative !important;
    display: grid !important;
    grid-template-columns: var(--domain-flow-table-columns) !important;
    align-items: start !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 20px !important;
    column-gap: 8px !important;
    row-gap: 8px !important;
    background-color: #fff !important;
    box-sizing: border-box !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span {
    position: static !important;
    min-width: 0 !important;
    min-height: 18px !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(1),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(1) {
    grid-column: 1 / 3 !important;
    grid-row: 1 !important;
    align-self: center !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(2),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(3),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(2),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(3),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(4) {
    --domain-flow-summary-cell-display: grid;
    --domain-flow-summary-cell-align: center;
    --domain-flow-expire-display: grid;
    --domain-flow-expire-white-space: nowrap;
    --domain-flow-expire-value-width: max-content;
    --domain-flow-expire-value-wrap: nowrap;
    --domain-flow-expire-text-flex: none;
    --domain-flow-expire-text-max-width: max-content;
    --domain-flow-expire-text-white-space: nowrap;
    --domain-flow-expire-text-overflow-wrap: normal;
    display: grid !important;
    grid-template-columns: minmax(0, 70px) minmax(0, 1fr) !important;
    column-gap: 12px !important;
    justify-items: start !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(2)::before,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(3)::before,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(2)::before,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(3)::before,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(4)::before {
    display: block !important;
    width: 100% !important;
    max-width: 70px !important;
    min-width: 0 !important;
    color: var(--cl-text-muted);
    font-weight: 500;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(2),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(2) {
    grid-column: 1 / 3 !important;
    grid-row: 2 !important;
    margin-top: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(2)::before,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(2)::before {
    content: "구매처";
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(3),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(3) {
    grid-column: 1 / 3 !important;
    grid-row: 3 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(3)::before,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(3)::before {
    content: "만기일";
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(3) .domain-flow-expire-value,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(3) .domain-flow-expire-value {
    --domain-flow-expire-display: inline-flex;
    justify-self: start;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(4) {
    --domain-flow-primary-action-justify: flex-end;
    --domain-flow-primary-action-min-height: 0;
    grid-column: 3 / 5 !important;
    grid-row: 2 !important;
    align-self: center !important;
    justify-self: end !important;
    width: auto !important;
    max-width: max-content !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(4) .domain-flow-primary-set-btn {
    --domain-flow-control-min-width: 0;
    --domain-flow-control-height: auto;
    --domain-flow-control-padding: 0;
    --domain-flow-control-background: transparent;
    --domain-flow-control-border: 0;
    --domain-flow-control-radius: 0;
    --domain-flow-control-hover-background: transparent;
    --domain-flow-control-hover-border-color: transparent;
    --domain-flow-control-hover-color: var(--cl-green-text);
    --domain-flow-primary-responsive-width: auto;
    --domain-flow-primary-min-width: 0;
    --domain-flow-primary-max-width: none;
    --domain-flow-primary-height: auto;
    --domain-flow-primary-padding-x: 0;
    --domain-flow-primary-border-color: transparent;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(4) {
    grid-column: 1 / 3 !important;
    grid-row: 4 !important;
    justify-content: flex-start !important;
    justify-self: stretch !important;
    text-align: left !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(4)::before {
    content: "연결 사이트";
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(5),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(5) {
    grid-column: 3 !important;
    grid-row: 1 !important;
    align-self: center !important;
    justify-self: end !important;
    width: auto !important;
    max-width: none !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(6),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(6) {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    grid-column: 4 !important;
    grid-row: 1 !important;
    align-self: start !important;
    justify-self: end !important;
    width: 36px !important;
    min-width: 36px !important;
    max-width: 36px !important;
    margin-top: 0 !important;
  }
}

@media (max-width: 767px) {
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row {
    --domain-flow-table-columns: minmax(0, 1fr) 36px;
    --domain-flow-summary-cell-padding: 0;
    --domain-flow-status-direction: row;
    --domain-flow-status-gap: 8px 16px;
    position: relative !important;
    display: grid !important;
    grid-template-columns: var(--domain-flow-table-columns) !important;
    align-items: start !important;
    min-height: 0 !important;
    padding: 21px 20px 24px !important;
    column-gap: 12px !important;
    row-gap: 8px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span {
    position: static;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    min-height: 18px;
    padding: 0;
    box-sizing: border-box;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(1),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(1) {
    grid-column: 1 !important;
    grid-row: 1 !important;
    align-self: center !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(5),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(5) {
    grid-column: 1 / 3 !important;
    grid-row: 2 !important;
    justify-self: start !important;
    width: auto !important;
    max-width: 100% !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(2),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(3),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(2),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(3),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(4) {
    --domain-flow-summary-cell-display: grid;
    --domain-flow-summary-cell-align: center;
    --domain-flow-expire-display: grid;
    --domain-flow-expire-white-space: nowrap;
    --domain-flow-expire-value-width: max-content;
    --domain-flow-expire-value-wrap: nowrap;
    --domain-flow-expire-text-flex: none;
    --domain-flow-expire-text-max-width: max-content;
    --domain-flow-expire-text-white-space: nowrap;
    --domain-flow-expire-text-overflow-wrap: normal;
    display: grid !important;
    grid-template-columns: minmax(0, 70px) minmax(0, 1fr) !important;
    column-gap: 12px !important;
    align-items: center !important;
    justify-items: start !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(2)::before,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(3)::before,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(2)::before,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(3)::before,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(4)::before {
    display: block !important;
    width: 100% !important;
    max-width: 70px !important;
    min-width: 0 !important;
    color: var(--cl-text-muted);
    font-weight: 500;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(2),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(2) {
    grid-column: 1 / 3 !important;
    grid-row: 3 !important;
    margin-top: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(2)::before,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(2)::before {
    content: "구매처";
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(3),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(3) {
    grid-column: 1 / 3 !important;
    grid-row: 4 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(3)::before,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(3)::before {
    content: "만기일";
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(3) .domain-flow-expire-value,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(3) .domain-flow-expire-value {
    --domain-flow-expire-display: inline-flex;
    justify-self: start;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(4) {
    --domain-flow-primary-action-justify: flex-end;
    --domain-flow-primary-action-min-height: 0;
    grid-column: 1 / 3 !important;
    grid-row: 5 !important;
    align-self: center !important;
    justify-self: end !important;
    width: auto !important;
    max-width: max-content !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(4) .domain-flow-primary-set-btn {
    --domain-flow-control-min-width: 0;
    --domain-flow-control-height: auto;
    --domain-flow-control-padding: 0;
    --domain-flow-control-background: transparent;
    --domain-flow-control-border: 0;
    --domain-flow-control-radius: 0;
    --domain-flow-control-hover-background: transparent;
    --domain-flow-control-hover-border-color: transparent;
    --domain-flow-control-hover-color: var(--cl-green-text);
    --domain-flow-primary-responsive-width: auto;
    --domain-flow-primary-min-width: 0;
    --domain-flow-primary-max-width: none;
    --domain-flow-primary-height: auto;
    --domain-flow-primary-padding-x: 0;
    --domain-flow-primary-border-color: transparent;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(4) {
    grid-column: 1 / 3 !important;
    grid-row: 5 !important;
    justify-self: stretch !important;
    text-align: left !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(4)::before {
    content: "연결 사이트";
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .connected-domain-section .domain-flow-connected-item .domain-flow-summary-row > span:nth-child(6),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .owned-domain-section .domain-flow-owned-item .domain-flow-summary-row > span:nth-child(6) {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    grid-column: 2;
    grid-row: 1;
    align-self: start;
    justify-self: end;
    width: 36px;
    min-width: 36px;
    max-width: 36px;
    margin-top: 0;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-head,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-head.domain-flow-dns-read-head,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-record-section > .domain-flow-dns-head {
    display: none !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-read-row,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-saved-editable-row,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-edit-row {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    column-gap: 8px !important;
    row-gap: 8px !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-saved-editable-row {
    position: relative !important;
    padding-bottom: 36px !important;
    overflow: visible !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-read-row > .domain-flow-dns-read-type,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-saved-editable-row > .domain-flow-dns-read-type,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-saved-editable-row > span:nth-child(1),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-edit-row > .domain-flow-dns-edit-cell:nth-child(1) {
    grid-column: 1 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-read-row > .domain-flow-dns-read-name,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-saved-editable-row > .domain-flow-dns-read-name,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-saved-editable-row > span:nth-child(2),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-edit-row > .domain-flow-dns-edit-cell:nth-child(2) {
    grid-column: 2 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-read-row > .domain-flow-dns-read-record-value,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-saved-editable-row > .domain-flow-dns-read-record-value,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-saved-editable-row > span:nth-child(3),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-edit-row > .domain-flow-dns-value-zone {
    grid-column: 1 / -1 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-edit-row > .domain-flow-dns-edit-cell {
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
    min-width: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-edit-row > .domain-flow-dns-edit-cell:nth-child(1)::before,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-edit-row > .domain-flow-dns-edit-cell:nth-child(2)::before,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-edit-row > .domain-flow-dns-value-zone::before {
    display: block !important;
    color: #b1b3b7 !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-edit-row > .domain-flow-dns-edit-cell:nth-child(1)::before {
    content: "Type" !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-edit-row > .domain-flow-dns-edit-cell:nth-child(2)::before {
    content: "Name" !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-edit-row > .domain-flow-dns-value-zone {
    row-gap: 6px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-edit-row > .domain-flow-dns-value-zone::before {
    grid-column: 1 / -1 !important;
    content: "Value" !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-edit-row > .domain-flow-dns-name-error {
    grid-column: 2 / 3 !important;
    grid-row: 2 !important;
    justify-self: start !important;
    width: 100% !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-edit-row > .domain-flow-dns-value-error {
    grid-column: 1 / -1 !important;
    grid-row: 3 !important;
    justify-self: start !important;
    width: 100% !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-edit-row.has-name-error > .domain-flow-dns-value-zone {
    grid-row: 3 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-edit-row.has-name-error > .domain-flow-dns-value-error {
    grid-row: 4 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-saved-editable-row > span.domain-flow-dns-edit-wrap {
    position: absolute !important;
    right: 72px !important;
    bottom: 0 !important;
    grid-column: auto !important;
    grid-row: auto !important;
    justify-self: auto !important;
    min-width: 56px !important;
    margin-right: 0 !important;
    transform: none !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-saved-editable-row > span.domain-flow-dns-delete-wrap {
    position: absolute !important;
    right: 0 !important;
    bottom: 0 !important;
    grid-column: auto !important;
    grid-row: auto !important;
    justify-self: auto !important;
    min-width: 56px !important;
    transform: none !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li > .domain-flow-dns-read-field,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-saved-editable-row > span.domain-flow-dns-read-field {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 6px !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li > .domain-flow-dns-read-type,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li > .domain-flow-dns-read-name,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-edit-row > .domain-flow-dns-edit-cell:nth-child(1),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-edit-row > .domain-flow-dns-edit-cell:nth-child(2) {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li > .domain-flow-dns-read-type,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-edit-row > .domain-flow-dns-edit-cell:nth-child(1) {
    padding-right: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li > .domain-flow-dns-read-name,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-edit-row > .domain-flow-dns-edit-cell:nth-child(2) {
    padding-left: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-edit-row > .domain-flow-dns-edit-cell:nth-child(1) .domain-flow-dns-type-wrap,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-edit-row > .domain-flow-dns-edit-cell:nth-child(1) .domain-flow-dns-type-btn,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-edit-row > .domain-flow-dns-edit-cell:nth-child(2) .domain-flow-dns-edit-control {
    width: 100% !important;
    max-width: 100% !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li > .domain-flow-dns-read-record-value,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-edit-row > .domain-flow-dns-value-zone {
    width: 100% !important;
    max-width: 100% !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-read-label {
    display: block !important;
    color: #b1b3b7 !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-read-field > .domain-flow-dns-read-value {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 36px !important;
    padding: 3px 12px !important;
    background: #f4f5f9 !important;
    border: 1px solid var(--cl-border) !important;
    border-radius: 5px !important;
    box-sizing: border-box !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-read-record-value > .domain-flow-dns-read-value {
    justify-content: space-between !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-saved-editable-row > span.domain-flow-dns-edit-wrap,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-saved-editable-row > span.domain-flow-dns-delete-wrap {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 6px !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 36px !important;
    min-height: 36px !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-saved-editable-row .domain-flow-dns-edit,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-saved-editable-row .domain-flow-dns-delete {
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 24px !important;
    min-height: 24px !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-saved-editable-row .domain-flow-dns-edit,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-saved-editable-row .domain-flow-edit-menu {
    color: var(--cl-green-text) !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-saved-editable-row .domain-flow-dns-edit:hover,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-saved-editable-row .domain-flow-dns-edit:focus,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-saved-editable-row .domain-flow-dns-edit:hover + .domain-flow-edit-menu,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-saved-editable-row .domain-flow-dns-edit:focus + .domain-flow-edit-menu,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-saved-editable-row .domain-flow-dns-edit-wrap:hover .domain-flow-dns-edit,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-saved-editable-row .domain-flow-dns-edit-wrap:hover .domain-flow-edit-menu {
    background: transparent !important;
    color: #0f9d50 !important;
    outline: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-saved-editable-row .domain-flow-dns-delete,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-saved-editable-row .domain-flow-delete-menu {
    color: var(--cl-danger) !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-saved-editable-row .domain-flow-edit-menu,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-saved-editable-row .domain-flow-delete-menu {
    position: static !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 0 !important;
    height: auto !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    line-height: 1.5 !important;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    cursor: pointer !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-saved-editable-row .domain-flow-edit-menu::before,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-dns-list li.domain-flow-dns-saved-editable-row .domain-flow-delete-menu::before {
    display: none !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-dns-list li.domain-flow-dns-read-row,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-dns-list li.domain-flow-dns-saved-editable-row,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-dns-list li.domain-flow-dns-edit-row,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-body .domain-flow-dns-list li.domain-flow-dns-read-row,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-body .domain-flow-dns-list li.domain-flow-dns-saved-editable-row,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-body .domain-flow-dns-list li.domain-flow-dns-edit-row {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    column-gap: 8px !important;
    row-gap: 8px !important;
    align-items: start !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-dns-list li.domain-flow-dns-read-row > .domain-flow-dns-read-type,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-dns-list li.domain-flow-dns-saved-editable-row > .domain-flow-dns-read-type,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-dns-list li.domain-flow-dns-saved-editable-row > span:nth-child(1),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-dns-list li.domain-flow-dns-edit-row > .domain-flow-dns-edit-cell:nth-child(1),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-body .domain-flow-dns-list li.domain-flow-dns-read-row > .domain-flow-dns-read-type,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-body .domain-flow-dns-list li.domain-flow-dns-saved-editable-row > .domain-flow-dns-read-type,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-body .domain-flow-dns-list li.domain-flow-dns-saved-editable-row > span:nth-child(1),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-body .domain-flow-dns-list li.domain-flow-dns-edit-row > .domain-flow-dns-edit-cell:nth-child(1) {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-dns-list li.domain-flow-dns-read-row > .domain-flow-dns-read-name,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-dns-list li.domain-flow-dns-saved-editable-row > .domain-flow-dns-read-name,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-dns-list li.domain-flow-dns-saved-editable-row > span:nth-child(2),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-dns-list li.domain-flow-dns-edit-row > .domain-flow-dns-edit-cell:nth-child(2),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-body .domain-flow-dns-list li.domain-flow-dns-read-row > .domain-flow-dns-read-name,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-body .domain-flow-dns-list li.domain-flow-dns-saved-editable-row > .domain-flow-dns-read-name,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-body .domain-flow-dns-list li.domain-flow-dns-saved-editable-row > span:nth-child(2),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-body .domain-flow-dns-list li.domain-flow-dns-edit-row > .domain-flow-dns-edit-cell:nth-child(2) {
    grid-column: 2 !important;
    grid-row: 1 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-dns-list li.domain-flow-dns-read-row > .domain-flow-dns-read-record-value,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-dns-list li.domain-flow-dns-saved-editable-row > .domain-flow-dns-read-record-value,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-dns-list li.domain-flow-dns-saved-editable-row > span:nth-child(3),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-dns-list li.domain-flow-dns-edit-row > .domain-flow-dns-value-zone,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-body .domain-flow-dns-list li.domain-flow-dns-read-row > .domain-flow-dns-read-record-value,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-body .domain-flow-dns-list li.domain-flow-dns-saved-editable-row > .domain-flow-dns-read-record-value,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-body .domain-flow-dns-list li.domain-flow-dns-saved-editable-row > span:nth-child(3),
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-body .domain-flow-dns-list li.domain-flow-dns-edit-row > .domain-flow-dns-value-zone {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-row-body.domain-flow-registrant-body .domain-flow-dns-list li.domain-flow-dns-edit-row.has-name-error > .domain-flow-dns-value-zone,
  body.cl-dashboard-redesign-page .cl-source-domain-page.domain-flow-page .domain-flow-registrant-body .domain-flow-dns-list li.domain-flow-dns-edit-row.has-name-error > .domain-flow-dns-value-zone {
    grid-row: 3 !important;
  }
}

/* Source dashboard domain buy page */
html.domain-buy-modal-open,
body.domain-buy-modal-open,
html.domain-flow-address-modal-open,
body.domain-flow-address-modal-open {
  overflow: hidden;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-mobile-title,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-search-mobile-help {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .cl-source-domain-buy-layout,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .cl-source-domain-buy-panel {
  width: 100%;
  max-width: 1127px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .cl-source-domain-buy-panel {
  flex: 1 1 100%;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.index .sub-title .btn-box {
  display: inline-flex;
  flex: none;
  align-items: center;
  gap: 8px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-actions .btn-default {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 86px;
  height: 34px;
  padding: 0 14px;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px;
  color: var(--cl-text) !important;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-actions .btn-default:hover {
  background: var(--cl-green-soft) !important;
  border-color: var(--cl-green-line) !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-content {
  min-height: 430px;
  padding: 28px 24px 48px !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-search {
  width: 100%;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-search-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-search-head h2 {
  margin: 0;
  color: var(--cl-text);
  font-size: 18px;
  font-weight: 800;
  line-height: 1.35;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-search-head p,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-help {
  margin: 0;
  color: var(--cl-text-sub);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.5;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-search-row {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-search-row > span {
  flex: none;
  color: var(--cl-text);
  font-size: 18px;
  font-weight: 400;
  line-height: normal;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-input-wrap {
  position: relative;
  flex: 1 1 auto;
  min-width: 0;
  height: 50px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-keyword-field,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-keyword-field > * {
  width: 100%;
  height: 50px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-input-wrap input,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-input-wrap .cl-dashboard-input {
  width: 100%;
  height: 50px;
  padding: 0 54px 0 12px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 5px;
  box-shadow: none;
  color: var(--cl-text);
  font-size: 18px;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: 0;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-input-wrap input::placeholder,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-input-wrap .cl-dashboard-input::placeholder {
  font-size: 18px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-input-wrap input:focus,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-input-wrap .cl-dashboard-input:focus {
  border-color: var(--cl-green);
  outline: 0;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .1);
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-search-icon-btn {
  position: absolute;
  top: 50%;
  right: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  min-width: 24px;
  height: 24px;
  padding: 0;
  background: transparent !important;
  border: 0 !important;
  color: var(--cl-green) !important;
  transform: translateY(-50%) !important;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-search-icon-btn svg {
  width: 17px;
  height: 19px;
  fill: currentColor;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-search-meta {
  display: none;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 14px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-search.has-keyword .domain-buy-search-meta {
  display: flex;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-check,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-admin-same-label {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin: 0;
  color: var(--cl-text);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.45;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy input[type="checkbox"],
body.cl-dashboard-redesign-page .cl-source-domain-page.buy input[type="radio"] {
  accent-color: var(--cl-green);
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-check input,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-admin-same-label input {
  flex: none;
  width: 16px;
  height: 16px;
  margin: 0;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-search-meta .domain-buy-check {
  position: relative;
  gap: 7px;
  min-height: 18px;
  color: var(--cl-text);
  font-size: 13px;
  font-weight: 400;
  line-height: 18px;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-search-meta .domain-buy-check input {
  position: absolute;
  top: 50%;
  left: 0;
  z-index: 2;
  width: 16px;
  height: 16px;
  margin: 0;
  opacity: 0;
  cursor: pointer;
  transform: translateY(-50%);
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-check-ui {
  position: relative;
  display: inline-flex;
  flex: 0 0 16px;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  background: #fff;
  border: 1px solid #b9c1cc;
  border-radius: 3px;
  box-sizing: border-box;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-check-ui::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 5px;
  width: 5px;
  height: 8px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  opacity: 0;
  transform: rotate(45deg);
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-search-meta .domain-buy-check input:checked + .domain-buy-check-ui {
  background: var(--cl-green);
  border-color: var(--cl-green);
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-search-meta .domain-buy-check input:checked + .domain-buy-check-ui::after {
  opacity: 1;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-search-meta .domain-buy-check input:focus-visible + .domain-buy-check-ui {
  border-color: var(--cl-green);
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .13);
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-check-text {
  color: var(--cl-text);
  font: inherit;
  line-height: inherit;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-results {
  width: 100%;
  margin-top: 20px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-empty-result {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 160px;
  padding: 26px;
  background: #fbfcfd;
  border: 1px solid var(--cl-line);
  border-radius: 8px;
  color: var(--cl-text-sub);
  font-size: 14px;
  font-weight: 600;
  text-align: center;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-loading-result {
  gap: 10px;
  color: var(--cl-green-text);
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-loading-spinner {
  width: 18px;
  height: 18px;
  border: 2px solid var(--cl-green-line);
  border-top-color: var(--cl-green);
  border-radius: 50%;
  animation: cl-domain-buy-loading-spin .8s linear infinite;
}

@keyframes cl-domain-buy-loading-spin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-result-list {
  overflow: visible;
  border: 1px solid var(--cl-line);
  border-radius: 8px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-result-row {
  position: relative;
  display: flex;
  align-items: center;
  gap: 16px;
  min-height: 62px;
  padding: 12px 16px;
  background: #fff;
  border-top: 1px solid var(--cl-line);
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-result-row:first-child {
  border-top: 0;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-result-row:hover {
  background: #fbfcfd;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-result-row.unavailable {
  background: #f8f9fb;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-result-domain {
  flex: 1 1 260px;
  min-width: 0;
  overflow: hidden;
  color: var(--cl-text);
  font-size: 15px;
  font-weight: 700;
  line-height: 1.5;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-result-domain strong {
  font-weight: 800;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-result-domain .domain-buy-result-tld,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-result-sale-price {
  color: var(--cl-green-text);
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-result-row.unavailable .domain-buy-result-domain,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-result-row.unavailable .domain-buy-result-domain strong,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-result-row.unavailable .domain-buy-result-tld {
  color: var(--cl-text-muted);
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-result-years {
  position: relative;
  flex: 0 0 94px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-result-years-select,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-dropdown {
  position: relative;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-result-years-toggle,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-dropdown-toggle {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  height: 36px;
  padding: 0 32px 0 12px;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 5px;
  box-shadow: none !important;
  color: var(--cl-text) !important;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.5;
  text-align: left;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-dropdown {
  height: 40px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-dropdown-toggle {
  height: 40px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-result-years-toggle:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-dropdown-toggle:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-result-years-select.open .domain-buy-result-years-toggle,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-dropdown.open .domain-buy-dropdown-toggle {
  border-color: var(--cl-green) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-result-years-arrow,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-dropdown-arrow {
  position: absolute;
  top: 50%;
  right: 12px;
  width: 14px !important;
  height: 14px !important;
  color: var(--cl-text-muted) !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  pointer-events: none;
  transform: translateY(-50%);
  transition: transform .15s;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-result-years-arrow path,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-dropdown-arrow path {
  fill: none !important;
  stroke: currentColor !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-result-years-arrow-down,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-dropdown-arrow-down {
  display: block !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-result-years-arrow-up,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-dropdown-arrow-up {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-result-years-select.open .domain-buy-result-years-arrow-down,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-dropdown.open .domain-buy-dropdown-arrow-down {
  display: block !important;
  transform: translateY(-50%) rotate(180deg);
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-result-years-select.open .domain-buy-result-years-arrow-up,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-dropdown.open .domain-buy-dropdown-arrow-up {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-result-years-options,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-dropdown-options {
  position: absolute;
  top: calc(100% + 4px);
  right: 0;
  z-index: 80;
  display: none;
  width: 100%;
  min-width: 120px;
  max-height: 220px;
  overflow: auto;
  padding: 4px 0;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
  box-shadow: 0 10px 24px rgba(20, 24, 32, .12);
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-result-years-select .domain-buy-result-years-options,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-years-dropdown .domain-buy-dropdown-options {
  right: auto;
  left: 0;
  width: 100%;
  min-width: 0;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-result-years-select.open .domain-buy-result-years-options,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-dropdown.open .domain-buy-dropdown-options {
  display: block;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-result-years-option,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-dropdown-option {
  display: block;
  width: 100%;
  min-height: 40px;
  padding: 0 12px;
  background: #fff !important;
  border: 0 !important;
  color: var(--cl-text) !important;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.5;
  text-align: left;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-result-years-option:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-result-years-option.active,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-dropdown-option:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-dropdown-option.active {
  background: var(--cl-green-soft) !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-dropdown-option.is-disabled {
  color: var(--cl-text-muted) !important;
  cursor: not-allowed;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-site-dropdown .domain-buy-dropdown-options {
  padding: 6px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-site-dropdown .domain-buy-dropdown-option {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  height: 36px;
  min-height: 36px;
  padding: 0 10px;
  overflow: hidden;
  border-radius: 6px;
  box-sizing: border-box;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-site-dropdown .domain-buy-site-dropdown-label {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  width: 100%;
  min-width: 0;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-site-dropdown .domain-buy-site-dropdown-text {
  display: block;
  flex: 0 1 auto;
  min-width: 0;
  max-width: none;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-site-dropdown .domain-flow-site-plan-badge {
  display: inline-flex !important;
  flex: none;
  align-items: center;
  justify-content: center;
  min-width: 0;
  height: auto;
  margin-left: 0;
  padding: 2px 7px;
  border: 0;
  border-radius: 4px;
  font-size: 11px;
  font-style: normal;
  font-weight: 500;
  line-height: 13px;
  letter-spacing: .2px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: geometricPrecision;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-site-dropdown .domain-flow-site-plan-badge.free,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-site-dropdown .domain-flow-site-plan-badge.micro,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-site-dropdown .domain-flow-site-plan-badge.domain-flow-site-plan-badge-free,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-site-dropdown .domain-flow-site-plan-badge.domain-flow-site-plan-badge-micro {
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  color: var(--cl-text-sub) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-site-dropdown .domain-flow-site-plan-badge.shopping,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-site-dropdown .domain-flow-site-plan-badge.domain-flow-site-plan-badge-shopping {
  background: #f4778d !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-site-dropdown .domain-flow-site-plan-badge.business,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-site-dropdown .domain-flow-site-plan-badge.domain-flow-site-plan-badge-business {
  background: #3b6fe0 !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-site-dropdown .domain-flow-site-plan-badge.basic,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-site-dropdown .domain-flow-site-plan-badge.domain-flow-site-plan-badge-basic {
  background: #16a34a !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-result-regular-price {
  flex: 0 0 84px;
  color: var(--cl-text-muted);
  font-size: 13px;
  font-weight: 500;
  text-align: right;
  text-decoration: line-through;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-result-sale-price {
  flex: 0 0 92px;
  font-size: 14px;
  font-weight: 800;
  text-align: right;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-result-action {
  flex: 0 0 66px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-result-unavailable-status {
  flex: 0 0 150px;
  color: var(--cl-text-muted);
  font-size: 13px;
  font-weight: 700;
  text-align: right;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-select,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-sub-action.primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 34px;
  padding: 0 14px;
  background: var(--cl-green) !important;
  border: 1px solid var(--cl-green) !important;
  border-radius: 5px;
  color: #fff !important;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: 0;
  text-decoration: none;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-select:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-sub-action.primary:hover {
  background: var(--cl-green-hover) !important;
  border-color: var(--cl-green-hover) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-purchase-btn.is-disabled-look,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-purchase-btn[aria-disabled="true"] {
  opacity: .55;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-message {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 10000;
  background: rgba(15, 23, 42, .32);
}

body.cl-dashboard-redesign-page.domain-buy-modal-open #bg_layer {
  z-index: 10002 !important;
}

body.cl-dashboard-redesign-page.domain-buy-modal-open #nice_layer {
  z-index: 10003 !important;
}

body.cl-dashboard-redesign-page #domain-buy-modal-layer.domain-buy-modal-layer {
  position: static !important;
  display: block !important;
  width: 0 !important;
  max-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page.domain-buy-modal-open .addr-modal-backdrop.domain-buy-address-modal-backdrop,
body.cl-dashboard-redesign-page.domain-flow-address-modal-open .addr-modal-backdrop.domain-flow-address-modal-backdrop,
body.cl-dashboard-redesign-page:has(:is(.cl-source-delivery-edit-wrap, .cl-source-order-workflow-wrap)) > .addr-modal-backdrop {
  position: fixed !important;
  inset: 0 !important;
  z-index: 10006 !important;
  background: rgba(15, 23, 42, .42) !important;
  opacity: 0;
  transition: opacity .15s linear;
}

body.cl-dashboard-redesign-page.domain-buy-modal-open .addr-modal-backdrop.domain-buy-address-modal-backdrop.in,
body.cl-dashboard-redesign-page.domain-flow-address-modal-open .addr-modal-backdrop.domain-flow-address-modal-backdrop.in,
body.cl-dashboard-redesign-page:has(:is(.cl-source-delivery-edit-wrap, .cl-source-order-workflow-wrap)) > .addr-modal-backdrop.in {
  opacity: .45 !important;
  filter: none !important;
}

body.cl-dashboard-redesign-page.domain-buy-modal-open #addr-modal.domain-buy-address-modal,
body.cl-dashboard-redesign-page.domain-flow-address-modal-open #addr-modal.domain-flow-address-modal,
body.cl-dashboard-redesign-page:has(:is(.cl-source-delivery-edit-wrap, .cl-source-order-workflow-wrap)) > #addr-modal {
  position: fixed !important;
  top: 50% !important;
  left: 50% !important;
  z-index: 10007 !important;
  width: 520px !important;
  height: 560px !important;
  max-width: calc(100vw - 40px) !important;
  max-height: calc(100vh - 48px) !important;
  overflow: hidden !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 14px !important;
  box-shadow: 0 24px 70px rgba(20, 24, 32, .22) !important;
  color: var(--cl-text) !important;
  font-family: var(--cl-source-font) !important;
  transform: translate(-50%, -50%) !important;
}

body.cl-dashboard-redesign-page.domain-buy-modal-open #addr-modal.domain-buy-address-modal > .close,
body.cl-dashboard-redesign-page.domain-flow-address-modal-open #addr-modal.domain-flow-address-modal > .close,
body.cl-dashboard-redesign-page:has(:is(.cl-source-delivery-edit-wrap, .cl-source-order-workflow-wrap)) > #addr-modal > .close {
  position: relative !important;
  top: auto !important;
  right: auto !important;
  left: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  float: none !important;
  width: 100% !important;
  height: 54px !important;
  padding: 0 56px !important;
  background: #fff !important;
  border-bottom: 1px solid var(--cl-line) !important;
  color: var(--cl-text) !important;
  font-size: 16px !important;
  font-weight: 800 !important;
  line-height: 1.4 !important;
  text-align: center !important;
  text-shadow: none !important;
  opacity: 1 !important;
  cursor: default;
}

body.cl-dashboard-redesign-page.domain-buy-modal-open #addr-modal.domain-buy-address-modal > .close > #btn-addr-close,
body.cl-dashboard-redesign-page.domain-flow-address-modal-open #addr-modal.domain-flow-address-modal > .close > #btn-addr-close,
body.cl-dashboard-redesign-page:has(:is(.cl-source-delivery-edit-wrap, .cl-source-order-workflow-wrap)) > #addr-modal > .close > #btn-addr-close {
  position: absolute !important;
  top: 50% !important;
  right: 14px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  float: none !important;
  width: 32px !important;
  height: 32px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 7px !important;
  color: var(--cl-text-sub) !important;
  font-size: 0 !important;
  line-height: 0 !important;
  text-decoration: none !important;
  cursor: pointer;
  transform: translateY(-50%) !important;
  transition: background-color .12s ease, color .12s ease;
}

body.cl-dashboard-redesign-page.domain-buy-modal-open #addr-modal.domain-buy-address-modal > .close > #btn-addr-close:hover,
body.cl-dashboard-redesign-page.domain-buy-modal-open #addr-modal.domain-buy-address-modal > .close > #btn-addr-close:focus,
body.cl-dashboard-redesign-page.domain-flow-address-modal-open #addr-modal.domain-flow-address-modal > .close > #btn-addr-close:hover,
body.cl-dashboard-redesign-page:has(:is(.cl-source-delivery-edit-wrap, .cl-source-order-workflow-wrap)) > #addr-modal > .close > #btn-addr-close:hover,
body.cl-dashboard-redesign-page.domain-flow-address-modal-open #addr-modal.domain-flow-address-modal > .close > #btn-addr-close:focus,
body.cl-dashboard-redesign-page:has(:is(.cl-source-delivery-edit-wrap, .cl-source-order-workflow-wrap)) > #addr-modal > .close > #btn-addr-close:focus {
  background: #f0f2f5 !important;
  color: var(--cl-text) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page.domain-buy-modal-open #addr-modal.domain-buy-address-modal > .close > #btn-addr-close img,
body.cl-dashboard-redesign-page.domain-flow-address-modal-open #addr-modal.domain-flow-address-modal > .close > #btn-addr-close img,
body.cl-dashboard-redesign-page:has(:is(.cl-source-delivery-edit-wrap, .cl-source-order-workflow-wrap)) > #addr-modal > .close > #btn-addr-close img {
  display: none !important;
}

body.cl-dashboard-redesign-page.domain-buy-modal-open #addr-modal.domain-buy-address-modal > .close > #btn-addr-close::before,
body.cl-dashboard-redesign-page.domain-buy-modal-open #addr-modal.domain-buy-address-modal > .close > #btn-addr-close::after,
body.cl-dashboard-redesign-page.domain-flow-address-modal-open #addr-modal.domain-flow-address-modal > .close > #btn-addr-close::before,
body.cl-dashboard-redesign-page:has(:is(.cl-source-delivery-edit-wrap, .cl-source-order-workflow-wrap)) > #addr-modal > .close > #btn-addr-close::before,
body.cl-dashboard-redesign-page.domain-flow-address-modal-open #addr-modal.domain-flow-address-modal > .close > #btn-addr-close::after,
body.cl-dashboard-redesign-page:has(:is(.cl-source-delivery-edit-wrap, .cl-source-order-workflow-wrap)) > #addr-modal > .close > #btn-addr-close::after {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 14px;
  height: 1.5px;
  background: currentColor;
  border-radius: 999px;
  content: "";
}

body.cl-dashboard-redesign-page.domain-buy-modal-open #addr-modal.domain-buy-address-modal > .close > #btn-addr-close::before,
body.cl-dashboard-redesign-page.domain-flow-address-modal-open #addr-modal.domain-flow-address-modal > .close > #btn-addr-close::before,
body.cl-dashboard-redesign-page:has(:is(.cl-source-delivery-edit-wrap, .cl-source-order-workflow-wrap)) > #addr-modal > .close > #btn-addr-close::before {
  transform: translate(-50%, -50%) rotate(45deg);
}

body.cl-dashboard-redesign-page.domain-buy-modal-open #addr-modal.domain-buy-address-modal > .close > #btn-addr-close::after,
body.cl-dashboard-redesign-page.domain-flow-address-modal-open #addr-modal.domain-flow-address-modal > .close > #btn-addr-close::after,
body.cl-dashboard-redesign-page:has(:is(.cl-source-delivery-edit-wrap, .cl-source-order-workflow-wrap)) > #addr-modal > .close > #btn-addr-close::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}

body.cl-dashboard-redesign-page.domain-buy-modal-open #addr-modal.domain-buy-address-modal #addr-body,
body.cl-dashboard-redesign-page.domain-flow-address-modal-open #addr-modal.domain-flow-address-modal #addr-body,
body.cl-dashboard-redesign-page:has(:is(.cl-source-delivery-edit-wrap, .cl-source-order-workflow-wrap)) > #addr-modal #addr-body {
  width: 100% !important;
  height: calc(100% - 54px) !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #fff !important;
}

body.cl-dashboard-redesign-page.domain-buy-modal-open #addr-modal.domain-buy-address-modal #addr-body > div,
body.cl-dashboard-redesign-page.domain-buy-modal-open #addr-modal.domain-buy-address-modal #addr-body iframe,
body.cl-dashboard-redesign-page.domain-flow-address-modal-open #addr-modal.domain-flow-address-modal #addr-body > div,
body.cl-dashboard-redesign-page.domain-flow-address-modal-open #addr-modal.domain-flow-address-modal #addr-body iframe,
body.cl-dashboard-redesign-page:has(:is(.cl-source-delivery-edit-wrap, .cl-source-order-workflow-wrap)) > #addr-modal #addr-body > div,
body.cl-dashboard-redesign-page:has(:is(.cl-source-delivery-edit-wrap, .cl-source-order-workflow-wrap)) > #addr-modal #addr-body iframe {
  width: 100% !important;
  height: 100% !important;
  border: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-form-wrap.domain-buy-modal {
  position: fixed;
  top: 40px;
  left: 50%;
  z-index: 10001;
  width: min(1200px, calc(100vw - 40px));
  max-height: calc(100vh - 80px);
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 12px;
  box-shadow: 0 24px 70px rgba(20, 24, 32, .22);
  transform: translateX(-50%);
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-form-wrap.domain-buy-modal[style*="display: flex"],
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-form-wrap.domain-buy-modal[style*="display:flex"] {
  display: flex !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-main {
  flex: 1 1 800px;
  min-width: 0;
  max-height: calc(100vh - 80px);
  overflow-y: auto;
  padding: 50px 40px;
  background: #fff;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-side {
  flex: 0 0 420px;
  max-height: calc(100vh - 80px);
  overflow-y: auto;
  padding: 34px 28px 40px !important;
  background: #f7f8fb;
  border-left: 1px solid var(--cl-line);
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-form-wrap.domain-buy-modal,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-main,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-side {
  scrollbar-width: thin;
  scrollbar-color: #d1d3d5 transparent;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-form-wrap.domain-buy-modal::-webkit-scrollbar,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-main::-webkit-scrollbar,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-side::-webkit-scrollbar {
  width: 9px !important;
  height: 9px !important;
  border: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-form-wrap.domain-buy-modal::-webkit-scrollbar-thumb,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-main::-webkit-scrollbar-thumb,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-side::-webkit-scrollbar-thumb {
  background: #d1d3d5 !important;
  border: 2px solid transparent !important;
  border-radius: 6px !important;
  background-clip: padding-box !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-form-wrap.domain-buy-modal::-webkit-scrollbar-thumb:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-main::-webkit-scrollbar-thumb:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-side::-webkit-scrollbar-thumb:hover {
  background: #d1d3d5 !important;
  background-clip: padding-box !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-form-wrap.domain-buy-modal::-webkit-scrollbar-track,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-main::-webkit-scrollbar-track,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-side::-webkit-scrollbar-track {
  margin: 0 !important;
  border: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-form-wrap.domain-buy-modal::-webkit-scrollbar-button,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-main::-webkit-scrollbar-button,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-side::-webkit-scrollbar-button {
  display: none !important;
  width: 0 !important;
  min-width: 0 !important;
  max-width: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  max-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-form-wrap.domain-buy-modal::-webkit-scrollbar-button:single-button,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-main::-webkit-scrollbar-button:single-button,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-side::-webkit-scrollbar-button:single-button,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-form-wrap.domain-buy-modal::-webkit-scrollbar-button:double-button,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-main::-webkit-scrollbar-button:double-button,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-side::-webkit-scrollbar-button:double-button,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-form-wrap.domain-buy-modal::-webkit-scrollbar-button:start,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-main::-webkit-scrollbar-button:start,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-side::-webkit-scrollbar-button:start,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-form-wrap.domain-buy-modal::-webkit-scrollbar-button:end,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-main::-webkit-scrollbar-button:end,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-side::-webkit-scrollbar-button:end,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-form-wrap.domain-buy-modal::-webkit-scrollbar-button:decrement,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-main::-webkit-scrollbar-button:decrement,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-side::-webkit-scrollbar-button:decrement,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-form-wrap.domain-buy-modal::-webkit-scrollbar-button:increment,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-main::-webkit-scrollbar-button:increment,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-side::-webkit-scrollbar-button:increment,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-form-wrap.domain-buy-modal::-webkit-scrollbar-button:vertical:decrement,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-main::-webkit-scrollbar-button:vertical:decrement,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-side::-webkit-scrollbar-button:vertical:decrement,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-form-wrap.domain-buy-modal::-webkit-scrollbar-button:vertical:increment,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-main::-webkit-scrollbar-button:vertical:increment,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-side::-webkit-scrollbar-button:vertical:increment,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-form-wrap.domain-buy-modal::-webkit-scrollbar-button:vertical:start:decrement,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-main::-webkit-scrollbar-button:vertical:start:decrement,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-side::-webkit-scrollbar-button:vertical:start:decrement,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-form-wrap.domain-buy-modal::-webkit-scrollbar-button:vertical:end:increment,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-main::-webkit-scrollbar-button:vertical:end:increment,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-side::-webkit-scrollbar-button:vertical:end:increment,
body.cl-dashboard-redesign-page #domain-buy-form-wrap.domain-buy-form-wrap.domain-buy-modal::-webkit-scrollbar-button,
body.cl-dashboard-redesign-page #domain-buy-form-wrap.domain-buy-form-wrap.domain-buy-modal .domain-buy-modal-main::-webkit-scrollbar-button,
body.cl-dashboard-redesign-page #domain-buy-form-wrap.domain-buy-form-wrap.domain-buy-modal .domain-buy-modal-side::-webkit-scrollbar-button,
body.cl-dashboard-redesign-page #domain-buy-form-wrap.domain-buy-form-wrap.domain-buy-modal::-webkit-scrollbar-button:single-button,
body.cl-dashboard-redesign-page #domain-buy-form-wrap.domain-buy-form-wrap.domain-buy-modal .domain-buy-modal-main::-webkit-scrollbar-button:single-button,
body.cl-dashboard-redesign-page #domain-buy-form-wrap.domain-buy-form-wrap.domain-buy-modal .domain-buy-modal-side::-webkit-scrollbar-button:single-button,
body.cl-dashboard-redesign-page #domain-buy-form-wrap.domain-buy-form-wrap.domain-buy-modal::-webkit-scrollbar-button:double-button,
body.cl-dashboard-redesign-page #domain-buy-form-wrap.domain-buy-form-wrap.domain-buy-modal .domain-buy-modal-main::-webkit-scrollbar-button:double-button,
body.cl-dashboard-redesign-page #domain-buy-form-wrap.domain-buy-form-wrap.domain-buy-modal .domain-buy-modal-side::-webkit-scrollbar-button:double-button,
body.cl-dashboard-redesign-page #domain-buy-form-wrap.domain-buy-form-wrap.domain-buy-modal::-webkit-scrollbar-button:start,
body.cl-dashboard-redesign-page #domain-buy-form-wrap.domain-buy-form-wrap.domain-buy-modal .domain-buy-modal-main::-webkit-scrollbar-button:start,
body.cl-dashboard-redesign-page #domain-buy-form-wrap.domain-buy-form-wrap.domain-buy-modal .domain-buy-modal-side::-webkit-scrollbar-button:start,
body.cl-dashboard-redesign-page #domain-buy-form-wrap.domain-buy-form-wrap.domain-buy-modal::-webkit-scrollbar-button:end,
body.cl-dashboard-redesign-page #domain-buy-form-wrap.domain-buy-form-wrap.domain-buy-modal .domain-buy-modal-main::-webkit-scrollbar-button:end,
body.cl-dashboard-redesign-page #domain-buy-form-wrap.domain-buy-form-wrap.domain-buy-modal .domain-buy-modal-side::-webkit-scrollbar-button:end,
body.cl-dashboard-redesign-page #domain-buy-form-wrap.domain-buy-form-wrap.domain-buy-modal::-webkit-scrollbar-button:decrement,
body.cl-dashboard-redesign-page #domain-buy-form-wrap.domain-buy-form-wrap.domain-buy-modal .domain-buy-modal-main::-webkit-scrollbar-button:decrement,
body.cl-dashboard-redesign-page #domain-buy-form-wrap.domain-buy-form-wrap.domain-buy-modal .domain-buy-modal-side::-webkit-scrollbar-button:decrement,
body.cl-dashboard-redesign-page #domain-buy-form-wrap.domain-buy-form-wrap.domain-buy-modal::-webkit-scrollbar-button:increment,
body.cl-dashboard-redesign-page #domain-buy-form-wrap.domain-buy-form-wrap.domain-buy-modal .domain-buy-modal-main::-webkit-scrollbar-button:increment,
body.cl-dashboard-redesign-page #domain-buy-form-wrap.domain-buy-form-wrap.domain-buy-modal .domain-buy-modal-side::-webkit-scrollbar-button:increment,
body.cl-dashboard-redesign-page #domain-buy-form-wrap.domain-buy-form-wrap.domain-buy-modal::-webkit-scrollbar-button:vertical:decrement,
body.cl-dashboard-redesign-page #domain-buy-form-wrap.domain-buy-form-wrap.domain-buy-modal .domain-buy-modal-main::-webkit-scrollbar-button:vertical:decrement,
body.cl-dashboard-redesign-page #domain-buy-form-wrap.domain-buy-form-wrap.domain-buy-modal .domain-buy-modal-side::-webkit-scrollbar-button:vertical:decrement,
body.cl-dashboard-redesign-page #domain-buy-form-wrap.domain-buy-form-wrap.domain-buy-modal::-webkit-scrollbar-button:vertical:increment,
body.cl-dashboard-redesign-page #domain-buy-form-wrap.domain-buy-form-wrap.domain-buy-modal .domain-buy-modal-main::-webkit-scrollbar-button:vertical:increment,
body.cl-dashboard-redesign-page #domain-buy-form-wrap.domain-buy-form-wrap.domain-buy-modal .domain-buy-modal-side::-webkit-scrollbar-button:vertical:increment,
body.cl-dashboard-redesign-page #domain-buy-form-wrap.domain-buy-form-wrap.domain-buy-modal::-webkit-scrollbar-button:vertical:start:decrement,
body.cl-dashboard-redesign-page #domain-buy-form-wrap.domain-buy-form-wrap.domain-buy-modal .domain-buy-modal-main::-webkit-scrollbar-button:vertical:start:decrement,
body.cl-dashboard-redesign-page #domain-buy-form-wrap.domain-buy-form-wrap.domain-buy-modal .domain-buy-modal-side::-webkit-scrollbar-button:vertical:start:decrement,
body.cl-dashboard-redesign-page #domain-buy-form-wrap.domain-buy-form-wrap.domain-buy-modal::-webkit-scrollbar-button:vertical:end:increment,
body.cl-dashboard-redesign-page #domain-buy-form-wrap.domain-buy-form-wrap.domain-buy-modal .domain-buy-modal-main::-webkit-scrollbar-button:vertical:end:increment,
body.cl-dashboard-redesign-page #domain-buy-form-wrap.domain-buy-form-wrap.domain-buy-modal .domain-buy-modal-side::-webkit-scrollbar-button:vertical:end:increment {
  display: none !important;
  width: 0 !important;
  min-width: 0 !important;
  max-width: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  max-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}

html.domain-buy-modal-open::-webkit-scrollbar-button,
body.domain-buy-modal-open::-webkit-scrollbar-button,
html.domain-buy-modal-open::-webkit-scrollbar-button:single-button,
body.domain-buy-modal-open::-webkit-scrollbar-button:single-button,
html.domain-buy-modal-open::-webkit-scrollbar-button:double-button,
body.domain-buy-modal-open::-webkit-scrollbar-button:double-button,
html.domain-buy-modal-open::-webkit-scrollbar-button:start,
body.domain-buy-modal-open::-webkit-scrollbar-button:start,
html.domain-buy-modal-open::-webkit-scrollbar-button:end,
body.domain-buy-modal-open::-webkit-scrollbar-button:end,
html.domain-buy-modal-open::-webkit-scrollbar-button:decrement,
body.domain-buy-modal-open::-webkit-scrollbar-button:decrement,
html.domain-buy-modal-open::-webkit-scrollbar-button:increment,
body.domain-buy-modal-open::-webkit-scrollbar-button:increment,
html.domain-buy-modal-open::-webkit-scrollbar-button:vertical:decrement,
body.domain-buy-modal-open::-webkit-scrollbar-button:vertical:decrement,
html.domain-buy-modal-open::-webkit-scrollbar-button:vertical:increment,
body.domain-buy-modal-open::-webkit-scrollbar-button:vertical:increment,
html.domain-buy-modal-open::-webkit-scrollbar-button:vertical:start:decrement,
body.domain-buy-modal-open::-webkit-scrollbar-button:vertical:start:decrement,
html.domain-buy-modal-open::-webkit-scrollbar-button:vertical:end:increment,
body.domain-buy-modal-open::-webkit-scrollbar-button:vertical:end:increment,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-form-wrap.domain-buy-modal::-webkit-scrollbar-track-piece,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-main::-webkit-scrollbar-track-piece,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-side::-webkit-scrollbar-track-piece,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-form-wrap.domain-buy-modal::-webkit-scrollbar-track-piece:start,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-main::-webkit-scrollbar-track-piece:start,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-side::-webkit-scrollbar-track-piece:start,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-form-wrap.domain-buy-modal::-webkit-scrollbar-track-piece:end,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-main::-webkit-scrollbar-track-piece:end,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-side::-webkit-scrollbar-track-piece:end,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-form-wrap.domain-buy-modal::-webkit-scrollbar-track-piece:vertical:start,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-main::-webkit-scrollbar-track-piece:vertical:start,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-side::-webkit-scrollbar-track-piece:vertical:start,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-form-wrap.domain-buy-modal::-webkit-scrollbar-track-piece:vertical:end,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-main::-webkit-scrollbar-track-piece:vertical:end,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-side::-webkit-scrollbar-track-piece:vertical:end,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-form-wrap.domain-buy-modal::-webkit-scrollbar-corner,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-main::-webkit-scrollbar-corner,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-side::-webkit-scrollbar-corner {
  display: none !important;
  width: 0 !important;
  min-width: 0 !important;
  max-width: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  max-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}

html.domain-buy-modal-open::-webkit-scrollbar,
body.domain-buy-modal-open::-webkit-scrollbar {
  width: 9px !important;
  height: 9px !important;
  border: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

html.domain-buy-modal-open::-webkit-scrollbar-track,
body.domain-buy-modal-open::-webkit-scrollbar-track,
html.domain-buy-modal-open::-webkit-scrollbar-track-piece,
body.domain-buy-modal-open::-webkit-scrollbar-track-piece,
html.domain-buy-modal-open::-webkit-scrollbar-track-piece:start,
body.domain-buy-modal-open::-webkit-scrollbar-track-piece:start,
html.domain-buy-modal-open::-webkit-scrollbar-track-piece:end,
body.domain-buy-modal-open::-webkit-scrollbar-track-piece:end,
html.domain-buy-modal-open::-webkit-scrollbar-corner,
body.domain-buy-modal-open::-webkit-scrollbar-corner {
  display: none !important;
  width: 0 !important;
  min-width: 0 !important;
  max-width: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  max-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}

html.domain-buy-modal-open::-webkit-scrollbar-button,
body.domain-buy-modal-open::-webkit-scrollbar-button {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-form-wrap.domain-buy-modal::-webkit-scrollbar-track-piece,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-main::-webkit-scrollbar-track-piece,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-side::-webkit-scrollbar-track-piece,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-form-wrap.domain-buy-modal::-webkit-scrollbar-corner,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-main::-webkit-scrollbar-corner,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-side::-webkit-scrollbar-corner {
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 18px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-head h3 {
  margin: 0;
  color: var(--cl-text);
  font-size: 21px;
  font-weight: 800;
  line-height: 1.35;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-head button.close {
  position: absolute !important;
  top: 20px !important;
  right: 20px !important;
  z-index: 20 !important;
  display: inline-flex !important;
  flex: none;
  align-items: center;
  justify-content: center;
  float: none !important;
  width: 30px !important;
  min-width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 7px;
  box-shadow: none !important;
  opacity: 1;
  transition: background-color .12s ease;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-head button.close:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-head button.close:focus {
  background: rgba(20, 24, 32, .06) !important;
  outline: 0;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-head button.close span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  transition: transform .18s cubic-bezier(.34,1.56,.64,1);
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-head button.close:hover span,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-head button.close:focus span {
  transform: rotate(90deg);
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-head button.close img {
  display: block;
  width: 16px;
  height: 16px;
  object-fit: contain;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-notice-box {
  width: 720px;
  max-width: 100%;
  margin-bottom: 22px;
  padding: 16px 18px;
  background: var(--cl-green-soft);
  border: 1px solid var(--cl-green-line);
  border-radius: 8px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-notice-box strong {
  display: block;
  margin-bottom: 8px;
  color: var(--cl-green-text);
  font-size: 14px;
  font-weight: 800;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-notice-box p {
  position: relative;
  margin: 0 0 4px;
  padding-left: 10px;
  color: var(--cl-text-sub);
  font-size: 12.5px;
  font-weight: 500;
  line-height: 1.55;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-notice-box p::before {
  content: "";
  position: absolute;
  top: .72em;
  left: 0;
  width: 3px;
  height: 3px;
  background: currentColor;
  border-radius: 50%;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-notice-link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: var(--cl-green-text);
  font-weight: 700;
  text-decoration: none;
  vertical-align: baseline;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-notice-link:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-notice-link:focus {
  color: var(--cl-green-text);
  outline: 0;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-notice-link svg {
  flex: none;
  width: 13px;
  height: 13px;
  fill: currentColor;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-notice-renew-content,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-renew-selected-field {
  display: none;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-form-wrap.domain-buy-renew-mode .domain-buy-notice-buy-content,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-form-wrap.domain-buy-renew-mode .domain-buy-usage-options,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-form-wrap.domain-buy-renew-mode .domain-buy-connected-site-field,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-form-wrap.domain-buy-renew-mode .domain-buy-selected-field,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-form-wrap.domain-buy-renew-mode .domain-buy-owner-head,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-form-wrap.domain-buy-renew-mode .domain-buy-owner-form,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-form-wrap.domain-buy-renew-mode .domain-buy-admin-head,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-form-wrap.domain-buy-renew-mode .domain-buy-admin-form {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-form-wrap.domain-buy-renew-mode .domain-buy-notice-renew-content,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-form-wrap.domain-buy-renew-mode .domain-buy-renew-selected-field {
  display: block;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-no-site .domain-buy-usage-options,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-no-site .domain-buy-connected-site-field {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-usage-options {
  display: flex;
  align-items: stretch;
  flex-wrap: wrap;
  gap: 0;
  width: 372px;
  max-width: 100%;
  margin: 25px 0 33px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-usage-option {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 20px;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  color: var(--cl-text);
  font-size: 15px;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: 0;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-usage-option:first-child {
  margin-right: 40px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-usage-option input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-radio-ui {
  position: relative;
  flex: 0 0 20px;
  width: 20px;
  height: 20px;
  margin-right: 6px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 50%;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-radio-ui::after {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 8px;
  height: 8px;
  background: var(--cl-green);
  border-radius: 50%;
  opacity: 0;
  content: "";
  transform: translate(-50%, -50%);
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-usage-option.active {
  background: transparent;
  border-color: transparent;
  color: var(--cl-green-text);
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-usage-option.active .domain-buy-radio-ui {
  border-color: var(--cl-green);
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-usage-option.active .domain-buy-radio-ui::after {
  opacity: 1;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-usage-label {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-width: 0;
  line-height: inherit;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-usage-help-icon.cm-popover-info {
  position: relative;
  top: .5px;
  display: inline-flex;
  flex: 0 0 auto;
  width: 13px;
  height: 13px;
  margin-left: 0;
  fill: var(--cl-green);
  outline: 0;
  cursor: default;
  vertical-align: middle;
  transform: none;
  transition: fill .15s ease, border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-usage-help-icon.cm-popover-info:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-usage-help-icon.cm-popover-info:focus,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-usage-help-icon.cm-popover-info:active {
  fill: var(--cl-green-hover);
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-usage-help-icon.cm-popover-info + .popover {
  z-index: 10004;
  width: 380px;
  max-width: calc(100vw - 32px);
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-usage-help-icon.cm-popover-info + .popover .popover-content {
  padding: 10px 12px;
  color: #222428;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.5;
  text-align: left;
  word-break: keep-all;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-connected-site-field,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-selected-field,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-owner-head,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-admin-head {
  display: grid;
  grid-template-columns: 87px minmax(0, 1fr);
  align-items: center;
  column-gap: 113px;
  width: 100%;
  max-width: 720px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-connected-site-field {
  margin: 0 0 40px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-selected-field {
  margin: 0 0 30px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-owner-head {
  margin: 0 0 24px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-admin-head {
  margin: 40px 0 24px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-connected-site-field > label,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-selected-field > label,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-owner-title,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-admin-title {
  display: block;
  margin: 0;
  color: var(--cl-text);
  font-size: 16px;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: 0;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-field > span {
  display: flex;
  align-items: center;
  gap: 0;
  margin-bottom: 12px;
  color: var(--cl-text-sub);
  font-size: 14px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-field-label,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-owner-name-ko-label,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-owner-name-en-label {
  margin: 0;
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-connected-site-field > .domain-buy-site-dropdown,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-selected-field > .domain-buy-selected,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-owner-head > .domain-buy-segment,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-admin-head > .domain-buy-segment,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-admin-head > .domain-buy-admin-same-label {
  width: 100%;
  max-width: 520px;
  min-width: 0;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-selected-field::after {
  content: "";
  display: block;
  grid-column: 2;
  width: 100%;
  max-width: 520px;
  height: 1px;
  margin-top: 40px;
  background: var(--cl-line);
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-selected {
  display: flex;
  align-items: center;
  width: 100%;
  max-width: 520px;
  min-height: 40px;
  gap: 0;
  min-width: 0;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-selected > span {
  flex: 0 1 auto;
  min-width: 0;
  max-width: 260px;
  overflow: hidden;
  color: var(--cl-text);
  font-size: 16px;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: 0;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-years-dropdown {
  flex: 0 0 100px;
  width: 100px;
  margin-left: 20px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-selected strong {
  flex: 0 0 120px;
  width: 120px;
  margin-left: auto;
  color: var(--cl-green-text);
  font-size: 16px;
  font-weight: 600;
  line-height: 1.5;
  text-align: right;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-owner-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 8px;
  row-gap: 24px;
  width: calc(100% - 200px);
  min-width: 0;
  max-width: 520px;
  margin-top: 0;
  margin-left: 200px;
  margin-bottom: 24px;
  padding-bottom: 24px;
  border-bottom: 1px solid var(--cl-line);
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-admin-form {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: 0;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-field {
  display: flex;
  flex-direction: column;
  gap: 7px;
  min-width: 0;
  margin: 0;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-field.domain-buy-wide {
  grid-column: 1 / -1;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-company-field {
  display: none;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-company-mode .domain-buy-company-field {
  display: flex;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-required-icon {
  display: inline-flex;
  width: 12px;
  height: 12px;
  margin-left: 3px;
  color: var(--cl-danger);
  vertical-align: -2px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-required-icon svg {
  width: 12px;
  height: 12px;
  fill: currentColor;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-field .form-control,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-phone-row .form-control {
  width: 100%;
  height: 40px;
  padding: 0 12px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 5px;
  box-shadow: none;
  color: var(--cl-text);
  font-size: 15px;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: 0;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-field .form-control::placeholder,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-phone-row .form-control::placeholder {
  font-size: 15px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-field .form-control:focus,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-phone-row .form-control:focus {
  border-color: var(--cl-green);
  outline: 0;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .1);
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-address-base[readonly] {
  background: #f4f5f8 !important;
  border-color: #e1e4e8 !important;
  color: var(--cl-text-sub) !important;
  cursor: default;
  -webkit-text-fill-color: var(--cl-text-sub);
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-address-base[readonly]:focus {
  border-color: #e1e4e8 !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-input-action {
  display: flex;
  align-items: center;
  gap: 8px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-input-action .form-control {
  flex: 1 1 auto;
  min-width: 0;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-sub-action {
  display: inline-flex;
  flex: 0 0 120px;
  align-items: center;
  justify-content: center;
  width: 120px;
  min-width: 120px;
  height: 40px;
  padding: 0;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 5px;
  color: var(--cl-text) !important;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.5;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-sub-action:hover {
  background: var(--cl-green-soft) !important;
  border-color: var(--cl-green-line) !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-sub-action.primary {
  flex: 0 0 120px;
  width: 120px;
  min-width: 120px;
  height: 40px;
  padding: 0;
  border-radius: 5px;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: 0;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-sub-action.primary:not(:disabled):not([disabled]):hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-sub-action.primary:not(:disabled):not([disabled]):focus {
  background: var(--cl-green-hover) !important;
  border-color: var(--cl-green-hover) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-sub-action:disabled,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-sub-action[disabled],
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-sub-action:disabled:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-sub-action[disabled]:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-sub-action:disabled:focus,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-sub-action[disabled]:focus {
  background: #f4f5f9 !important;
  background-color: #f4f5f9 !important;
  border-color: #e5e7e9 !important;
  border-radius: 5px !important;
  color: #d1d3d5 !important;
  -webkit-text-fill-color: #d1d3d5;
  cursor: not-allowed;
  opacity: 1;
  box-shadow: none;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-sub-action.primary:disabled,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-sub-action.primary[disabled],
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-sub-action.primary:disabled:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-sub-action.primary[disabled]:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-sub-action.primary:disabled:focus,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-sub-action.primary[disabled]:focus {
  background: #d2d6db !important;
  background-color: #d2d6db !important;
  border-color: #d2d6db !important;
  border-radius: 5px !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff;
  cursor: not-allowed;
  opacity: 1;
  box-shadow: none;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-phone-row {
  display: flex;
  align-items: center;
  gap: 8px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-phone-separator {
  flex: none;
  width: 6px;
  height: 1px;
  background: var(--cl-text-muted);
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-segment {
  display: flex;
  width: 100%;
  max-width: 520px;
  height: 40px;
  margin: 0;
  padding: 0;
  background: transparent;
  border-radius: 0;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-segment button {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 1 1 0;
  min-width: 0;
  height: 40px;
  margin: 0;
  padding: 0 12px;
  background: #fff !important;
  border: 1px solid #e5e7e9 !important;
  border-radius: 0;
  color: #8e9095 !important;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: 0;
  text-align: center;
  outline: 0;
  box-shadow: none;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-segment button + button {
  margin-left: -1px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-segment button:first-child {
  border-radius: 5px 0 0 5px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-segment button:last-child {
  border-radius: 0 5px 5px 0;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-segment button:not(.active):hover {
  z-index: 1;
  border-color: var(--cl-green-line) !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-segment button.active {
  z-index: 1;
  background: #fff !important;
  border-color: var(--cl-green) !important;
  color: var(--cl-green-text) !important;
  box-shadow: none;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-segment-check {
  display: none;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-owner-type-segment .domain-buy-segment-check {
  align-items: center;
  justify-content: center;
  flex: 0 0 14px;
  width: 14px;
  height: 10px;
  margin-right: 6px;
  line-height: 0;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-owner-type-segment button.active .domain-buy-segment-check {
  display: inline-flex;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-owner-type-segment .domain-buy-segment-check svg {
  display: block;
  width: 14px;
  height: 10px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-owner-type-segment .domain-buy-segment-check path {
  fill: currentColor;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-field-error {
  display: flex;
  align-items: flex-start;
  gap: 5px;
  margin-top: 3px;
  color: var(--cl-danger);
  font-size: 12px;
  font-weight: 600;
  line-height: 1.4;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-field-error-icon svg,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-email-auth-icon svg {
  width: 14px;
  height: 14px;
  fill: currentColor;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-field-error-control {
  border-color: var(--cl-danger) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-email-auth-message {
  align-items: center;
  gap: 6px;
  color: var(--cl-green-text);
  font-size: 12px;
  font-weight: 700;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-payment-section {
  margin-bottom: 28px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-payment-section h4 {
  margin: 0 0 16px;
  color: var(--cl-text);
  font-size: 17px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-payment-amount-section {
  margin-bottom: 0;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-payment-method {
  display: grid;
  width: 100%;
  gap: 8px;
}

body.cl-dashboard-redesign-page .domain-buy-form-wrap.domain-buy-modal .domain-buy-agreements {
  display: grid !important;
  width: 100% !important;
  max-width: 360px !important;
  margin-top: 16px !important;
  gap: 12px !important;
}

body.cl-dashboard-redesign-page .domain-buy-form-wrap.domain-buy-modal .domain-buy-agreements label {
  position: relative;
  display: flex !important;
  align-items: flex-start !important;
  min-height: 20px !important;
  gap: 0 !important;
  margin: 0 !important;
  color: var(--cl-text) !important;
  font-size: 15px !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .domain-buy-form-wrap.domain-buy-modal .domain-buy-agreements label span {
  flex: 1 1 auto;
  min-width: 0;
}

body.cl-dashboard-redesign-page .domain-buy-form-wrap.domain-buy-modal .domain-buy-agreements .domain-buy-agree {
  -webkit-appearance: none !important;
  appearance: none !important;
  box-sizing: border-box !important;
  display: block !important;
  flex: 0 0 20px !important;
  width: 20px !important;
  min-width: 20px !important;
  max-width: 20px !important;
  height: 20px !important;
  min-height: 20px !important;
  max-height: 20px !important;
  margin: 0 4px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background-color: transparent !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' width='20' height='20'%3E%3Cpath fill='none' d='M0 0h20v20H0z'/%3E%3Cpath fill='%23fff' d='M5 2h10c1.66 0 3 1.34 3 3v10c0 1.66-1.34 3-3 3H5c-1.66 0-3-1.34-3-3V5c0-1.66 1.34-3 3-3'/%3E%3Cpath fill='%23d2d6db' d='M15 3.25c.97 0 1.75.78 1.75 1.75v10c0 .97-.78 1.75-1.75 1.75H5c-.97 0-1.75-.78-1.75-1.75V5c0-.97.78-1.75 1.75-1.75zM15 2H5C3.34 2 2 3.34 2 5v10c0 1.66 1.34 3 3 3h10c1.66 0 3-1.34 3-3V5c0-1.66-1.34-3-3-3'/%3E%3C/svg%3E") !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: 20px 20px !important;
  box-shadow: none !important;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .domain-buy-form-wrap.domain-buy-modal .domain-buy-agreements label:hover .domain-buy-agree:not(:checked) {
  background-color: transparent !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' width='20' height='20'%3E%3Cpath fill='%23e4f7ec' d='M5 2h10c1.66 0 3 1.34 3 3v10c0 1.66-1.34 3-3 3H5c-1.66 0-3-1.34-3-3V5c0-1.66 1.34-3 3-3'/%3E%3Cpath fill='%2393ddb6' d='M15 3.25c.97 0 1.75.78 1.75 1.75v10c0 .97-.78 1.75-1.75 1.75H5c-.97 0-1.75-.78-1.75-1.75V5c0-.97.78-1.75 1.75-1.75zM15 2H5C3.34 2 2 3.34 2 5v10c0 1.66 1.34 3 3 3h10c1.66 0 3-1.34 3-3V5c0-1.66-1.34-3-3-3'/%3E%3C/svg%3E") !important;
}

body.cl-dashboard-redesign-page .domain-buy-form-wrap.domain-buy-modal .domain-buy-agreements .domain-buy-agree:checked {
  background-color: transparent !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' width='20' height='20'%3E%3Cpath fill='%2303C75A' d='M15 2H5C3.34 2 2 3.34 2 5v10c0 1.66 1.34 3 3 3h10c1.66 0 3-1.34 3-3V5c0-1.66-1.34-3-3-3m.03 6.03-5.5 5.5c-.29.29-.77.29-1.06 0l-3.5-3.5a.754.754 0 0 1 0-1.06c.29-.29.77-.29 1.06 0L9 11.94l4.97-4.97c.3-.29.77-.28 1.06.02.28.29.28.75 0 1.04'/%3E%3C/svg%3E") !important;
}

body.cl-dashboard-redesign-page .domain-buy-form-wrap.domain-buy-modal .domain-buy-agreements .domain-buy-agree:focus {
  outline: 0;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .14) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-payment-option {
  position: relative;
  width: 100%;
  background: #fff;
  border: 0;
  border-radius: 5px;
  box-sizing: border-box;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-payment-option.is-active {
  box-shadow: none;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-payment-card-option {
  min-height: 238px;
  padding: 20px 17px;
  overflow: hidden;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-payment-card-option:not(.is-active) {
  min-height: 60px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-payment-option-head,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-payment-vbank-option {
  display: flex;
  align-items: center;
  height: 20px;
  color: #222428;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: 0;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-payment-option-head {
  margin: 0;
  padding: 0;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-payment-option label,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-payment-option-head label {
  display: inline-flex;
  align-items: center;
  width: 100%;
  min-height: 0;
  margin: 0;
  padding: 0;
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-payment-option-head label > span,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-payment-vbank-option label > span {
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-payment-option input[name="domain-buy-payment-method"] {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  border: 0;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-payment-option .newcheckboxSvg {
  position: relative;
  flex: 0 0 20px;
  width: 20px;
  height: 20px;
  margin: -2px 9px 0 -2px;
  line-height: 0;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-payment-option .newcheckboxSvg input[name="domain-buy-payment-method"] {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  border: 0;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-payment-option .newcheckboxSvg svg {
  position: absolute;
  top: 0;
  left: 0;
  display: block !important;
  width: 20px;
  height: 20px;
  fill: #d2d6db;
  opacity: 1;
  cursor: pointer;
  transition: opacity .18s ease, fill .15s ease, border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-payment-option .newcheckboxSvg svg.active {
  fill: var(--cl-green);
  opacity: 0;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-payment-option .newcheckboxSvg input[name="domain-buy-payment-method"]:checked ~ svg:not(.active) {
  opacity: 0;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-payment-option .newcheckboxSvg input[name="domain-buy-payment-method"]:checked ~ svg.active {
  opacity: 1;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-payment-option:not(.is-active):hover .newcheckboxSvg svg:not(.active),
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-payment-option:not(.is-active):hover .newcheckboxSvg svg.active {
  fill: var(--cl-green-hover);
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-payment-vbank-option {
  height: 60px;
  padding: 20px 17px;
  color: #b1b3b7;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-payment-option:not(.is-active) .domain-buy-payment-option-head {
  color: #b1b3b7;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-payment-option.is-active .domain-buy-payment-option-head,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-payment-vbank-option.is-active {
  color: #222428;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-payment-card-list.plan-inline-card-select {
  width: 328px;
  max-width: 100%;
  min-height: 0;
  margin: 20px auto 0;
  padding: 0;
  overflow: visible;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-payment-option:not(.is-active) .domain-buy-payment-card-list {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-payment-card-option:not(.is-active) #domain-buy-payment-card {
  display: none;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_list_container {
  position: relative;
  width: 328px !important;
  max-width: 100% !important;
  height: 158px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #fff !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_list_container::before,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_list_container::after {
  content: "";
  position: absolute;
  top: 0;
  z-index: 4;
  width: 40px;
  height: 131px;
  pointer-events: none;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_list_container::before {
  left: 0;
  background: linear-gradient(to right, #fff 0, #fff 20px, rgba(255, 255, 255, 0) 100%);
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_list_container::after {
  right: 0;
  background: linear-gradient(to left, #fff 0, #fff 20px, rgba(255, 255, 255, 0) 100%);
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_arrow {
  position: absolute !important;
  top: 65px !important;
  z-index: 6 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 40px !important;
  min-width: 40px !important;
  height: 40px !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 50% !important;
  background: #fff !important;
  color: #8a8f98 !important;
  box-shadow: 0 4px 12px rgba(20, 24, 32, .12) !important;
  opacity: 1 !important;
  visibility: visible !important;
  cursor: pointer !important;
  transform: translateY(-50%) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_arrow_prev {
  left: 0 !important;
  transform: translateY(-50%) rotate(180deg) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_arrow_next {
  right: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_arrow:disabled {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_arrow:not(:disabled):hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_arrow:not(:disabled):focus {
  background: #f8f9fb !important;
  color: var(--cl-text) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_arrow svg {
  display: block !important;
  width: 8px !important;
  height: 14px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_viewport {
  position: relative;
  width: calc(100% - 40px) !important;
  max-width: 288px !important;
  height: 130px !important;
  margin: 0 auto !important;
  padding-bottom: 0 !important;
  overflow: visible !important;
  clip-path: inset(-100vmax 0 -100vmax 0) !important;
  filter: none !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_ul {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-start;
  gap: 9px;
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
  box-sizing: border-box;
  transition: transform .26s ease;
  will-change: transform;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_add_wrap {
  position: relative;
  display: block;
  flex: 0 0 230px;
  width: 230px;
  height: 130px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  box-sizing: border-box;
  z-index: 1;
  opacity: .3;
  transition: opacity .26s ease;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap.active,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_add_wrap.active {
  z-index: 2;
  opacity: 1;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_card,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_add_button {
  width: 230px !important;
  height: 130px !important;
  padding: 15px 10px !important;
  border-radius: 15px !important;
  box-sizing: border-box !important;
  transform: translateX(var(--paycard-inline-gap-shift, 0px)) scale(.923077) !important;
  transform-origin: center center !important;
  transition: transform .26s ease, background-color .26s ease, border-color ease-in-out .15s, box-shadow ease-in-out .15s !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_card {
  position: relative;
  overflow: hidden;
  border: 0;
  background: #afbac8;
  color: #fff;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap.jp-card-identified:not(.expired):not(.paycard_add_wrap) .paycard_card::before,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap.expired[class*="jp-card-"]:not(.paycard_add_wrap) .paycard_card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  display: block;
  border-radius: 15px;
  background-color: transparent !important;
  background-image:
    repeating-linear-gradient(45deg, rgba(255, 255, 255, 0) 1px, rgba(255, 255, 255, .03) 2px, rgba(255, 255, 255, .04) 3px, rgba(255, 255, 255, .05) 4px),
    repeating-linear-gradient(135deg, rgba(255, 255, 255, .05) 1px, rgba(255, 255, 255, 0) 2px, rgba(255, 255, 255, .04) 3px, rgba(255, 255, 255, .03) 4px),
    linear-gradient(-25deg, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, .2) 70%, rgba(255, 255, 255, 0) 90%) !important;
  pointer-events: none;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap.jp-card-visa:not(.expired) .paycard_card,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap.jp-card-visaelectron:not(.expired) .paycard_card {
  background-color: #191278 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap.jp-card-mastercard:not(.expired) .paycard_card {
  background-color: #0061a8 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap.jp-card-maestro:not(.expired) .paycard_card {
  background-color: #174160 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap.jp-card-amex:not(.expired) .paycard_card {
  background-color: #a6bbe1 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap.jp-card-discover:not(.expired) .paycard_card {
  background-color: #3d392e !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap.jp-card-dinersclub:not(.expired) .paycard_card {
  background-color: #8baeae !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap.jp-card-dankort:not(.expired) .paycard_card {
  background-color: #0055c7 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap.jp-card-jcb:not(.expired) .paycard_card {
  background-color: #f8a61b !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap.expired .paycard_card {
  border: 0 !important;
  color: #fff !important;
  cursor: default !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap.expired.jp-card-visa .paycard_card,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap.expired.jp-card-visaelectron .paycard_card {
  background-color: #191278 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap.expired.jp-card-mastercard .paycard_card {
  background-color: #0061a8 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap.expired.jp-card-maestro .paycard_card {
  background-color: #174160 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap.expired.jp-card-amex .paycard_card {
  background-color: #a6bbe1 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap.expired.jp-card-discover .paycard_card {
  background-color: #3d392e !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap.expired.jp-card-dinersclub .paycard_card {
  background-color: #8baeae !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap.expired.jp-card-dankort .paycard_card {
  background-color: #0055c7 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap.expired.jp-card-jcb .paycard_card {
  background-color: #f8a61b !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap.expired .paycard_expired_badge {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_expired_overlay {
  position: absolute !important;
  inset: 0 !important;
  z-index: 2 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 230px !important;
  height: 130px !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 15px !important;
  box-sizing: border-box !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_expired_overlay::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  width: 230px !important;
  height: 130px !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 15px !important;
  background: #000 !important;
  opacity: .55 !important;
  -webkit-backdrop-filter: blur(1px) !important;
  backdrop-filter: blur(1px) !important;
  box-sizing: border-box !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_expired_overlay_icon {
  position: relative !important;
  z-index: 1 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 16px !important;
  height: 16px !important;
  margin: 0 4px 0 0 !important;
  color: #fff !important;
  line-height: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_expired_overlay_icon svg {
  display: block !important;
  width: 16px !important;
  height: 16px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_expired_overlay_text {
  position: relative !important;
  z-index: 1 !important;
  display: block !important;
  width: auto !important;
  height: 20px !important;
  margin: 0 !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 20px !important;
  text-align: center !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap.expired:not(.paycard_add_wrap) .card_nickname,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap.expired:not(.paycard_add_wrap) .paycard_number,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap.expired:not(.paycard_add_wrap) .paycard_last,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap.expired:not(.paycard_add_wrap) .paycard_exp,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap.expired:not(.paycard_add_wrap) .paycard_brand_logo {
  color: #fff !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap.expired:not(.paycard_add_wrap) .paycard_badge {
  border-color: #fff !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap.expired:not(.paycard_add_wrap) .paycard_mask::before {
  background-color: #fff !important;
  box-shadow: 7px 0 0 #fff, 14px 0 0 #fff, 21px 0 0 #fff !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap:not(.expired):not(.paycard_add_wrap) .card_nickname,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap:not(.expired):not(.paycard_add_wrap) .paycard_number,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap:not(.expired):not(.paycard_add_wrap) .paycard_last,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap:not(.expired):not(.paycard_add_wrap) .paycard_exp {
  color: #fff !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap:not(.expired):not(.paycard_add_wrap) .paycard_badge {
  border-color: #fff !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap:not(.expired):not(.paycard_add_wrap) .paycard_mask::before {
  background-color: #fff !important;
  box-shadow: 7px 0 0 #fff, 14px 0 0 #fff, 21px 0 0 #fff !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_card_head {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  height: 18px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .card_nickname {
  display: block;
  flex: 1 1 auto;
  min-width: 0;
  max-width: 118px;
  height: 18px;
  overflow: hidden;
  font-size: 12px;
  line-height: 18px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  height: 18px;
  min-width: 76px;
  max-width: 76px;
  margin-left: auto;
  padding: 0 7px;
  border: 1px solid currentColor;
  border-radius: 10px;
  box-sizing: border-box;
  font-size: 10px;
  line-height: 16px;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_number {
  display: flex;
  align-items: center;
  gap: 8px;
  height: 18px;
  margin-top: 10px;
  margin-left: 0;
  font-size: 12px;
  line-height: 18px;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_mask {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  flex: 0 0 25px;
  width: 25px;
  min-width: 25px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_mask::before {
  content: "";
  width: 4px;
  height: 4px;
  border-radius: 50%;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_exp {
  position: absolute !important;
  left: 10px !important;
  bottom: 15px !important;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 8px;
  height: 17px;
  margin: 0;
  font-size: 11px;
  line-height: 17px;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_brand_logo {
  position: absolute !important;
  right: 10px !important;
  bottom: 15px !important;
  z-index: 1;
  display: block;
  color: #fff;
  line-height: 0;
  pointer-events: none;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_brand_logo svg {
  display: block;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_brand_visa svg,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_brand_visaelectron svg {
  width: 42px;
  height: auto;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_brand_mastercard svg,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_brand_maestro svg {
  width: 42px;
  height: 26px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_brand_amex svg {
  width: 36px;
  height: 36px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_brand_discover svg {
  width: 50px;
  height: 32px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_brand_dinersclub svg {
  width: 76px;
  height: 20px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_brand_dankort svg {
  width: 48px;
  height: 29px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_brand_jcb svg {
  width: 39px;
  height: 30px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_card > * {
  position: relative;
  z-index: 1;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_add_button {
  display: flex !important;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: #ffffff80 !important;
  border: 1px dashed var(--cl-green) !important;
  color: var(--cl-green-text) !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap.active .paycard_card,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_add_wrap.active .paycard_add_button {
  transform: scale(1) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap.active .paycard_card {
  box-shadow: 0 5px 15px rgba(0, 0, 0, .15) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap:has(~ .paycard_wrap.active) .paycard_card,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap:has(~ .paycard_wrap.active) .paycard_add_button,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap:has(~ .paycard_wrap.drag-preview-active) .paycard_card,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap:has(~ .paycard_wrap.drag-preview-active) .paycard_add_button {
  transform-origin: right center !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap.active ~ .paycard_wrap .paycard_card,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap.active ~ .paycard_wrap .paycard_add_button,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap.drag-preview-active ~ .paycard_wrap .paycard_card,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap.drag-preview-active ~ .paycard_wrap .paycard_add_button {
  transform-origin: left center !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap.active .paycard_card,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_add_wrap.active .paycard_add_button {
  -webkit-clip-path: none;
  clip-path: none;
  -webkit-mask-image: none;
  mask-image: none;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap.drag-preview-before .paycard_card,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap.drag-preview-before .paycard_add_button {
  transform: translateX(var(--drag-preview-inline-before-shift, var(--paycard-inline-gap-shift, 0px))) scale(.923077) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap.drag-preview-after .paycard_card,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap.drag-preview-after .paycard_add_button {
  transform: translateX(var(--drag-preview-inline-after-shift, var(--paycard-inline-gap-shift, 0px))) scale(.923077) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap.drag-preview-inactive .paycard_card,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap.drag-preview-inactive .paycard_add_button,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap.drag-preview-active .paycard_card,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_wrap.drag-preview-active .paycard_add_button {
  -webkit-clip-path: none;
  clip-path: none;
  -webkit-mask-image: none !important;
  mask-image: none !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_add_wrap:hover .paycard_add_button,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_add_button:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_add_button:focus {
  background: #ffffffb3 !important;
  border-color: var(--cl-green) !important;
  color: var(--cl-green-text) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_add_icon {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px !important;
  height: 24px !important;
  margin-bottom: 8px !important;
  border-radius: 50%;
  background-color: var(--cl-green) !important;
  transition: background-color .15s ease, border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_add_wrap:hover .paycard_add_icon,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_add_button:hover .paycard_add_icon,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_add_button:focus .paycard_add_icon {
  background-color: var(--cl-green-hover) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_add_icon::before,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_add_icon::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 12px;
  height: 1px;
  background-color: #fff !important;
  transform: translate(-50%, -0.5px);
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_add_icon::after {
  transform: translate(-50%, -0.5px) rotate(90deg);
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_add_text {
  color: var(--cl-green-text) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
  transition: color .15s ease, border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_add_wrap:hover .paycard_add_text,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_add_button:hover .paycard_add_text,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_add_button:focus .paycard_add_text {
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_dots {
  display: flex;
  justify-content: center;
  margin: 12px auto 0;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_dot {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 15px;
  height: 15px;
  padding: 5px;
  border: 0;
  background: transparent;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_dot::before {
  content: "";
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background-color: #c4c6ca;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-payment-card.plan-inline-card-select.cl-selectCard .paycard_dot.active::before {
  background-color: #222428 !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-payment-card-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 158px;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  color: #b1b3b7;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.5;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-payment-box {
  padding: 24px 20px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-payment-total {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-payment-total span {
  color: var(--cl-text);
  font-size: 16px;
  font-weight: 600;
  line-height: 1.5;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-payment-total strong {
  color: var(--cl-green-text);
  font-size: 24px;
  font-weight: 700;
  line-height: 1.5;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-payment-line {
  height: 1px;
  margin: 18px 0;
  background: var(--cl-line);
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-payment-notice {
  position: relative;
  margin: 11px 0 0;
  padding-left: 11px;
  color: var(--cl-text-sub);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.65;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-payment-notice::before {
  content: "";
  position: absolute;
  top: .72em;
  left: 0;
  width: 3px;
  height: 3px;
  background: currentColor;
  border-radius: 50%;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-actions {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 10px;
  width: 100%;
  max-width: 360px;
  margin-top: 40px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-form-wrap.domain-buy-modal .domain-buy-actions > #domain-buy-purchase-btn.btn.btn-primary {
  display: flex !important;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 50px !important;
  min-height: 50px !important;
  max-height: 50px !important;
  padding: 0 !important;
  border-radius: 5px !important;
  box-sizing: border-box !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  line-height: 1.5 !important;
  letter-spacing: 0 !important;
  text-decoration: none !important;
  background: var(--cl-green) !important;
  border: 1px solid var(--cl-green) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-form-wrap.domain-buy-modal .domain-buy-actions > #domain-buy-purchase-btn.btn.btn-primary:hover,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-form-wrap.domain-buy-modal .domain-buy-actions > #domain-buy-purchase-btn.btn.btn-primary:focus {
  background: var(--cl-green-hover) !important;
  border-color: var(--cl-green-hover) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-toast {
  position: fixed;
  z-index: 10004;
  display: flex;
  align-items: center;
  width: auto;
  min-width: 0;
  max-width: calc(100vw - 40px);
  height: 50px;
  padding: 16px;
  border-radius: 12px;
  background: rgba(34, 36, 40, .85);
  box-shadow: 0 8px 16px rgba(0, 0, 0, .1);
  color: #fff;
  box-sizing: border-box;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-toast-icon {
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
  margin-right: 10px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-toast-icon svg {
  display: block;
  width: 13px;
  height: 13px;
  margin: 1.5px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-toast-icon svg path {
  fill: currentColor;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-toast.is-error .domain-buy-toast-icon {
  color: #ee445f;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-toast.is-error .domain-buy-toast-icon svg,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-toast.is-success .domain-buy-toast-icon svg {
  width: 16px;
  height: 16px;
  margin: 0;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-toast.is-success .domain-buy-toast-icon {
  color: #00c82a;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-toast-text {
  color: #fff;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.5;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-renew-table {
  overflow: visible;
  border: 1px solid var(--cl-line);
  border-radius: 8px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-renew-table-head,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-renew-table-row {
  display: grid;
  grid-template-columns: minmax(150px, 1fr) minmax(140px, .8fr) minmax(230px, .95fr);
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-renew-table-head {
  background: #f8f9fb;
  border-bottom: 1px solid var(--cl-line);
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-renew-table-head span,
body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-renew-table-row > span {
  min-width: 0;
  padding: 10px 12px;
  color: var(--cl-text-sub);
  font-size: 12.5px;
  font-weight: 700;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-renew-table-row > span {
  display: flex;
  align-items: center;
  color: var(--cl-text);
  line-height: 1.5;
  font-size: 14px;
  font-weight: 400;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-renew-table-row > span:not(.domain-buy-renew-period) {
  overflow: hidden;
  text-overflow: ellipsis;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-renew-period {
  display: flex;
  align-items: center;
  gap: 8px;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-renew-period .domain-buy-years-dropdown {
  flex: 0 0 80px;
  width: 80px;
  margin-left: 0;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-renew-period #domain-buy-renew-unit-price {
  flex: 0 0 auto;
  min-width: max-content;
  color: #b1b3b7;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.5;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-renew-total {
  padding-top: 10px;
  color: var(--cl-text);
  font-size: 18px;
  font-weight: 600;
  text-align: right;
  padding-right: 60px;
  padding-bottom: 10px;
  border-top: 1px solid var(--cl-line);
}

@media (max-width: 1024px) {
  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-form-wrap.domain-buy-modal {
    top: 24px;
    width: calc(100vw - 32px);
    max-height: calc(100vh - 48px);
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-form-wrap.domain-buy-modal[style*="display: flex"],
  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-form-wrap.domain-buy-modal[style*="display:flex"] {
    flex-direction: column;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-main,
  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-side {
    flex: none;
    width: 100%;
    max-height: none;
    overflow: visible;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-form-wrap.domain-buy-modal {
    overflow-y: auto;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-side {
    border-top: 1px solid var(--cl-line);
    border-left: 0;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-notice-box {
    width: 100%;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-connected-site-field,
  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-selected-field,
  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-owner-head,
  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-admin-head,
  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-owner-form,
  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-selected-field > .domain-buy-selected,
  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-owner-head > .domain-buy-segment,
  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-admin-head > .domain-buy-segment,
  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-connected-site-field > .domain-buy-site-dropdown,
  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-admin-head > .domain-buy-admin-same-label,
  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-actions,
  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-selected-field::after {
    max-width: none;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-form-wrap.domain-buy-modal .domain-buy-agreements {
    max-width: none !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-agreements label span {
    white-space: normal;
    overflow-wrap: break-word;
  }
}

@media (min-width: 835px) and (max-width: 1024px) {
  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-main {
    padding-left: 28px;
    padding-right: 28px;
  }
}

@media (max-width: 760px) {
  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-modal-main {
    padding-left: 28px;
    padding-right: 28px;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-content {
    padding: 22px 16px 34px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-search-head,
  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-search-meta,
  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-result-row,
  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-selected {
    flex-wrap: wrap;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-input-action {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 120px;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-phone-row .form-control {
    flex: 1 1 0;
    min-width: 0;
    padding: 0 6px;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-result-years,
  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-result-regular-price,
  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-result-sale-price,
  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-result-action,
  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-result-unavailable-status {
    flex: 1 1 auto;
    text-align: left;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-connected-site-field,
  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-selected-field,
  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-owner-head,
  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-owner-form {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    column-gap: 0;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-admin-head {
    grid-template-columns: max-content minmax(0, 1fr);
    column-gap: 12px;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-field.domain-buy-wide {
    grid-column: auto;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-selected-field::after {
    grid-column: 1;
    max-width: 100%;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-toast {
    width: max-content;
    min-height: 50px;
    height: auto;
    padding: 14px 16px;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.buy #domain-buy-toast-text {
    display: block;
    flex: 1 1 auto;
    min-width: 0;
    max-width: calc(100vw - 98px);
    overflow: visible;
    white-space: normal;
    word-break: keep-all;
    overflow-wrap: break-word;
  }

  body.cl-dashboard-redesign-page.domain-buy-modal-open #addr-modal.domain-buy-address-modal,
  body.cl-dashboard-redesign-page.domain-flow-address-modal-open #addr-modal.domain-flow-address-modal {
    width: calc(100vw - 24px) !important;
    height: calc(100vh - 40px) !important;
    height: min(620px, calc(100vh - 40px)) !important;
    max-width: calc(100vw - 24px) !important;
    max-height: calc(100vh - 40px) !important;
    border-radius: 12px !important;
  }

  body.cl-dashboard-redesign-page.domain-buy-modal-open #addr-modal.domain-buy-address-modal > .close,
  body.cl-dashboard-redesign-page.domain-flow-address-modal-open #addr-modal.domain-flow-address-modal > .close {
    height: 50px !important;
    padding: 0 52px !important;
    font-size: 15px !important;
  }

  body.cl-dashboard-redesign-page.domain-buy-modal-open #addr-modal.domain-buy-address-modal #addr-body,
  body.cl-dashboard-redesign-page.domain-flow-address-modal-open #addr-modal.domain-flow-address-modal #addr-body {
    height: calc(100% - 50px) !important;
  }
}

@media (max-width: 360px) {
  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .breadcrumb.cl-source-domain-breadcrumb {
    min-width: 0;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .breadcrumb.cl-source-domain-breadcrumb > a,
  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .breadcrumb.cl-source-domain-breadcrumb > .current,
  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .breadcrumb.cl-source-domain-breadcrumb > .sep {
    flex: none;
    white-space: nowrap;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .breadcrumb.cl-source-domain-breadcrumb > a:first-child:nth-last-child(5) {
    flex: 0 1 70px;
    display: block;
    max-width: 70px;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  body.cl-dashboard-redesign-page .cl-source-domain-page.buy .domain-buy-site-dropdown .domain-buy-site-dropdown-text {
    flex: 0 1 70px;
    width: 100%;
    max-width: 70px;
  }
}

/* Source plan and billing pages */
body.cl-dashboard-redesign-page .cl-dashboard-redesign.dashboard.cl-source-plan-shell {
  display: none !important;
}

body.cl-dashboard-redesign-page .sub.sub-page.cl-source-plan-page {
  /* Keep the page in document flow below the fixed app header on mobile. */
  position: static;
  inset: auto;
  height: auto;
  overflow: visible;
  z-index: auto;
  width: auto !important;
  max-width: none !important;
  min-height: calc(100vh - var(--cl-source-topbar-h));
  margin-top: 0 !important;
  margin-right: var(--cl-source-app-gutter) !important;
  margin-left: calc(var(--cl-source-app-gutter) + var(--cl-source-sidebar-w)) !important;
  padding: 36px 32px 60px !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-redesign.dashboard.cl-source-plan-shell > .container,
body.cl-dashboard-redesign-page .cl-dashboard-redesign.dashboard.cl-source-plan-shell > .container > .multi-columns-row {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page,
body.cl-dashboard-redesign-page .cl-source-plan-page * {
  box-sizing: border-box;
}

body.cl-dashboard-redesign-page .cl-source-plan-page {
  width: 100% !important;
  max-width: 1127px !important;
  min-height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  color: var(--cl-text);
}

body.cl-dashboard-redesign-page .cl-source-plan-page .mobile-title {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page > .container,
body.cl-dashboard-redesign-page .cl-source-plan-page .container,
body.cl-dashboard-redesign-page .cl-source-plan-page .row,
body.cl-dashboard-redesign-page .cl-source-plan-page .plan-wrapper {
  float: none !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .breadcrumb {
  display: block !important;
  margin: 0 0 12px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: var(--cl-text) !important;
  font-size: 0 !important;
  line-height: 1.4 !important;
  list-style: none !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .breadcrumb > li {
  display: block !important;
  padding: 0 !important;
  color: inherit !important;
  font-size: 0 !important;
  line-height: inherit !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .cl-source-plan-root,
body.cl-dashboard-redesign-page .cl-source-plan-page .cl-source-plan-current {
  display: inline-block;
  color: var(--cl-text);
  font-size: 21px;
  font-weight: 800;
  line-height: 28px;
  vertical-align: middle;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .cl-source-plan-current {
  color: var(--cl-text-sub);
}

body.cl-dashboard-redesign-page .cl-source-plan-page .cl-source-plan-sep {
  display: inline-block;
  margin: 0 8px;
  color: var(--cl-text-muted);
  font-size: 22px;
  font-weight: 500;
  line-height: 28px;
  vertical-align: middle;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .breadcrumb p {
  margin: 11px 0 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-tab-wrap {
  position: relative !important;
  width: 760px !important;
  max-width: 100% !important;
  min-height: 0 !important;
  height: 51px !important;
  margin: 22px 0 0 !important;
  padding: 0 24px !important;
  overflow: visible !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-bottom: 0 !important;
  border-radius: 12px 12px 0 0 !important;
  list-style: none !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-tab-wrap::before {
  content: "" !important;
  position: absolute !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  z-index: 1 !important;
  height: 1px !important;
  background: var(--cl-border) !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .cl-source-billing-history-page .plan-tab-wrap {
  width: 990px !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-tab-wrap .submenu_nav {
  display: flex !important;
  float: none !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-tab {
  position: relative !important;
  z-index: 2 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 28px !important;
  width: auto !important;
  max-width: none !important;
  min-height: 0 !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  list-style: none !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-tab > li {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
  min-width: 0 !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border-right: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 14.5px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-tab > li:last-child {
  border-right: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-tab > li.active::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 2;
  display: block;
  height: 2px;
  background: var(--cl-green);
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-tab > li > a,
body.cl-dashboard-redesign-page .cl-source-plan-page .plan-tab > li.card_add {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  height: 100% !important;
  padding: 0 2px !important;
  color: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  line-height: inherit !important;
  text-align: center !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-tab > li.active,
body.cl-dashboard-redesign-page .cl-source-plan-page .plan-tab > li.active > a {
  color: var(--cl-green-text) !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-tab > li.card_add {
  flex: 0 0 132px !important;
  color: var(--cl-green-text) !important;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-tab > li.card_add svg {
  flex: none;
  margin-right: 6px;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-mng-box,
body.cl-dashboard-redesign-page .cl-source-plan-page .content-box {
  width: 760px !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 22px 24px 26px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-top: 0 !important;
  border-radius: 0 0 12px 12px !important;
  box-shadow: var(--cl-shadow-panel) !important;
}

body.cl-dashboard-redesign-page .cl-source-billing-history-page .content-box {
  width: 990px !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page ul,
body.cl-dashboard-redesign-page .cl-source-plan-page li,
body.cl-dashboard-redesign-page .cl-source-plan-page ol {
  margin: 0;
  padding: 0;
  list-style: none;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .content-title {
  margin: 4px 0 14px !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  line-height: 20px !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-list + .content-title,
body.cl-dashboard-redesign-page .cl-source-plan-page .remain-list-box + .content-title {
  margin-top: 28px !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-list > li {
  position: relative !important;
  margin: 0 0 12px !important;
  padding: 16px 20px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  transition: background-color .12s, border-color .12s, box-shadow .12s !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-list > li:not(.active):hover {
  background: var(--cl-bg-subtle) !important;
  border-color: var(--cl-border) !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-list > li.active {
  border-color: var(--cl-green) !important;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .12) !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  gap: 18px !important;
  width: 100% !important;
  min-height: 74px !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li {
  display: block !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.shot {
  position: relative !important;
  flex: 0 0 120px !important;
  width: 120px !important;
  height: 74px !important;
  min-height: 0 !important;
  overflow: hidden !important;
  background: #fafbfc !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.shot a,
body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.shot img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.shot img {
  object-fit: cover !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.shot.is-unpublished img {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.shot.is-unpublished {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.shot .over-box.none-site {
  position: static !important;
  inset: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 100% !important;
  z-index: 1 !important;
  background: #fafbfc !important;
  color: var(--cl-text-sub) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  text-align: center !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info {
  position: relative !important;
  flex: 1 1 auto !important;
  width: auto !important;
  min-width: 0 !important;
  min-height: 74px !important;
  padding: 0 152px 0 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 12.5px !important;
  line-height: 1.7 !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info > .summry {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-width: 0 !important;
  margin: 0 0 5px !important;
  color: var(--cl-text) !important;
  font-size: 15px !important;
  font-weight: 800 !important;
  line-height: 20px !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info > .summry > .site-name {
  display: inline-block !important;
  order: 1;
  flex: 0 1 auto !important;
  width: auto !important;
  max-width: 100% !important;
  min-width: 0 !important;
  overflow: hidden !important;
  color: var(--cl-text) !important;
  font-size: 15px !important;
  font-weight: 800 !important;
  line-height: 20px !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info > .summry > label,
body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info > .summry > .label,
body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info > .summry > .label-plan {
  order: 0;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 0 !important;
  height: 19px !important;
  margin: 0 !important;
  padding: 2px 7px !important;
  border: 1px solid transparent !important;
  border-radius: 4px !important;
  color: #fff !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 13px !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info > .summry > .label-plan.FREE,
body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info > .summry > .label-plan.FR {
  order: 0;
  background: #fff !important;
  border-color: var(--cl-border) !important;
  color: var(--cl-text-sub) !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info.is-free-plan {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info.is-free-plan > .summry {
  flex: 1 1 auto !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info.is-free-plan > .summry > .site-name {
  flex: 0 1 auto !important;
  width: auto !important;
  max-width: calc(100% - 48px) !important;
  min-width: 0 !important;
  visibility: visible !important;
  opacity: 1 !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info.is-free-plan > .description {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info > .summry > .label-plan.BASIC,
body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info > .summry > .label-plan.BS {
  background: #16a34a !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info > .summry > .label-plan.BUSINESS,
body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info > .summry > .label-plan.BN {
  background: #3b6fe0 !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info > .summry > .label-plan.SHOPPING,
body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info > .summry > .label-plan.ECOMMERCE,
body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info > .summry > .label-plan.SM {
  background: #f4778d !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info > .description {
  margin: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 12.5px !important;
  line-height: 21px !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info > .description p {
  margin: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 12.5px !important;
  line-height: 21px !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info .payment-auto {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 6px 0 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 12.5px !important;
  line-height: 20px !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-switch-input:checked ~ .plan-switch-label {
  background: #03C75A;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info > .plan-btn-box {
  position: absolute !important;
  top: 50% !important;
  right: 40px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  align-items: stretch !important;
  min-width: 96px !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: translateY(-50%) !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info > .plan-btn-box .plan-btn.change {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info > .plan-btn-box .plan-btn.upgrade {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info > .plan-btn-box .plan-btn,
body.cl-dashboard-redesign-page .cl-source-plan-page .remain-list-box .remain-list .plan-conn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 96px !important;
  height: 34px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  background: transparent !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 20px !important;
  color: var(--cl-text-muted) !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  text-align: center !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  cursor: pointer !important;
  transition: background .12s, color .12s, border-color .12s !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-list > li.active .plan-site > li.info > .plan-btn-box .plan-btn.upgrade,
body.cl-dashboard-redesign-page .cl-source-plan-page .plan-list > li.more_open .plan-site > li.info > .plan-btn-box .plan-btn,
body.cl-dashboard-redesign-page .cl-source-plan-page .remain-list-box .remain-list .plan-conn:hover {
  background: #fff !important;
  border-color: var(--cl-green-action) !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info > .plan-btn-box .plan-btn.disabled,
body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info > .plan-btn-box .plan-btn.auto-schedule-disabled,
body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info > .plan-btn-box .plan-btn.no_active_btn {
  background: transparent !important;
  border-color: var(--cl-border) !important;
  color: var(--cl-text-muted) !important;
  cursor: default !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-list > li:hover .plan-site > li.info > .plan-btn-box .plan-btn:hover,
body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info > .plan-btn-box .plan-btn:hover,
body.cl-dashboard-redesign-page .cl-source-plan-page .remain-list-box .remain-list .plan-conn:hover {
  background: #f1fbf5 !important;
  border-color: var(--cl-green-action) !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info > .plan-more {
  position: absolute !important;
  top: 50% !important;
  right: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 28px !important;
  height: 28px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 50% !important;
  color: var(--cl-text-sub) !important;
  cursor: pointer !important;
  opacity: 0 !important;
  transform: translateY(-50%) !important;
  transition: opacity .12s, background .12s !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-list > li:hover .plan-more,
body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info > .plan-more.open,
body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info > .plan-more.more_open {
  opacity: 1 !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-list > li.more_open .plan-site > li.info > .plan-more,
body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info > .plan-more.open {
  border-color: var(--cl-green) !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-list > li:hover .plan-site > li.info > .plan-more:not(.open):not(.more_open) {
  border-color: var(--cl-border) !important;
  color: var(--cl-text-sub) !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info > .plan-more:hover {
  background: #f1fbf5 !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-list > li.more_open { z-index: 40; }
body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info > .plan-more:focus-within { opacity: 1 !important; }
body.cl-dashboard-redesign-page .cl-source-plan-page .plan-more > svg:focus-visible { outline: 2px solid #03C75A; outline-offset: 4px; border-radius: 50%; }

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info > .plan-more svg {
  width: 18px !important;
  height: 18px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-more .plan-more-box {
  position: absolute !important;
  right: 0 !important;
  top: calc(100% + 6px) !important;
  z-index: 30 !important;
  display: none !important;
  min-width: 170px !important;
  padding: 6px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 10px !important;
  box-shadow: 0 8px 24px rgba(20, 24, 32, .14) !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-more .plan-more-box.open {
  display: block !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-more .plan-more-box::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: -7px;
  height: 7px;
}
body.cl-dashboard-redesign-page .cl-source-plan-page .plan-more .plan-more-box.opens-above { top: auto !important; bottom: calc(100% + 6px); }
body.cl-dashboard-redesign-page .cl-source-plan-page .plan-more .plan-more-box.opens-above::before { top: auto; bottom: -7px; }

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-more .plan-more-box ul {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-more .plan-more-box li {
  display: block !important;
  min-height: 34px !important;
  padding: 9px 12px !important;
  border-radius: 7px !important;
  color: var(--cl-text) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 16px !important;
  white-space: nowrap !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-more .plan-more-box li:hover,
body.cl-dashboard-redesign-page .cl-source-plan-page .plan-more .plan-more-box li:focus-visible {
  background: #f5f7fa !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-more .plan-more-box li.plan-menu-sep {
  min-height: 0 !important;
  height: 1px !important;
  margin: 6px 4px !important;
  padding: 0 !important;
  background: var(--cl-border) !important;
  border-radius: 0 !important;
  cursor: default !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-more .plan-more-box li:not(.plan-menu-sep)::before {
  display: inline-block;
  width: 16px;
  margin-right: 8px;
  color: var(--cl-text-sub);
  font-family: FontAwesome;
  font-weight: normal;
  content: "\f0f6";
  text-align: center;
}
body.cl-dashboard-redesign-page .cl-source-plan-page .plan-more .plan-more-box li.plan-more-change::before { content: "\f021"; }
body.cl-dashboard-redesign-page .cl-source-plan-page .plan-more .plan-more-box li.plan-move::before { content: "\f064"; }
body.cl-dashboard-redesign-page .cl-source-plan-page .plan-more .plan-more-box li.plan-exit::before { content: "\f127"; }
body.cl-dashboard-redesign-page .cl-source-plan-page .plan-more .plan-more-box li.plan-cancel::before { content: "\f057"; color: inherit; }
body.cl-dashboard-redesign-page .cl-source-plan-page .plan-more .plan-more-box li.select-card::before { content: "\f09d"; }

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-more .plan-more-box li.plan-cancel {
  color: #e5556b !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .plan-more .plan-more-box li.plan-cancel:hover {
  background: #fdecee !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .remain-list-box,
body.cl-dashboard-redesign-page .cl-source-plan-page .remain-list,
body.cl-dashboard-redesign-page .cl-source-plan-page .remain-list > ul {
  width: 100% !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .remain-list-box li {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  gap: 20px !important;
  min-height: 72px !important;
  margin: 0 0 12px !important;
  padding: 16px 176px 16px 20px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-left: 4px solid var(--cl-green) !important;
  border-radius: 10px !important;
  color: var(--cl-text-sub) !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .remain-list-box li.BASIC,
body.cl-dashboard-redesign-page .cl-source-plan-page .remain-list-box li.basic,
body.cl-dashboard-redesign-page .cl-source-plan-page .remain-list-box li.BS {
  border-left-color: #16a34a !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .remain-list-box li.BUSINESS,
body.cl-dashboard-redesign-page .cl-source-plan-page .remain-list-box li.business,
body.cl-dashboard-redesign-page .cl-source-plan-page .remain-list-box li.BN {
  border-left-color: #3b6fe0 !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .remain-list-box li.SHOPPING,
body.cl-dashboard-redesign-page .cl-source-plan-page .remain-list-box li.shopping,
body.cl-dashboard-redesign-page .cl-source-plan-page .remain-list-box li.ECOMMERCE,
body.cl-dashboard-redesign-page .cl-source-plan-page .remain-list-box li.ecommerce,
body.cl-dashboard-redesign-page .cl-source-plan-page .remain-list-box li.SM {
  border-left-color: #e5566e !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .remain-list-box li.no-remain-plan {
  display: block !important;
  min-height: 0 !important;
  padding: 40px !important;
  border: 1px solid var(--cl-border) !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .remain-list-box .plan-name {
  flex: 0 0 130px !important;
  width: 130px !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .remain-list-box .plan-name span {
  padding: 0 !important;
  color: var(--cl-green-text) !important;
  font-size: 15px !important;
  font-weight: 800 !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .remain-list-box li.BASIC .plan-name span,
body.cl-dashboard-redesign-page .cl-source-plan-page .remain-list-box li.basic .plan-name span,
body.cl-dashboard-redesign-page .cl-source-plan-page .remain-list-box li.BS .plan-name span {
  color: #16a34a !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .remain-list-box li.BUSINESS .plan-name span,
body.cl-dashboard-redesign-page .cl-source-plan-page .remain-list-box li.business .plan-name span,
body.cl-dashboard-redesign-page .cl-source-plan-page .remain-list-box li.BN .plan-name span {
  color: #3b6fe0 !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .remain-list-box li.SHOPPING .plan-name span,
body.cl-dashboard-redesign-page .cl-source-plan-page .remain-list-box li.shopping .plan-name span,
body.cl-dashboard-redesign-page .cl-source-plan-page .remain-list-box li.ECOMMERCE .plan-name span,
body.cl-dashboard-redesign-page .cl-source-plan-page .remain-list-box li.ecommerce .plan-name span,
body.cl-dashboard-redesign-page .cl-source-plan-page .remain-list-box li.SM .plan-name span {
  color: #e5566e !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .remain-list-box .plan-date {
  flex: 1 1 auto !important;
  width: auto !important;
  padding: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 12.5px !important;
  line-height: 21px !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .remain-list-box .plan-date p {
  margin: 0 !important;
  color: inherit !important;
  font-size: inherit !important;
  line-height: inherit !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .remain-list-box .remain-list .plan-conn {
  position: absolute !important;
  top: 50% !important;
  right: 60px !important;
  flex: 0 0 auto !important;
  border-color: var(--cl-green) !important;
  color: var(--cl-green-text) !important;
  transform: translateY(-50%) !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .sub-content {
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .btn-group#site-select {
  min-width: 150px !important;
  margin: 0 0 18px !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .btn-group#site-select > a {
  min-width: 150px !important;
  width: 150px !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .btn-group#site-select .site-name {
  display: block;
  min-width: 0;
  max-width: none;
  overflow: hidden;
  color: inherit;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .btn-group#site-select .list-wrap {
  width: 150px;
  min-width: 150px;
  max-height: min(390px, calc(100vh - 160px));
  overflow-x: hidden;
  overflow-y: auto;
  z-index: 30;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .btn-group#site-select .list-site {
  margin: 0;
  padding: 0;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .billing-list {
  width: 100% !important;
  overflow-x: var(--cl-billing-overflow-x, hidden) !important;
  border: 0 !important;
  border-radius: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .billing-list table {
  width: 100% !important;
  min-width: var(--cl-billing-table-min-width, 0) !important;
  max-width: 100% !important;
  margin: 0 !important;
  table-layout: fixed !important;
  border-collapse: collapse !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .billing-list col:nth-child(1) {
  width: 12.75% !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .billing-list col:nth-child(2) {
  width: 17.15% !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .billing-list col:nth-child(3) {
  width: 25.95% !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .billing-list col:nth-child(4),
body.cl-dashboard-redesign-page .cl-source-plan-page .billing-list col:nth-child(5) {
  width: 11.7% !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .billing-list col:nth-child(6) {
  width: 9.6% !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .billing-list col:nth-child(7) {
  width: 11.15% !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .billing-list th,
body.cl-dashboard-redesign-page .cl-source-plan-page .billing-list td {
  height: 44px !important;
  padding: var(--cl-billing-cell-padding, 0 12px) !important;
  overflow: hidden !important;
  border: 0 !important;
  border-bottom: 1px solid var(--cl-line) !important;
  color: var(--cl-text) !important;
  font-size: var(--cl-billing-cell-font-size, 12.5px) !important;
  font-weight: 600 !important;
  line-height: 18px !important;
  text-overflow: ellipsis !important;
  white-space: var(--cl-billing-cell-white-space, nowrap) !important;
  vertical-align: middle !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .billing-list th {
  background: #f8fafc !important;
  color: var(--cl-text-sub) !important;
  font-weight: 800 !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .billing-list td {
  font-weight: 400 !important;
}

body.cl-dashboard-redesign-page .cl-source-billing-history-page .billing-list td.state {
  color: var(--cl-text-sub) !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .billing-list thead th,
body.cl-dashboard-redesign-page .cl-dashboard-redesign .table-statistics > table > thead > tr > th {
  border-right: 0 !important;
  border-left: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .billing-list thead th:first-child,
body.cl-dashboard-redesign-page .cl-source-plan-page .billing-list thead th:last-child,
body.cl-dashboard-redesign-page .cl-dashboard-redesign .table-statistics > table > thead > tr > th:first-child,
body.cl-dashboard-redesign-page .cl-dashboard-redesign .table-statistics > table > thead > tr > th:last-child {
  border-right: 0 !important;
  border-left: 0 !important;
  border-radius: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .billing-list th:nth-child(1),
body.cl-dashboard-redesign-page .cl-source-plan-page .billing-list td:nth-child(1) {
  text-align: center !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .billing-list th:nth-child(3),
body.cl-dashboard-redesign-page .cl-source-plan-page .billing-list td:nth-child(3) {
  overflow: visible !important;
  text-overflow: clip !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .billing-list tbody tr:last-child td {
  border-bottom: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .billing-list a {
  color: var(--cl-green-text) !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}

body.cl-dashboard-redesign-page .cl-source-billing-history-page .billing-list td.state > a[href^="/upgrade/done?"] {
  color: #D98A3D !important;
}

body.cl-dashboard-redesign-page .cl-source-billing-history-page .billing-list td:nth-child(7) :is(a, .hand) {
  color: var(--cl-green-text) !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  transition: color 0.12s ease !important;
}

body.cl-dashboard-redesign-page .cl-source-billing-history-page .billing-list td:nth-child(7) :is(a, .hand):is(:hover, :focus-visible) {
  color: var(--cl-green-text) !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
}

@media (max-width: 900px) {
  body.cl-dashboard-redesign-page .sub.sub-page.cl-source-billing-history-page {
    position: relative;
    top: auto;
    left: auto;
    height: auto;
    overflow: visible;
    z-index: auto;
  }

  body.cl-dashboard-redesign-page .cl-source-billing-history-page .billing-list {
    --cl-billing-overflow-x: auto;
    --cl-billing-cell-padding: 10px 12px;
    --cl-billing-cell-font-size: 13px;
    --cl-billing-cell-white-space: normal;
    min-width: 0;
    max-width: 100%;
    -webkit-overflow-scrolling: touch;
  }

  body.cl-dashboard-redesign-page .cl-source-billing-history-page .billing-list table:has(tbody tr:not(.empty-data)) {
    --cl-billing-table-min-width: 1024px;
  }

  body.cl-dashboard-redesign-page .cl-source-billing-history-page .billing-list :is(th, td) {
    overflow-wrap: anywhere;
  }

  body.cl-dashboard-redesign-page .cl-source-billing-history-page .billing-list tbody tr:not(.empty-data) > :is(td:nth-child(3), td:nth-child(4), td:nth-child(5)) {
    --cl-billing-cell-white-space: nowrap;
    font-variant-numeric: tabular-nums;
  }

  body.cl-dashboard-redesign-page .cl-source-billing-history-page .billing-list table:has(.empty-data) :is(colgroup, thead) {
    display: none;
  }
}

body.cl-dashboard-redesign-page .cl-source-plan-page .billing-paging {
  display: flex !important;
  justify-content: center !important;
  margin: 22px 0 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .billing-paging .paging {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: normal !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .billing-paging a,
body.cl-dashboard-redesign-page .cl-source-plan-page .billing-paging span,
body.cl-dashboard-redesign-page .cl-source-plan-page .billing-paging strong {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  width: auto !important;
  min-width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 8px !important;
  background: transparent !important;
  border: 1px solid transparent !important;
  border-radius: 6px !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  vertical-align: middle !important;
  cursor: pointer !important;
  transition: background .12s, border-color .12s, color .12s !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .billing-paging strong {
  background: #fcfcfb !important;
  border-color: var(--cl-green) !important;
  color: var(--cl-green-text) !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .billing-paging a:hover {
  background: var(--cl-green-tint) !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .billing-paging a svg,
body.cl-dashboard-redesign-page .cl-source-plan-page .billing-paging span svg {
  display: block !important;
  width: 15px !important;
  height: 15px !important;
  color: var(--cl-text-muted) !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .billing-paging a:hover svg {
  color: var(--cl-green) !important;
}

body.cl-dashboard-redesign-page .cl-source-plan-page .billing-paging span[disabled] {
  color: var(--cl-text-muted) !important;
  cursor: default !important;
}

body.cl-dashboard-redesign-page .cl-source-card-page .card_list_summary,
body.cl-dashboard-redesign-page .cl-source-card-page .bill-card-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin: 0 0 14px !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-card-page .bill-card-cnt {
  display: inline-flex !important;
  align-items: center !important;
  color: var(--cl-text) !important;
  font-size: 15px !important;
  font-weight: 800 !important;
  line-height: 20px !important;
}

body.cl-dashboard-redesign-page .cl-source-card-page .card_list_summary_count {
  margin-left: 8px !important;
  color: var(--cl-text-muted) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 18px !important;
}

body.cl-dashboard-redesign-page .cl-source-card-page .card_list_summary_current,
body.cl-dashboard-redesign-page .cl-source-card-page .card_list_summary_total {
  color: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
}

body.cl-dashboard-redesign-page .cl-source-card-page .bill-card-add {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
  font-weight: 800 !important;
  line-height: 20px !important;
  text-decoration: none !important;
  cursor: pointer !important;
  transition: color .12s !important;
}

body.cl-dashboard-redesign-page .cl-source-card-page .bill-card-add:hover {
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-card-page .bill-card-add.is-disabled,
body.cl-dashboard-redesign-page .cl-source-card-page .bill-card-add[aria-disabled="true"] {
  color: var(--cl-text-muted) !important;
  cursor: default !important;
}

body.cl-dashboard-redesign-page .cl-source-card-page .bill-card-add svg {
  display: block !important;
  flex: none !important;
  width: 15px !important;
  height: 15px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2.4 !important;
  stroke-linecap: round !important;
}

body.cl-dashboard-redesign-page .cl-source-card-page .card_list {
  container-type: inline-size;
  container-name: cl-card-list;
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border-top: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-card-page .card_list.empty_content {
  min-height: 330px !important;
}

body.cl-dashboard-redesign-page .cl-source-card-page .card_list.empty_content .card_content {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 260px !important;
  margin: 0 !important;
  color: var(--cl-text-muted) !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
}

body.cl-dashboard-redesign-page .cl-source-card-page .card_list.empty_content .card_content span {
  color: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
}

body.cl-dashboard-redesign-page .cl-source-card-page .card_list:not(.empty_content) .card_item {
  position: relative !important;
  display: grid !important;
  grid-template-columns: minmax(180px, 210px) minmax(0, 1fr);
  grid-template-rows: auto;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 18px !important;
  width: 100% !important;
  min-height: 78px !important;
  height: auto !important;
  margin: 0 !important;
  padding: 16px 14px !important;
  background: #fff !important;
  border: 0 !important;
  border-bottom: 1px solid var(--cl-border) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: var(--cl-text) !important;
  cursor: default !important;
}

body.cl-dashboard-redesign-page .cl-source-card-page .card_list:not(.empty_content) .card_item::after {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-card-page .card_list:not(.empty_content) .card_item.active {
  background: #eaf9f1 !important;
  border-bottom-color: transparent !important;
  border-radius: 10px !important;
}

body.cl-dashboard-redesign-page .cl-source-card-page .card_list:not(.empty_content) .card_item.active + .card_item {
  border-top: 1px solid var(--cl-border) !important;
}

body.cl-dashboard-redesign-page .cl-source-card-page .card_list:not(.empty_content) .card_item:last-child {
  border-bottom: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_head {
  grid-column: 1;
  grid-row: 1;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  flex: 0 0 260px !important;
  gap: 18px !important;
  min-width: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_visual {
  position: relative !important;
  flex: 0 0 72px !important;
  width: 72px !important;
  height: 46px !important;
  margin: 0 !important;
  overflow: hidden !important;
  border-radius: 6px !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .1) !important;
}

body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_meta {
  display: block !important;
  flex: 1 1 auto !important;
  width: auto !important;
  min-width: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_status {
  display: block !important;
  min-height: 0 !important;
  margin: 0 !important;
  line-height: 1 !important;
}

body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_status:empty {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_badge {
  position: static !important;
  display: inline-block !important;
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  margin: 0 0 5px !important;
  padding: 1px 9px !important;
  border: 1px solid var(--cl-green) !important;
  border-radius: 12px !important;
  color: var(--cl-green-text) !important;
  background: #fff !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 15px !important;
  transform: none !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_nickname {
  max-width: 100% !important;
  display: block !important;
  overflow: hidden !important;
  color: var(--cl-text) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 20px !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_info {
  position: static !important;
  display: grid !important;
  grid-column: 2;
  grid-row: 1;
  grid-template-columns: minmax(0, 1fr) 108px auto;
  width: 100% !important;
  flex: 1 1 auto !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 10px !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_number {
  grid-column: 1;
  grid-row: 1;
  display: flex !important;
  flex: 1 1 auto !important;
  align-items: center !important;
  gap: 2px !important;
  min-width: 0 !important;
  overflow: hidden !important;
  color: var(--cl-text) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 20px !important;
  letter-spacing: .5px !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_mask {
  position: relative !important;
  display: inline-flex !important;
  flex: 0 0 41px !important;
  align-items: center !important;
  width: 41px !important;
  min-width: 41px !important;
  height: 20px !important;
}

body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_mask::before {
  content: "" !important;
  display: block !important;
  width: 8px !important;
  height: 8px !important;
  border-radius: 50% !important;
  background: var(--cl-text-muted) !important;
  box-shadow: 11px 0 0 var(--cl-text-muted), 22px 0 0 var(--cl-text-muted), 33px 0 0 var(--cl-text-muted) !important;
}

body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_mask_separator {
  color: var(--cl-text-muted) !important;
  font-size: 14px !important;
  line-height: 20px !important;
}

body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_mask::after {
  content: none;
  display: none;
}

body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_last {
  color: var(--cl-text) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 20px !important;
}

body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_legacy_label {
  color: var(--cl-text) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 20px !important;
}

body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_footer {
  display: contents !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 12px !important;
  min-width: 0 !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_exp {
  grid-column: 3;
  grid-row: 1;
  justify-self: end;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 20px !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_exp_label {
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_exp.is-expired {
  color: #E5484D !important;
}

body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_exp_value {
  color: var(--cl-text) !important;
  font-weight: 800 !important;
}

body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_actions {
  position: static !important;
  grid-column: 2;
  grid-row: 1;
  width: 108px !important;
  height: 32px !important;
  margin: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 6px !important;
  transform: none !important;
  z-index: 2 !important;
}

body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_item .card_actions:is(.is-single-action, .is-single-edit-action, .is-single-delete-action) {
  justify-content: flex-end !important;
}

body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_item:not(.disabled):not(.is-disabled):not([aria-disabled="true"]) .card_actions {
  opacity: 0 !important;
  visibility: visible !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_item:not(.disabled):not(.is-disabled):not([aria-disabled="true"]):is(:hover, :focus-within) .card_actions {
  opacity: 1 !important;
  pointer-events: auto !important;
}

body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_item .card_actions .cl-dashboard-button-box[data-func],
body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_item .card_actions .cl-dashboard-button {
  position: relative !important;
  inset: auto !important;
  flex: 0 0 32px !important;
  width: 32px !important;
  height: 32px !important;
  min-width: 32px !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
  border-radius: 6px !important;
}

body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_actions .card-move-top-button {
  position: static !important;
  flex: 0 0 32px !important;
  width: 32px !important;
  height: 32px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 6px !important;
  background: transparent !important;
  color: var(--cl-green-text) !important;
  font-size: 20px !important;
  line-height: 32px !important;
}

body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_actions :is(button, [tabindex]):focus-visible { outline: 2px solid #03C75A; outline-offset: 1px; }

body.cl-dashboard-redesign-page .popover.cl-source-help-popover.cl-card-action-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) {
  width: max-content !important;
  min-width: 0 !important;
  max-width: calc(100vw - 24px) !important;
  border-radius: 8px !important;
  box-shadow: 0 2px 8px rgba(20, 24, 32, .12) !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .popover.cl-source-help-popover.cl-card-action-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) .popover-content {
  padding: 5px 8px !important;
  color: #222428 !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 18px !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .popover.cl-source-help-popover.cl-card-action-popover.top:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) > .arrow {
  width: 8px !important;
  height: 8px !important;
  bottom: -5px !important;
  margin-left: -4px !important;
}

body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_item.active .card-move-top-button { display: none !important; }
body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_actions .card-move-top-button:hover,
body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_actions .cl-dashboard-button:hover { background: #eaf9f1 !important; }
body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_actions .cl-dashboard-button:not(.card-delete-button):hover::before { background-color: #03C75A; }
body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_actions .card-delete-button:hover { background: #fdecee !important; }

@container cl-card-list (max-width: 620px) {
  body.cl-dashboard-redesign-page .cl-source-card-page .card_list:not(.empty_content) .card_item { grid-template-columns: minmax(0, 1fr); gap: 12px !important; }
  body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_info { grid-column: 1; grid-row: 2; gap: 12px !important; }
}

@container cl-card-list (max-width: 420px) {
  body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_info { grid-template-columns: minmax(0, 1fr) 108px; }
  body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_number { grid-column: 1 / -1; }
  body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_exp { grid-column: 1; grid-row: 2; justify-self: start; }
  body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_actions { grid-row: 2; }
}

@media (hover: none) {
  body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_item:not(.disabled):not(.is-disabled):not([aria-disabled="true"]) .card_actions { opacity: 1 !important; pointer-events: auto !important; }
}

/* 요금제 및 결제 관리 > 카드 관리 > 수정·삭제 팝업 */
body.cl-dashboard-redesign-page :is(#billingCardEditModalRoot, #billingCardDeleteModalRoot)
  .modal-dialog.cl-source-plan-action-modal {
  width: min(440px, calc(100vw - 32px)) !important;
  max-width: min(440px, calc(100vw - 32px)) !important;
  min-height: 0 !important;
}

body.cl-dashboard-redesign-page :is(#billingCardEditModalRoot, #billingCardDeleteModalRoot)
  .cl-source-plan-action-modal .modal-content {
  padding: 32px 27px 28px !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page :is(#billingCardEditModalRoot, #billingCardDeleteModalRoot)
  .cl-source-plan-action-modal .modal-body {
  overflow: visible !important;
}

body.cl-dashboard-redesign-page :is(#billingCardEditModalRoot, #billingCardDeleteModalRoot)
  .cl-source-plan-action-modal .modal-title {
  margin-bottom: 24px !important;
}

body.cl-dashboard-redesign-page :is(#billingCardEditModalRoot, #billingCardDeleteModalRoot)
  .cl-source-plan-action-modal .modal-footer {
  align-self: center !important;
  gap: 14px !important;
  width: 384px !important;
  max-width: 100% !important;
}

body.cl-dashboard-redesign-page :is(#billingCardEditModalRoot, #billingCardDeleteModalRoot)
  .cl-source-plan-action-modal .modal-footer > .btn {
  font-size: 15px !important;
}

body.cl-dashboard-redesign-page #billingCardEditModalRoot
  :is(.edit-cardnickname-form, .card-info, .table-card, .cl-dashboard-input-group) {
  float: none !important;
  width: 100% !important;
  min-width: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page #billingCardEditModalRoot .cl-dashboard-input-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  width: 100% !important;
  margin: 0 0 8px !important;
}

body.cl-dashboard-redesign-page #billingCardEditModalRoot .cl-dashboard-input-label {
  margin: 0 !important;
  color: var(--ink, #222428) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 18px !important;
}

body.cl-dashboard-redesign-page #billingCardEditModalRoot .cl-dashboard-input-count {
  margin: 0 !important;
  color: var(--ink-3, #B4B8BF) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 18px !important;
  font-variant-numeric: tabular-nums !important;
}

body.cl-dashboard-redesign-page #billingCardEditModalRoot .cl-dashboard-input-count-current {
  color: inherit !important;
}

body.cl-dashboard-redesign-page #billingCardEditModalRoot #card_nickname {
  display: block !important;
  width: 100% !important;
  height: 40px !important;
  margin: 0 !important;
  padding: 0 12px !important;
  color: var(--ink, #222428) !important;
  background: var(--surface, #fff) !important;
  border: 1px solid var(--border, #E5E7EB) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 38px !important;
  outline: 0 !important;
  transition: border-color .12s, box-shadow .12s !important;
}

body.cl-dashboard-redesign-page #billingCardEditModalRoot #card_nickname:hover {
  border-color: var(--border-hover, #D5D9E0) !important;
}

body.cl-dashboard-redesign-page #billingCardEditModalRoot #card_nickname:focus {
  border-color: var(--green, #03C75A) !important;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .13) !important;
}

body.cl-dashboard-redesign-page #billingCardDeleteModalRoot .cl-source-card-delete-message {
  margin: 0 !important;
  color: var(--ink-2s, #5C616B) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 22px !important;
  text-align: center !important;
  word-break: keep-all !important;
}

body.cl-dashboard-redesign-page #billingCardDeleteModalRoot
  .cl-source-plan-action-modal .modal-footer > .ok-button-dialog {
  color: #fff !important;
  background: var(--danger, #E5484D) !important;
  border-color: var(--danger, #E5484D) !important;
}

body.cl-dashboard-redesign-page #billingCardDeleteModalRoot
  .cl-source-plan-action-modal .modal-footer > .ok-button-dialog:hover,
body.cl-dashboard-redesign-page #billingCardDeleteModalRoot
  .cl-source-plan-action-modal .modal-footer > .ok-button-dialog:focus {
  color: #fff !important;
  background: #D63F44 !important;
  border-color: #D63F44 !important;
}

body.cl-dashboard-redesign-page :is(#billingCardEditModalRoot, #billingCardDeleteModalRoot)
  .modal-content > .close.close-button-dialog::before,
body.cl-dashboard-redesign-page :is(#billingCardEditModalRoot, #billingCardDeleteModalRoot)
  .modal-content > .close.close-button-dialog::after {
  content: none !important;
  display: none !important;
}

@media (max-width: 640px) {
  body.cl-dashboard-redesign-page :is(#billingCardEditModalRoot, #billingCardDeleteModalRoot)
    .modal-dialog.cl-source-plan-action-modal {
    width: 440px !important;
    max-width: calc(100vw - 24px) !important;
  }

  body.cl-dashboard-redesign-page :is(#billingCardEditModalRoot, #billingCardDeleteModalRoot)
    .cl-source-plan-action-modal .modal-content {
    padding: 30px 20px 22px !important;
  }

  body.cl-dashboard-redesign-page :is(#billingCardEditModalRoot, #billingCardDeleteModalRoot)
    .cl-source-plan-action-modal .modal-title {
    margin-bottom: 20px !important;
  }

  body.cl-dashboard-redesign-page :is(#billingCardEditModalRoot, #billingCardDeleteModalRoot)
    .cl-source-plan-action-modal .modal-footer {
    align-self: stretch !important;
    width: 100% !important;
    max-width: none !important;
    margin-top: 22px !important;
  }
}

body.cl-source-card-add-modal-open .modal-backdrop,
body.cl-source-card-add-modal-open .modal-backdrop.fade,
body.cl-source-card-add-modal-open .modal-backdrop.in {
  display: none !important;
  opacity: 0 !important;
}

body.cl-source-card-add-modal-open #billingCardModalRoot {
  position: fixed !important;
  inset: 0 !important;
  z-index: 1000000 !important;
  width: 100vw !important;
  height: 100vh !important;
  overflow: visible !important;
  pointer-events: auto !important;
}

body.cl-source-card-add-modal-open #billingCardModalRoot .card-add-modal-default {
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
  width: 100vw !important;
  height: 100vh !important;
  padding: 5vh 0 !important;
  background: rgba(20, 24, 32, .45) !important;
  overflow-y: auto !important;
  z-index: 1000000 !important;
}

body.cl-source-card-add-modal-open #billingCardModalRoot .card-add-modal-default .modal-dialog.cl-cmmodal.w560 {
  position: relative !important;
  z-index: 1 !important;
  width: 560px !important;
  max-width: 92vw !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 auto !important;
  padding: 0 !important;
  background: var(--cl-surface, #fff) !important;
  border-radius: 18px !important;
  overflow: visible !important;
}

body.cl-source-card-add-modal-open #billingCardModalRoot .card-add-modal-default .modal-content {
  position: relative !important;
  display: block !important;
  height: auto !important;
  min-height: 0 !important;
  overflow: visible !important;
  padding: 44px 34px 34px !important;
  background: var(--cl-surface, #fff) !important;
  border: 0 !important;
  border-radius: 18px !important;
  box-shadow: 0 20px 50px rgba(20, 24, 32, .25) !important;
}

body.cl-source-card-add-modal-open #billingCardModalRoot .card-add-modal-default > .cl-mobile-btn.close {
  display: none;
}

body.cl-source-card-add-modal-open #billingCardModalRoot .card-add-modal-default .modal-body {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-source-card-add-modal-open #billingCardModalRoot .card-add-modal-default .modal-title {
  margin: 0 0 26px !important;
  color: var(--cl-text) !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  line-height: 24px !important;
  text-align: center !important;
}

body.cl-source-card-add-modal-open #billingCardModalRoot .card-add-modal-default .modal-footer {
  display: none !important;
}

body.cl-source-card-add-modal-open #billingCardModalRoot .card-add-modal-default .modal-content > .close-button-dialog,
body.cl-source-card-add-modal-open #billingCardModalRoot .card-add-modal-default .modal-content > .modal-close {
  position: absolute !important;
  top: 16px !important;
  right: 16px !important;
  z-index: 3 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  color: var(--cl-text-sub) !important;
  background: none !important;
  border: 0 !important;
  border-radius: 8px !important;
  opacity: 1 !important;
  cursor: pointer !important;
  transition: color .15s, background .15s, transform .18s cubic-bezier(.34, 1.56, .64, 1) !important;
}

body.cl-source-card-add-modal-open #billingCardModalRoot .card-add-modal-default .modal-content > .close-button-dialog:hover,
body.cl-source-card-add-modal-open #billingCardModalRoot .card-add-modal-default .modal-content > .close-button-dialog:focus,
body.cl-source-card-add-modal-open #billingCardModalRoot .card-add-modal-default .modal-content > .modal-close:hover,
body.cl-source-card-add-modal-open #billingCardModalRoot .card-add-modal-default .modal-content > .modal-close:focus {
  color: var(--cl-text) !important;
  background: #f1f2f5 !important;
  transform: rotate(90deg) !important;
}

body.cl-source-card-add-modal-open #billingCardModalRoot .card-add-modal-default .modal-content > .close-button-dialog svg,
body.cl-source-card-add-modal-open #billingCardModalRoot .card-add-modal-default .modal-content > .modal-close svg {
  display: block !important;
  width: 15px !important;
  height: 15px !important;
  fill: none !important;
  stroke: currentColor !important;
}

body.cl-source-card-add-modal-open #billingCardModalRoot .source-card-add-form {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-source-card-add-modal-open #billingCardModalRoot .source-card-add-form #card_num {
  position: absolute !important;
  width: 1px !important;
  min-width: 1px !important;
  height: 1px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

body.cl-source-card-add-modal-open #billingCardModalRoot .source-card-add-form .ca-preview {
  position: relative !important;
  width: 260px !important;
  max-width: 100% !important;
  aspect-ratio: 390 / 249 !important;
  margin: 0 auto 22px !important;
  overflow: hidden !important;
  color: #fff !important;
  background: #b0b9c6 url("/images/dashboard/card-preview/default.jpg") center / cover no-repeat !important;
  background-position: center !important;
  background-size: cover !important;
  border-radius: 14px !important;
  box-shadow: inset 2.8px 2.8px 0 rgba(255, 255, 255, .22), inset -2.8px -2.8px 0 rgba(0, 0, 0, .08) !important;
  container-type: size !important;
}

body.cl-source-card-add-modal-open #billingCardModalRoot .source-card-add-form .ca-preview[data-network="visa"] {
  background-image: url("/images/dashboard/card-preview/visa.jpg") !important;
}

body.cl-source-card-add-modal-open #billingCardModalRoot .source-card-add-form .ca-preview[data-network="mastercard"] {
  background-image: url("/images/dashboard/card-preview/mastercard.jpg") !important;
}

body.cl-source-card-add-modal-open #billingCardModalRoot .source-card-add-form .ca-preview[data-network="amex"] {
  background-image: url("/images/dashboard/card-preview/amex.jpg") !important;
}

body.cl-source-card-add-modal-open #billingCardModalRoot .source-card-add-form .ca-preview[data-network="jcb"] {
  background-image: url("/images/dashboard/card-preview/jcb.jpg") !important;
}

body.cl-source-card-add-modal-open #billingCardModalRoot .source-card-add-form .ca-preview[data-network="discover"] {
  background-image: url("/images/dashboard/card-preview/discover.jpg") !important;
}

body.cl-source-card-add-modal-open #billingCardModalRoot .source-card-add-form .ca-preview[data-network="unionpay"],
body.cl-source-card-add-modal-open #billingCardModalRoot .source-card-add-form .ca-preview[data-network="etc"] {
  background-image: url("/images/dashboard/card-preview/etc.jpg") !important;
}

body.cl-source-card-add-modal-open #billingCardModalRoot .source-card-add-form .ca-preview::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  border-radius: 14px !important;
  pointer-events: none !important;
  box-shadow: inset 1.8px 1.8px 0 rgba(255, 255, 255, .24), inset -1.8px -1.8px 0 rgba(0, 0, 0, .06), inset 0 0 0 1px rgba(255, 255, 255, .16) !important;
}

body.cl-source-card-add-modal-open #billingCardModalRoot .source-card-add-form .ca-pv-nick,
body.cl-source-card-add-modal-open #billingCardModalRoot .source-card-add-form .ca-pv-num,
body.cl-source-card-add-modal-open #billingCardModalRoot .source-card-add-form .ca-pv-exp {
  position: absolute !important;
  z-index: 1 !important;
  color: #fff !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  letter-spacing: .1px !important;
}

body.cl-source-card-add-modal-open #billingCardModalRoot .source-card-add-form .ca-pv-nick {
  top: 14.2% !important;
  left: 9.7% !important;
  font-size: calc(4.1cqw + 2px) !important;
}

body.cl-source-card-add-modal-open #billingCardModalRoot .source-card-add-form .ca-pv-num {
  top: 28.8% !important;
  left: 9.7% !important;
  font-size: calc(4.1cqw + 2px) !important;
  letter-spacing: .4px !important;
}

body.cl-source-card-add-modal-open #billingCardModalRoot .source-card-add-form .ca-pv-exp {
  top: 76% !important;
  left: 9.7% !important;
  font-size: calc(4.1cqw + 2px) !important;
  letter-spacing: .2px !important;
}

body.cl-source-card-add-modal-open #billingCardModalRoot .source-card-add-form .ca-pv-ph {
  opacity: 1 !important;
  font-weight: 600 !important;
}

body.cl-source-card-add-modal-open #billingCardModalRoot .source-card-add-form .ca-field {
  margin: 0 0 22px !important;
}

body.cl-source-card-add-modal-open #billingCardModalRoot .source-card-add-form .ca-lbl {
  display: flex !important;
  justify-content: space-between !important;
  height: 15px !important;
  min-height: 15px !important;
  max-height: 15px !important;
  margin: 0 0 8px !important;
  color: var(--cl-text) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 15px !important;
}

body.cl-source-card-add-modal-open #billingCardModalRoot .source-card-add-form .ca-lbl .cnt {
  color: var(--cl-green-text) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}

body.cl-source-card-add-modal-open #billingCardModalRoot .source-card-add-form .ca-input {
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: 40px !important;
  padding: 0 13px !important;
  color: var(--cl-text) !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  line-height: 40px !important;
}

body.cl-source-card-add-modal-open #billingCardModalRoot .source-card-add-form .ca-input:focus {
  border-color: var(--cl-green-action) !important;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .12) !important;
  outline: 0 !important;
}

body.cl-source-card-add-modal-open #billingCardModalRoot .source-card-add-form .billing-card-field-error .ca-input {
  border-color: #ee445f !important;
  box-shadow: none !important;
}

body.cl-source-card-add-modal-open #billingCardModalRoot .source-card-add-form .ca-cardnum {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
}

body.cl-source-card-add-modal-open #billingCardModalRoot .source-card-add-form .ca-cardnum input {
  padding: 0 4px !important;
  text-align: center !important;
}

body.cl-source-card-add-modal-open #billingCardModalRoot .source-card-add-form .ca-cardnum .dash {
  flex: 0 0 auto !important;
  color: var(--cl-text-muted) !important;
  font-size: 13px !important;
}

body.cl-source-card-add-modal-open #billingCardModalRoot .source-card-add-form .ca-two {
  display: flex !important;
  gap: 14px !important;
}

body.cl-source-card-add-modal-open #billingCardModalRoot .source-card-add-form .ca-two > div {
  flex: 1 1 0 !important;
}

body.cl-source-card-add-modal-open #billingCardModalRoot .source-card-add-form .ca-seg {
  display: flex !important;
  gap: 10px !important;
  margin: 0 0 22px !important;
}

body.cl-source-card-add-modal-open #billingCardModalRoot .source-card-add-form .ca-seg button {
  flex: 1 1 0 !important;
  height: 40px !important;
  color: var(--cl-text-sub) !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  line-height: 38px !important;
  cursor: pointer !important;
  transition: border-color .12s, color .12s, background .12s !important;
}

body.cl-source-card-add-modal-open #billingCardModalRoot .source-card-add-form .ca-seg button:hover {
  color: var(--cl-green-text) !important;
  background: #fff !important;
  border-color: var(--cl-green-line) !important;
}

body.cl-source-card-add-modal-open #billingCardModalRoot .source-card-add-form .ca-seg button.active {
  color: var(--cl-green-text) !important;
  border-color: var(--cl-green-action) !important;
  font-weight: 600 !important;
}

body.cl-source-card-add-modal-open #billingCardModalRoot .source-card-add-form .ca-note {
  margin: 0 0 8px !important;
  color: var(--cl-green-text) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 1.6 !important;
}

body.cl-source-card-add-modal-open #billingCardModalRoot .source-card-add-form .ca-submit {
  width: 100% !important;
  margin: 4px 0 0 !important;
  padding: 15px 0 !important;
  color: #fff !important;
  background: var(--cl-green-action) !important;
  border: 0 !important;
  border-radius: 9px !important;
  box-shadow: none !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 17px !important;
  cursor: pointer !important;
  transition: background .12s !important;
}

body.cl-source-card-add-modal-open #billingCardModalRoot .source-card-add-form .ca-submit:hover {
  background: var(--cl-green-hover) !important;
}

body.cl-source-card-add-modal-open #billingCardModalRoot .source-card-add-form .ca-cancel {
  display: block !important;
  width: 100% !important;
  margin: 14px 0 0 !important;
  padding: 11px !important;
  color: var(--cl-text-sub) !important;
  background: none !important;
  border: 0 !important;
  border-radius: 9px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 16px !important;
  text-align: center !important;
  cursor: pointer !important;
  transition: background .12s, color .12s !important;
}

body.cl-source-card-add-modal-open #billingCardModalRoot .source-card-add-form .ca-cancel:hover {
  color: var(--cl-text) !important;
  background: #e7e8e9 !important;
}

@media (max-width: 1024px) {
  body.cl-dashboard-redesign-page .cl-dashboard-redesign.dashboard.cl-source-plan-shell {
    display: none !important;
  }

  body.cl-dashboard-redesign-page .sub.sub-page.cl-source-plan-page {
    padding: 24px 20px 48px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-plan-page {
    max-width: none !important;
  }
}

@media (max-width: 900px) {
  body.cl-dashboard-redesign-page .cl-dashboard-redesign.dashboard.cl-source-plan-shell {
    display: none !important;
  }

  body.cl-dashboard-redesign-page .sub.sub-page.cl-source-plan-page {
    margin-right: 0 !important;
    margin-left: 0 !important;
  }
}

@media (max-width: 640px) {
  body.cl-dashboard-redesign-page .cl-dashboard-redesign.dashboard.cl-source-plan-shell {
    display: none !important;
  }

  body.cl-dashboard-redesign-page .sub.sub-page.cl-source-plan-page {
    padding: 20px 14px 40px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-plan-page .plan-tab-wrap,
  body.cl-dashboard-redesign-page .cl-source-billing-history-page .plan-tab-wrap,
  body.cl-dashboard-redesign-page .cl-source-plan-page .plan-mng-box,
  body.cl-dashboard-redesign-page .cl-source-plan-page .content-box,
  body.cl-dashboard-redesign-page .cl-source-billing-history-page .content-box {
    width: 100% !important;
  }

  body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site {
    flex-wrap: wrap !important;
  }

  body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.shot {
    flex-basis: 92px !important;
    width: 92px !important;
    height: 58px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info {
    min-height: 58px !important;
    padding-right: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info > .plan-btn-box {
    position: static !important;
    flex-direction: row !important;
    margin-top: 12px !important;
    transform: none !important;
  }

  body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info > .plan-more {
    top: 0 !important;
    transform: none !important;
  }

  body.cl-dashboard-redesign-page .cl-source-plan-page .remain-list-box li {
    flex-direction: column !important;
    align-items: stretch !important;
    padding: 16px 20px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-plan-page .remain-list-box .plan-name,
  body.cl-dashboard-redesign-page .cl-source-plan-page .remain-list-box .plan-date {
    width: 100% !important;
    flex-basis: auto !important;
  }

  body.cl-dashboard-redesign-page .cl-source-plan-page .remain-list-box .remain-list .plan-conn {
    position: static !important;
    width: 100% !important;
    transform: none !important;
  }
}

/* 회원 관리: 쇼핑 등급 설정 모달 */
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap {
  position: fixed !important;
  inset: 0 !important;
  z-index: 1000002 !important;
  width: 100vw !important;
  height: 100vh !important;
  overflow: hidden !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap > .modal-default {
  position: fixed !important;
  inset: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100vw !important;
  height: 100vh !important;
  margin: 0 !important;
  padding: 24px 16px !important;
  overflow: auto !important;
  background: rgba(0, 0, 0, .45) !important;
  z-index: 1000002 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap + .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-backdrop {
  background: transparent !important;
  opacity: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap > .modal-default > .cl-mobile-btn.close {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-dialog.shopgrade-setting-modal,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default.in .modal-dialog.shopgrade-setting-modal,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default.fade .modal-dialog.shopgrade-setting-modal {
  width: min(680px, calc(100vw - 32px)) !important;
  min-width: 0 !important;
  max-width: min(680px, calc(100vw - 32px)) !important;
  margin: auto !important;
  padding: 0 !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .modal-content {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  max-height: calc(100vh - 48px) !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: var(--cl-surface) !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 14px !important;
  box-shadow: 0 24px 64px rgba(20, 24, 32, .25) !important;
  color: var(--cl-text) !important;
  font-family: var(--cl-source-font) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .modal-body {
  display: block !important;
  flex: 1 1 auto !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 32px 30px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .modal-title {
  display: block !important;
  box-sizing: border-box !important;
  flex: 0 0 auto !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 44px 64px 22px !important;
  color: var(--cl-text) !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  line-height: 28px !important;
  letter-spacing: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .modal-content > button.close {
  position: absolute !important;
  top: 16px !important;
  right: 18px !important;
  z-index: 3 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub) !important;
  opacity: 1 !important;
  transition: background var(--cl-motion-fast), color var(--cl-motion-fast), transform .18s cubic-bezier(.34, 1.56, .64, 1) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .modal-content > button.close:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .modal-content > button.close:focus {
  background: var(--cl-bg-3) !important;
  color: var(--cl-text) !important;
  outline: 0 !important;
  transform: rotate(90deg) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .modal-content > button.close svg {
  display: block !important;
  width: 15px !important;
  height: 15px !important;
  fill: currentColor !important;
  stroke: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .shopping-grade-modal {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .shopgrade-use-guide-link,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .shopgrade-notice-setting-link {
  position: static !important;
  display: inline-flex !important;
  align-items: center !important;
  /* justify-content: flex-end !important; */
  gap: 4px !important;
  width: auto !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-green-text) !important;
  font-family: inherit !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 18px !important;
  text-decoration: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .shopgrade-use-guide-link {
  display: flex !important;
  margin-bottom: 18px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal :is(.shopgrade-use-guide-link, .shopgrade-notice-setting-link):hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal :is(.shopgrade-use-guide-link, .shopgrade-notice-setting-link):focus {
  color: var(--cl-green-text) !important;
  text-decoration: underline !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal :is(.shopgrade-use-guide-link, .shopgrade-notice-setting-link) svg {
  position: static !important;
  flex: 0 0 12px !important;
  width: 12px !important;
  height: 12px !important;
  margin: 0 !important;
  color: var(--cl-green) !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .grade-grid,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .shopgrade-use-guide-link + .grade-grid + .grade-grid {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 118px minmax(0, 1fr) !important;
  column-gap: 16px !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .grade-grid + .grade-grid {
  margin-top: 28px !important;
  padding-top: 24px !important;
  border-top: 1px solid var(--cl-border) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal :is(.grade-grid-left, .grade-grid-right),
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .shopgrade-use-guide-link + .grade-grid + .grade-grid > :is(.grade-grid-left, .grade-grid-right) {
  display: block !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .grade-label {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 3px 0 0 !important;
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  line-height: 20px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .config-tooltip,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .config-tooltip svg.sg-grade-use {
  position: static !important;
  display: inline-flex !important;
  width: 14px !important;
  height: 14px !important;
  margin: 0 !important;
  color: var(--cl-green) !important;
  fill: currentColor !important;
  transform: none !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .grade-list-wrap {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .grade-list-wrap > .grade-block.ui-sortable-helper {
  position: absolute !important;
  z-index: 1000004 !important;
  margin: 0 !important;
  opacity: .98;
  pointer-events: none;
  box-shadow: var(--cl-shadow-card) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .grade-list-wrap > .grade-placeholder {
  display: block !important;
  flex: none !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  background: var(--cl-green-tint) !important;
  border: 1px dashed var(--cl-green-line) !important;
  border-radius: 10px !important;
  box-sizing: border-box !important;
  visibility: visible !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .grade-block,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .grade-list-wrap .grade-block:last-child {
  position: relative !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 10px !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .grade-line {
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 46px !important;
  min-height: 46px !important;
  max-height: 46px !important;
  margin: 0 !important;
  padding: 0 14px !important;
  overflow: visible !important;
  background: #fff !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .drag-handle {
  display: inline-flex !important;
  flex: 0 0 20px !important;
  align-items: center !important;
  justify-content: center !important;
  width: 20px !important;
  min-width: 20px !important;
  max-width: 20px !important;
  height: 32px !important;
  min-height: 32px !important;
  max-height: 32px !important;
  margin: 0 6px 0 -6px !important;
  padding: 0 !important;
  color: var(--cl-text-muted) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .shopgrade-drag-icon {
  display: block !important;
  width: 10px !important;
  min-width: 10px !important;
  max-width: 10px !important;
  height: 18px !important;
  min-height: 18px !important;
  max-height: 18px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .grade-name {
  position: static !important;
  display: flex !important;
  flex: 1 1 auto !important;
  align-items: center !important;
  gap: 7px !important;
  min-width: 0 !important;
  width: auto !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 20px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .grade-name .auto-icon {
  position: static !important;
  display: inline-flex !important;
  align-items: center !important;
  height: auto !important;
  margin: 0 !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal :is(.grade-default-badge, .grade_auto-badge) {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 20px !important;
  margin: 0 !important;
  padding: 0 7px !important;
  border-radius: 4px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  line-height: 20px !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .grade-default-badge {
  color: var(--cl-text-sub) !important;
  background: var(--cl-bg-3) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .grade_auto-badge {
  color: var(--cl-green-text) !important;
  background: var(--cl-green-badge) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .grade-desc {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 16px 14px 16px !important;
  color: var(--cl-text-sub) !important;
  border: 0 !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .grade-desc-list {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .grade-desc-item {
  display: grid !important;
  grid-template-columns: 64px minmax(0, 1fr) !important;
  column-gap: 12px !important;
  width: 100% !important;
  min-height: 18px !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 12.5px !important;
  line-height: 18px !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .grade-desc-item + .grade-desc-item {
  margin-top: 7px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .grade-desc-title {
  grid-column: 1 !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  line-height: 18px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal :is(.grade-desc-content, .benefit-line) {
  display: block !important;
  grid-column: 2 !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 12.5px !important;
  font-weight: 400 !important;
  line-height: 18px !important;
  white-space: normal !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .benefit-line + .benefit-line {
  margin-top: 4px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .grade-desc-empty-text {
  grid-column: 1 / -1 !important;
  color: var(--cl-text-muted) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .grade-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 4px !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 40px !important;
  min-height: 40px !important;
  max-height: 40px !important;
  margin: 0 !important;
  padding: 4px 8px !important;
  background: var(--cl-bg-2) !important;
  border-top: 1px solid var(--cl-border) !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal :is(.edit-group-btn, .delete-group-btn) {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 30px !important;
  min-height: 30px !important;
  max-height: 30px !important;
  margin: 0 !important;
  padding: 0 9px !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 7px !important;
  color: var(--cl-text-sub) !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .delete-group-btn {
  color: var(--cl-danger) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .edit-group-btn:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .edit-group-btn:focus,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .delete-group-btn:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .delete-group-btn:focus {
  background: var(--cl-green-tint) !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal :is(.shopgrade-edit-icon, .shopgrade-delete-icon) {
  flex: 0 0 15px !important;
  width: 15px !important;
  min-width: 15px !important;
  max-width: 15px !important;
  height: 15px !important;
  min-height: 15px !important;
  max-height: 15px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .grade-block > .grade-actions :is(.shopgrade-edit-icon, .shopgrade-delete-icon) path {
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .shopgrade-action-text {
  display: inline-block !important;
  color: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  line-height: inherit !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .grade-list-wrap + .grade-header {
  display: flex !important;
  justify-content: center !important;
  width: 100% !important;
  margin: 10px 0 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .create-group-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 40px !important;
  min-height: 40px !important;
  max-height: 40px !important;
  margin: 0 !important;
  padding: 0 14px !important;
  background: #fff !important;
  border: 1px solid var(--cl-green) !important;
  border-radius: 8px !important;
  color: var(--cl-green-text) !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .create-group-btn:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .create-group-btn:focus {
  background: var(--cl-green-tint) !important;
  border-color: var(--cl-green) !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .create-group-btn svg,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .create-group-btn svg path {
  position: static !important;
  width: 16px !important;
  height: 16px !important;
  margin: 0 !important;
  color: var(--cl-green) !important;
  fill: currentColor !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .shopgrade-add-text {
  height: auto !important;
  color: inherit !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  line-height: 18px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .shopgrade-notice-setting-link {
  display: flex !important;
  margin: 0 0 10px auto !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .policy-area,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .shopgrade-notice-setting-link + .policy-area {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .gradeauto-line {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  line-height: 20px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .policy-box {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 10px 0 0 !important;
  padding: 16px !important;
  background: var(--cl-bg-2) !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 10px !important;
  color: var(--cl-text-sub) !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .policy-row {
  display: grid !important;
  grid-template-columns: 102px minmax(0, 1fr) !important;
  column-gap: 14px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  font-size: 12.5px !important;
  line-height: 18px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .policy-row + .policy-row {
  margin-top: 10px !important;
  padding-top: 10px !important;
  border-top: 1px solid var(--cl-border) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .policy-label {
  width: auto !important;
  color: var(--cl-text-sub) !important;
  font-weight: 500 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .policy-value,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .policy-value span {
  grid-column: 2 !important;
  color: var(--cl-text) !important;
  font-weight: 500 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .policy-empty-area .gradeauto-line {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .policy-empty-area .policy-box {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: auto !important;
  min-height: 176px !important;
  padding: 24px 18px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .policy-empty-state {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 8px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .policy-empty-title {
  color: var(--cl-text) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 20px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .policy-empty-desc {
  width: 310px !important;
  max-width: 100% !important;
  margin: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 12.5px !important;
  font-weight: 400 !important;
  line-height: 19px !important;
  word-break: keep-all !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .policy-setting-footer {
  display: flex !important;
  justify-content: flex-end !important;
  width: 100% !important;
  margin: 10px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .policy-empty-area .policy-setting-footer {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .auto-adjust-setting {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 36px !important;
  margin: 0 !important;
  padding: 0 12px !important;
  background: #fff !important;
  border: 1px solid var(--cl-green) !important;
  border-radius: 8px !important;
  color: var(--cl-green-text) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .auto-adjust-setting:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .auto-adjust-setting:focus {
  background: var(--cl-green-tint) !important;
  border-color: var(--cl-green) !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .auto-adjust-setting svg,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .auto-adjust-setting svg path {
  position: static !important;
  width: 16px !important;
  height: 16px !important;
  margin: 0 !important;
  fill: currentColor !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .auto-adjust-setting .shopgrade-action-text {
  color: inherit !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 18px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .modal-footer {
  display: flex !important;
  flex: none !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 12px 32px 18px !important;
  background: #fff !important;
  border-top: 1px solid var(--cl-border) !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .modal-footer::before,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .modal-footer::after {
  display: none !important;
  content: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .modal-footer .shopgrade-setting-close-action {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 46px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 9px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .modal-footer .shopgrade-setting-close-action:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .modal-footer .shopgrade-setting-close-action:focus {
  background: var(--cl-green-tint) !important;
  color: var(--cl-green-text) !important;
  outline: 0 !important;
}

@media (max-width: 720px) {
  body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap > .modal-default {
    padding: 12px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-dialog.shopgrade-setting-modal {
    width: calc(100vw - 24px) !important;
    max-width: calc(100vw - 24px) !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .modal-content {
    max-height: calc(100vh - 24px) !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .modal-body {
    padding: 0 20px 24px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .modal-title {
    margin: 0 !important;
    padding: 24px 52px 20px !important;
    font-size: 18px !important;
    line-height: 26px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .grade-grid,
  body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .shopgrade-use-guide-link + .grade-grid + .grade-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    row-gap: 10px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .grade-label {
    padding-top: 0 !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .shopgrade-notice-setting-link {
    justify-content: flex-start !important;
    margin-left: 0 !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .modal-footer {
    padding: 10px 20px 14px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .shopgrade-setting-modal .modal-content > button.close {
    transition: none !important;
  }
}

/* 쇼핑 등급 설정: 레거시 고우선순위 규칙 보정 */
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap > .modal-default > .modal-dialog.shopgrade-setting-modal,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap > .modal-default.in > .modal-dialog.shopgrade-setting-modal,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap > .modal-default.fade > .modal-dialog.shopgrade-setting-modal {
  width: min(600px, calc(100vw - 32px)) !important;
  max-width: min(600px, calc(100vw - 32px)) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .modal-body {
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .modal-title {
  margin: 0 !important;
  padding: 0 64px 22px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .shopgrade-use-guide-link {
  justify-content: center !important;
  width: 100% !important;
  min-height: 18px !important;
  margin: 0 0 22px !important;
  font-size: 13px !important;
  line-height: 18px !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal > .grade-grid {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal > .grade-grid > :is(.grade-grid-left, .grade-grid-right) {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal > .grade-grid > .grade-grid-left {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  justify-self: start !important;
  align-self: stretch !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal > .grade-grid:first-of-type > .grade-grid-left {
  margin-bottom: 10px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal > .grade-grid + .grade-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  column-gap: 16px !important;
  margin-top: 28px !important;
  padding-top: 24px !important;
  border-top: 1px solid var(--cl-border) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal > .grade-grid + .grade-grid > .grade-grid-left {
  grid-column: 1 !important;
  grid-row: 1 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal > .grade-grid + .grade-grid > .grade-grid-right {
  display: contents !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal > .grade-grid + .grade-grid .shopgrade-notice-setting-link {
  grid-column: 2 !important;
  grid-row: 1 !important;
  justify-self: end !important;
  min-height: 18px !important;
  margin: 0 !important;
  font-size: 13px !important;
  line-height: 18px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal > .grade-grid + .grade-grid .policy-area {
  grid-column: 1 / -1 !important;
  grid-row: 2 !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 12px 0 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .grade-grid-left > .grade-label {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  align-self: flex-start !important;
  gap: 5px !important;
  width: auto !important;
  height: 20px !important;
  min-height: 20px !important;
  max-height: 20px !important;
  margin: 0 auto 0 0 !important;
  padding: 0 !important;
  text-align: left !important;
  color: var(--cl-text) !important;
  font-family: var(--cl-source-font) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 20px !important;
  letter-spacing: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .grade-label .config-tooltip,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .grade-label .config-tooltip svg.sg-grade-use {
  flex: 0 0 13px !important;
  width: 13px !important;
  min-width: 13px !important;
  max-width: 13px !important;
  height: 13px !important;
  min-height: 13px !important;
  max-height: 13px !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-green) !important;
  fill: currentColor !important;
  stroke: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .grade-label .config-tooltip svg.sg-grade-use :is(path, rect) {
  fill: currentColor !important;
  stroke: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .grade-list-wrap + .grade-header {
  width: 100% !important;
  height: auto !important;
  margin: 10px 0 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .grade-list-wrap + .grade-header .create-group-btn,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .grade-list-wrap + .grade-header .create-group-btn:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .grade-list-wrap + .grade-header .create-group-btn:focus,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .grade-list-wrap + .grade-header .create-group-btn:focus-visible {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 40px !important;
  min-height: 40px !important;
  max-height: 40px !important;
  gap: 6px !important;
  padding: 0 14px !important;
  color: var(--cl-green-text) !important;
  background: var(--cl-surface) !important;
  background-color: var(--cl-surface) !important;
  border: 1px solid var(--cl-green-action) !important;
  border-color: var(--cl-green-action) !important;
  border-radius: 8px !important;
  outline: 0 !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .grade-list-wrap + .grade-header .create-group-btn:hover {
  color: var(--cl-green-text) !important;
  background: var(--cl-green-tint) !important;
  background-color: var(--cl-green-tint) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .grade-list-wrap + .grade-header .create-group-btn:focus,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .grade-list-wrap + .grade-header .create-group-btn:focus-visible {
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .13) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .create-group-btn .shopgrade-add-icon,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .create-group-btn .shopgrade-add-icon path {
  flex: 0 0 16px !important;
  width: 16px !important;
  min-width: 16px !important;
  max-width: 16px !important;
  height: 16px !important;
  min-height: 16px !important;
  max-height: 16px !important;
  margin: 0 !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .create-group-btn .shopgrade-add-text,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .auto-adjust-setting .shopgrade-action-text {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  color: inherit !important;
  font-family: var(--cl-source-font) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 18px !important;
  letter-spacing: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .policy-empty-area .policy-box {
  min-height: 160px !important;
  margin-top: 0 !important;
  padding: 24px !important;
  background: var(--cl-bg-2) !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 10px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .policy-empty-state {
  gap: 8px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .policy-empty-title {
  color: var(--cl-text) !important;
  font-family: var(--cl-source-font) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 20px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .policy-empty-state > .policy-empty-setting {
  margin-top: 8px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .auto-adjust-setting,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .auto-adjust-setting:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .auto-adjust-setting:focus,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .auto-adjust-setting:focus-visible {
  height: 36px !important;
  min-height: 36px !important;
  max-height: 36px !important;
  gap: 6px !important;
  padding: 0 12px !important;
  color: var(--cl-green-text) !important;
  background: var(--cl-surface) !important;
  border: 1px solid var(--cl-green-action) !important;
  border-radius: 8px !important;
  outline: 0 !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .auto-adjust-setting:hover {
  color: var(--cl-green-text) !important;
  background: var(--cl-green-tint) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .auto-adjust-setting:focus,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .auto-adjust-setting:focus-visible {
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .13) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .auto-adjust-setting .shopgrade-setting-icon,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .auto-adjust-setting .shopgrade-setting-icon :is(circle, path) {
  flex: 0 0 16px !important;
  width: 16px !important;
  min-width: 16px !important;
  max-width: 16px !important;
  height: 16px !important;
  min-height: 16px !important;
  max-height: 16px !important;
  margin: 0 !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .policy-area {
  overflow: hidden !important;
  background: var(--cl-surface) !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 10px !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .policy-area > .gradeauto-line {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  width: 100% !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  background: var(--cl-bg-2) !important;
  border: 0 !important;
  border-bottom: 1px solid var(--cl-border) !important;
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  line-height: 20px !important;
  text-align: left !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .policy-area > .policy-box {
  width: 100% !important;
  margin: 0 !important;
  padding: 4px 16px 10px !important;
  background: var(--cl-surface) !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .policy-box > .policy-row {
  display: grid !important;
  grid-template-columns: 64px minmax(0, 1fr) !important;
  column-gap: 12px !important;
  width: 100% !important;
  min-height: 18px !important;
  margin: 0 !important;
  padding: 7px 0 !important;
  font-size: 12.5px !important;
  line-height: 18px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .policy-box > .policy-row + .policy-row {
  margin-top: 0 !important;
  border-top: 1px solid var(--cl-border) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .policy-box > .policy-row > .policy-label,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .policy-box > .policy-row > .policy-value,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .policy-box > .policy-row > .policy-value span {
  width: auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  font-size: 12.5px !important;
  line-height: 18px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .policy-box > .policy-row > .policy-label {
  color: var(--cl-text-sub) !important;
  font-weight: 600 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .policy-box > .policy-row > .policy-value,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .policy-box > .policy-row > .policy-value span {
  color: var(--cl-text-sub) !important;
  font-weight: 400 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .policy-setting-footer {
  position: static !important;
  grid-column: 1 / -1 !important;
  grid-row: 3 !important;
  justify-self: stretch !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  min-height: 36px !important;
  margin: 10px 0 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-sizing: border-box !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .policy-setting-footer > .auto-adjust-setting {
  flex: 0 0 auto !important;
  margin: 0 0 0 auto !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .policy-area.policy-empty-area + .policy-setting-footer {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .policy-empty-area > .policy-box {
  min-height: 160px !important;
  padding: 24px !important;
  background: var(--cl-bg-2) !important;
  border: 0 !important;
  border-radius: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .grade-block > .grade-line {
  align-items: center !important;
  height: auto !important;
  min-height: 44px !important;
  max-height: none !important;
  padding: 16px 16px 8px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .grade-block > .grade-line > .grade-name {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  height: 20px !important;
  min-height: 20px !important;
  max-height: 20px !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 20px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .grade-block > .grade-line > .grade-name > :is(.grade-default-badge, .grade_auto-badge) {
  position: static !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  align-self: center !important;
  height: 18px !important;
  min-height: 18px !important;
  max-height: 18px !important;
  margin: 0 !important;
  padding: 0 6px !important;
  border-radius: 4px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  vertical-align: middle !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .grade-block > .grade-line > .grade-name > .grade_auto-badge,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .grade-block > .grade-line > .grade-name > .auto-icon > .grade_auto-badge {
  color: var(--cl-green-text) !important;
  background: var(--cl-green-badge) !important;
  border-color: var(--cl-green-line) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal :is(.shopgrade-setting-tooltip, .shopgrade-auto-tooltip).shopgrade-setting-info-popover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal :is(.shopgrade-setting-tooltip, .shopgrade-auto-tooltip).shopgrade-setting-info-popover:is(:hover, :focus, :active) {
  color: var(--cl-green) !important;
  fill: var(--cl-green) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .grade-block[data-fixed="true"] > .grade-desc {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 16px 14px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .grade-block[data-fixed="true"] > .grade-desc > .grade-desc-list,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .grade-block[data-fixed="true"] > .grade-desc > .grade-desc-list > .grade-desc-item {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .grade-block[data-fixed="true"] > .grade-desc > .grade-desc-list > .grade-desc-item {
  grid-template-columns: 64px minmax(0, 1fr) !important;
  column-gap: 12px !important;
  min-height: 18px !important;
  font-size: 12.5px !important;
  line-height: 18px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .grade-block > .grade-desc > .grade-desc-list > .grade-desc-item,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .grade-block[data-fixed="true"] > .grade-desc > .grade-desc-list > .grade-desc-item {
  margin: 0 !important;
  padding: 7px 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .grade-block > .grade-desc > .grade-desc-list > .grade-desc-item + .grade-desc-item,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .grade-block[data-fixed="true"] > .grade-desc > .grade-desc-list > .grade-desc-item + .grade-desc-item {
  margin-top: 0 !important;
  border-top: 1px solid var(--cl-border) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .grade-block > .grade-actions :is(.edit-group-btn, .delete-group-btn) {
  gap: 5px !important;
  height: 30px !important;
  min-height: 30px !important;
  max-height: 30px !important;
  padding: 0 9px !important;
  color: var(--cl-text-sub) !important;
  font-family: var(--cl-source-font) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 18px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .grade-block > .grade-actions :is(.shopgrade-edit-icon, .shopgrade-delete-icon) {
  flex: 0 0 var(--cl-shopgrade-action-icon-size, 16px) !important;
  width: var(--cl-shopgrade-action-icon-size, 16px) !important;
  min-width: var(--cl-shopgrade-action-icon-size, 16px) !important;
  max-width: var(--cl-shopgrade-action-icon-size, 16px) !important;
  height: var(--cl-shopgrade-action-icon-size, 16px) !important;
  min-height: var(--cl-shopgrade-action-icon-size, 16px) !important;
  max-height: var(--cl-shopgrade-action-icon-size, 16px) !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .grade-block > .grade-actions .shopgrade-delete-icon {
  --cl-shopgrade-action-icon-size: 14px;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .grade-block > .grade-actions .edit-group-btn .shopgrade-edit-icon,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .grade-block > .grade-actions .edit-group-btn .shopgrade-edit-icon path {
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2px !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal .grade-block > .grade-actions :is(.edit-group-btn, .delete-group-btn) .shopgrade-action-text {
  color: inherit !important;
  font-family: inherit !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 18px !important;
  letter-spacing: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .modal-footer {
  padding: 0 40px 28px !important;
  border-top: 0 !important;
}

@media (max-width: 520px) {
  body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .modal-body {
    padding-right: 24px !important;
    padding-left: 24px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .modal-title {
    margin: 0 !important;
    padding: 24px 52px 20px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal > .grade-grid + .grade-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    row-gap: 8px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal > .grade-grid + .grade-grid .shopgrade-notice-setting-link {
    grid-column: 1 !important;
    grid-row: 2 !important;
    justify-self: start !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal > .grade-grid + .grade-grid .policy-area {
    grid-column: 1 !important;
    grid-row: 3 !important;
    margin-top: 4px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .shopping-grade-modal > .grade-grid + .grade-grid .policy-setting-footer {
    grid-column: 1 !important;
    grid-row: 4 !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-setting-modal-wrap .modal-default .modal-dialog.shopgrade-setting-modal .modal-footer {
    padding-right: 24px !important;
    padding-left: 24px !important;
  }
}

/*
 * Source member data table pages
 * Member and withdrawn lists share this base. Page-specific differences stay
 * in their own sections instead of duplicating the full table rule set.
 */
:is(#cl-member-list-page, #cl-member-leavelist-page) {
  width: auto;
  max-width: none;
  margin-top: 0;
  margin-right: var(--cl-source-app-gutter);
  margin-left: calc(var(--cl-source-app-gutter) + var(--cl-source-sidebar-w));
  padding: 28px 32px 60px;
  background: transparent;
  color: var(--cl-text);
}

:is(#cl-member-list-page, #cl-member-leavelist-page),
:is(#cl-member-list-page, #cl-member-leavelist-page) * {
  box-sizing: border-box;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) > .dashbottom-container {
  float: none;
  width: 100%;
  max-width: none;
  min-height: 0;
  margin: 0;
  padding: 0;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .row {
  margin-right: 0;
  margin-left: 0;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) #section-top-menu,
:is(#cl-member-list-page, #cl-member-leavelist-page) .mobile-title,
:is(#cl-member-list-page, #cl-member-leavelist-page) .submenu_navWrap {
  display: none;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .cl-source-member-breadcrumb {
  display: block;
  width: 760px;
  max-width: 100%;
  margin: 0 0 26px;
  padding: 0;
  background: transparent;
  border: 0;
  color: var(--cl-text);
  font-size: 0;
  line-height: 28px;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .cl-source-member-breadcrumb p {
  display: block;
  margin: 11px 0 0;
  padding: 0;
  color: var(--cl-text-sub);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 20px;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .cl-source-member-breadcrumb .bc-link,
:is(#cl-member-list-page, #cl-member-leavelist-page) .cl-source-member-breadcrumb .current {
  display: inline-block;
  color: var(--cl-text);
  font-size: 20px;
  font-weight: 700;
  line-height: 24px;
  vertical-align: middle;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .cl-source-member-breadcrumb .current {
  color: var(--cl-text-sub);
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .cl-source-member-breadcrumb .sep {
  display: inline-block;
  margin: 0 8px;
  color: var(--cl-text-muted);
  font-size: 23px;
  font-weight: 400;
  line-height: 24px;
  vertical-align: middle;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-body,
:is(#cl-member-list-page, #cl-member-leavelist-page) .setting-box,
:is(#cl-member-list-page, #cl-member-leavelist-page) .setting-sub-box,
:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-settings.memberlist,
:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-wrap {
  float: none;
  width: 100%;
  max-width: none;
  min-height: 0;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-settings.memberlist {
  width: 758px;
  max-width: 100%;
  overflow: visible;
  padding: 24px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 14px;
  box-shadow: var(--cl-shadow-panel);
  transition: width .18s ease;
}

#cl-member-list-page .cl-source-member-breadcrumb,
#cl-member-list-page .mng-settings.memberlist {
  width: 950px;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .cl-source-member-toolbar {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 12px;
  width: 100%;
  margin: 0;
  padding: 0;
}

#cl-member-list-page .cl-source-member-toolbar {
  column-gap: 12px;
  row-gap: 0;
}

#cl-member-list-page .cl-source-member-toolbar::before {
  content: "";
  flex: 0 0 100%;
  order: -2;
  width: 100%;
  height: 0;
}

#cl-member-list-page .cl-source-member-toolbar > .mng-title,
#cl-member-list-page .cl-source-member-toolbar > .shopgrade-setting-btn {
  order: -3;
}

#cl-member-list-page .cl-source-member-toolbar > .mng-search-box,
#cl-member-list-page .cl-source-member-toolbar > .mng-subMenu-list {
  order: -1;
  margin-top: 12px;
}

#cl-member-list-page .cl-source-member-toolbar > .table-wrap {
  flex: 0 0 100%;
  margin-top: 12px;
}

#cl-member-list-page .cl-source-member-toolbar .shopgrade-setting-btn {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: auto;
  min-width: 0;
  height: 35px;
  min-height: 35px;
  max-height: 35px;
  margin: 0;
  padding: 0 12px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  box-shadow: none;
  color: var(--cl-text);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 1;
  text-decoration: none;
  transition: background-color .12s ease, border-color .12s ease, color .12s ease;
}

#cl-member-list-page .cl-source-member-toolbar .shopgrade-setting-btn:hover,
#cl-member-list-page .cl-source-member-toolbar .shopgrade-setting-btn:focus-visible {
  background: var(--cl-green-tint);
  border-color: var(--cl-green-line);
  color: var(--cl-green-text);
  outline: 0;
}

#cl-member-list-page .cl-source-member-toolbar .shopgrade-setting-btn:active {
  background: var(--cl-green-soft);
}

#cl-member-list-page .cl-source-member-toolbar .shopgrade-setting-icon {
  display: block;
  flex: 0 0 16px;
  width: 16px;
  min-width: 16px;
  max-width: 16px;
  height: 16px;
  min-height: 16px;
  max-height: 16px;
  margin: 0;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

#cl-member-list-page .cl-source-member-toolbar .shopgrade-setting-text {
  display: inline-block;
  margin: 0;
  color: inherit;
  font: inherit;
  line-height: 1;
  white-space: nowrap;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-title {
  float: none;
  width: auto;
  min-width: 0;
  margin: 0;
  padding: 0;
  color: var(--cl-text);
  font-size: 15px;
  font-weight: 700;
  line-height: 35px;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-title span {
  margin-left: 4px;
  color: var(--cl-green-text);
  font-size: inherit;
  font-weight: 700;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-search-box {
  position: relative;
  flex: 0 0 230px;
  width: 230px;
  max-width: 100%;
  height: 35px;
  margin: 0;
  padding: 0;
  overflow: visible;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-search-box .input-group {
  display: block;
  width: 100%;
  height: 35px;
  margin: 0;
  padding: 0;
  border: 0;
  overflow: visible;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-settings[data-type="member-list"] .mng-search-box .form-control#stx {
  box-sizing: border-box;
  display: block;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  height: 35px;
  margin: 0;
  padding: 0 12px 0 36px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  box-shadow: none;
  color: var(--cl-text);
  font-size: 13.5px;
  line-height: 35px;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-settings[data-type="member-list"] .mng-search-box .form-control#stx:hover,
:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-settings[data-type="member-list"] .mng-search-box .form-control#stx:focus {
  background: #fff;
  border: 1px solid var(--cl-border);
  box-shadow: none;
  outline: 0;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-search-box .input-group-btn {
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 35px;
  height: 35px;
  z-index: 2;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-search-box .search-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 35px;
  height: 35px;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
  color: var(--cl-text-muted);
  transform: none;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-search-box .search-btn:hover,
:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-search-box .search-btn:focus {
  background: transparent;
  border: 0;
  box-shadow: none;
  outline: 0;
  color: var(--cl-text-sub);
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-search-box .search-btn svg {
  display: block;
  width: 15px;
  height: 15px;
  margin: 0;
  background: transparent;
  fill: currentColor;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-subMenu-list {
  display: flex;
  align-items: center;
  gap: 8px;
  width: auto;
  margin: 0 0 0 auto;
  padding: 0;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-selectboxlist {
  display: flex;
  align-items: center;
  gap: 8px;
  width: auto;
  margin: 0;
  padding: 0;
}

#cl-member-list-page .mng-selectboxlist {
  display: contents;
}

#cl-member-list-page .mng-selectboxlist > .input-group-btn {
  order: 1;
  height: 35px;
}

#cl-member-list-page .mng-sortWrap {
  order: 2;
  flex: 0 0 104px;
  width: 104px;
  min-width: 104px;
  max-width: 104px;
}

#cl-member-list-page .mng-shopgradeWrap {
  order: 3;
  flex: 0 0 126px;
  width: 126px;
  min-width: 126px;
  max-width: 126px;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-selectboxlist .input-group-btn {
  display: block;
  width: auto;
  margin: 0;
  padding: 0;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-selectboxlist select,
:is(#cl-member-list-page, #cl-member-leavelist-page) #sfl_sort,
:is(#cl-member-list-page, #cl-member-leavelist-page) #sfl_view {
  width: auto;
  min-width: 92px;
  height: 35px;
  margin: 0;
  padding: 0 30px 0 12px;
  padding-bottom: 0 !important;
  appearance: none;
  -webkit-appearance: none;
  background-color: #fff;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238A8F98' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-position: right 9px center;
  background-repeat: no-repeat;
  background-size: 14px;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  box-shadow: none;
  outline: 0;
  color: var(--cl-text);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 35px;
  text-transform: none;
  cursor: pointer;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-selectboxlist select option,
:is(#cl-member-list-page, #cl-member-leavelist-page) #sfl_sort option,
:is(#cl-member-list-page, #cl-member-leavelist-page) #sfl_view option {
  font-weight: 400;
  text-transform: none;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-selectboxlist .bootstrap-select.cl-member-toolbar-select {
  width: 92px !important;
  height: 35px;
  min-height: 35px;
  max-height: 35px;
  margin: 0;
  vertical-align: top;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-selectboxlist .bootstrap-select.cl-member-toolbar-select > .dropdown-toggle,
:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-selectboxlist .bootstrap-select.cl-member-toolbar-select > .dropdown-toggle:hover,
:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-selectboxlist .bootstrap-select.cl-member-toolbar-select > .dropdown-toggle:focus,
:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-selectboxlist .bootstrap-select.cl-member-toolbar-select.open > .dropdown-toggle {
  width: 92px;
  height: 35px;
  min-height: 35px;
  max-height: 35px;
  margin: 0;
  padding: 0 30px 0 12px;
  background-color: #fff !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238A8F98' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-position: right 8px center;
  background-repeat: no-repeat;
  background-size: 14px;
  border: 1px solid var(--cl-border);
  border-radius: var(--cl-radius-sm);
  box-shadow: none;
  outline: 0 !important;
  color: var(--cl-text);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 33px;
  text-align: left;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-selectboxlist .bootstrap-select.cl-member-toolbar-select.open > .dropdown-toggle {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238A8F98' stroke-width='2'%3E%3Cpath d='M6 15l6-6 6 6'/%3E%3C/svg%3E");
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-selectboxlist .bootstrap-select.cl-member-toolbar-select .filter-option {
  display: flex;
  align-items: center;
  height: 33px;
  padding: 0;
  line-height: 33px;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-selectboxlist .bootstrap-select.cl-member-toolbar-select .filter-option-inner,
:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-selectboxlist .bootstrap-select.cl-member-toolbar-select .filter-option-inner-inner {
  width: 100%;
  padding: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-selectboxlist .bootstrap-select.cl-member-toolbar-select .bs-caret {
  display: none;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-selectboxlist .bootstrap-select.cl-member-toolbar-select > .dropdown-menu {
  width: 100%;
  min-width: 100%;
  margin: 4px 0 0;
  padding: 4px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(20, 24, 32, .14);
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-selectboxlist .bootstrap-select.cl-member-toolbar-select > .dropdown-menu > .inner {
  overflow-x: hidden;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-selectboxlist .bootstrap-select.cl-member-toolbar-select > .dropdown-menu .dropdown-menu.inner {
  min-width: 0 !important;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-selectboxlist .bootstrap-select.cl-member-toolbar-select > .dropdown-menu .dropdown-menu.inner > li > a {
  height: auto;
  padding: 7px 10px;
  border-radius: var(--cl-radius-sm);
  color: var(--cl-text);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 18px;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-selectboxlist .bootstrap-select.cl-member-toolbar-select > .dropdown-menu .dropdown-menu.inner > li.active > a,
:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-selectboxlist .bootstrap-select.cl-member-toolbar-select > .dropdown-menu .dropdown-menu.inner > li.selected > a,
:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-selectboxlist .bootstrap-select.cl-member-toolbar-select > .dropdown-menu .dropdown-menu.inner > li > a:hover,
:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-selectboxlist .bootstrap-select.cl-member-toolbar-select > .dropdown-menu .dropdown-menu.inner > li > a:focus {
  background: var(--cl-green-tint);
  color: var(--cl-green-text);
}

:is(#cl-member-list-page, #cl-member-leavelist-page) :is(.mng-sortWrap, .mng-shopgradeWrap) {
  position: relative;
  display: inline-flex;
  align-items: center;
  width: auto;
  height: 35px;
  min-height: 35px;
  max-height: 35px;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  outline: 0;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) :is(.mng-sortWrap, .mng-shopgradeWrap):hover {
  background: transparent;
  border: 0;
  box-shadow: none;
  outline: 0;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) :is(.mng-sortBtn, .mng-sortshopBtn) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  gap: 6px;
  height: 35px;
  min-height: 35px;
  max-height: 35px;
  min-width: 104px;
  margin: 0;
  padding: 0 12px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  box-shadow: none;
  outline: 0;
  color: var(--cl-text);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 1;
  cursor: pointer;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-sortBtn:focus,
:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-sortBtn:active,
:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-sortBtn.active,
#cl-member-list-page .mng-sortshopBtn:focus,
#cl-member-list-page .mng-sortshopBtn:active,
#cl-member-list-page .mng-sortshopBtn.active {
  border: 1px solid var(--cl-border);
  box-shadow: none;
  outline: 0;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) :is(.mng-sortBtn, .mng-sortshopBtn) span {
  display: inline-block;
  float: none;
  margin: 0;
  color: inherit;
  font-size: inherit;
  font-weight: 400;
  line-height: 1;
  white-space: nowrap;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) :is(.mng-sortBtn, .mng-sortshopBtn):hover {
  background: var(--cl-green-tint);
  border-color: var(--cl-green-line);
  color: var(--cl-green-text);
}

:is(#cl-member-list-page, #cl-member-leavelist-page) :is(.mng-sortBtn, .mng-sortshopBtn) svg {
  display: block;
  flex: none;
  width: 13px;
  height: 13px;
  margin: 0;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

body.cl-dashboard-redesign-page :is(#cl-member-list-page, #cl-member-leavelist-page) .mng-sortBtn svg.sortbtnIcon,
body.cl-dashboard-redesign-page #cl-member-list-page .mng-sortshopBtn svg.sortshopbtnIcon {
  min-width: 0;
  min-height: 0;
}

#cl-member-list-page .mng-sortshopBtn {
  width: 100%;
  min-width: 0;
}

#cl-member-list-page .mng-sortBtn {
  width: 100%;
  min-width: 0;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) :is(.mng-sortlistWrap, .mng-sortshoplistWrap) {
  box-sizing: border-box;
  position: absolute;
  top: 100%;
  right: 0;
  left: auto;
  display: none;
  width: 210px;
  margin: 8px 0 0;
  padding: 14px 16px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(20, 24, 32, .14);
  text-align: left;
  transform: none;
  z-index: 40;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) :is(.sortcheckAll, .sgsortcheckAll) {
  display: block;
  width: 100%;
  margin: 0 0 8px;
  padding: 0 0 10px;
  border-bottom: 1px solid var(--cl-border);
}

:is(#cl-member-list-page, #cl-member-leavelist-page) :is(.mng-sortlistBox, .mng-sortshoplistBox) {
  display: block;
  max-height: none;
  margin: 0;
  padding: 0;
  overflow: visible;
  list-style: none;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) :is(.mng-sortlistBox, .mng-sortshoplistBox) li {
  display: block;
  flex: none;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 6px 0;
  border: 0;
  text-align: left;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) :is(.sortcheckAll, .sgsortcheckAll) .newcheckbox {
  display: block;
  flex: none;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  border: 0;
  text-align: left;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) :is(.mng-sortlistBox, .mng-sortshoplistBox) li:first-child {
  margin-top: 0;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) :is(.mng-sortlistWrap, .mng-sortshoplistWrap) .newcheckbox {
  display: block;
  flex: none;
  width: 100%;
  max-width: none;
  margin: 0;
  text-align: left;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) :is(.mng-sortlistWrap, .mng-sortshoplistWrap) label {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: 100%;
  gap: 8px;
  margin: 0;
  color: var(--cl-text);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 18px;
  cursor: pointer;
  position: static;
  inset: auto;
  transform: none;
  flex: none;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) :is(.mng-sortlistWrap, .mng-sortshoplistWrap) .newcheckboxSvg {
  flex: 0 0 16px;
  width: 16px;
  max-width: 16px;
  height: 16px;
  margin: 0;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) :is(.mng-sortlistWrap, .mng-sortshoplistWrap) .newcheckbox span {
  display: block;
  width: auto;
  max-width: none;
  margin: 0;
  color: inherit;
  line-height: 18px;
  text-align: left;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) :is(.sortcheckAll, .sgsortcheckAll) label {
  font-weight: 800;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) :is(.sortlistBtnWrap, .sortshoplistBtnWrap) {
  margin: 10px 0 0;
  padding: 0;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) :is(.sortlistBtn, .sgsortlistBtn) {
  appearance: none;
  -webkit-appearance: none;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 38px;
  margin: 0;
  padding: 0;
  background: var(--cl-green);
  border: 0;
  border-radius: 8px;
  color: #fff;
  font-size: 13.5px;
  font-weight: 800;
  font-family: inherit;
  line-height: 1;
  cursor: pointer;
  outline: 0;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .table-wrap,
:is(#cl-member-list-page, #cl-member-leavelist-page) .table-container {
  display: block;
  float: none;
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0;
  overflow-x: auto;
  border: 0;
  box-shadow: none;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .memberlist-table,
:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table {
  width: 100%;
  min-width: 0;
  margin: 0;
  table-layout: fixed;
  border-collapse: collapse;
  border-spacing: 0;
  background: #fff;
  border: 0;
  color: var(--cl-text);
  font-size: 13.5px;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .memberlist-table th,
:is(#cl-member-list-page, #cl-member-leavelist-page) .memberlist-table td,
:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table th,
:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table td {
  height: auto;
  background: transparent;
  border-right: 0;
  border-left: 0;
  color: var(--cl-text);
  text-align: center;
  vertical-align: middle;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

body.cl-dashboard-redesign-page #cl-member-list-page .memberlist-table :is(th, td) {
  display: table-cell;
  float: none;
}

body.cl-dashboard-redesign-page #cl-member-list-page .memberlist-table td:is(.cl-member-joined-date, .lastlogin, .cert_date) {
  width: auto;
  margin: 0;
}

body.cl-dashboard-redesign-page #cl-member-list-page .memberlist-table :is(th, td).cl-member-joined-date {
  min-width: 104px;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .memberlist-table th.name,
:is(#cl-member-list-page, #cl-member-leavelist-page) .memberlist-table td.name,
:is(#cl-member-list-page, #cl-member-leavelist-page) .memberlist-table th.nick,
:is(#cl-member-list-page, #cl-member-leavelist-page) .memberlist-table td.nick,
:is(#cl-member-list-page, #cl-member-leavelist-page) .memberlist-table th.nickname,
:is(#cl-member-list-page, #cl-member-leavelist-page) .memberlist-table td.nickname,
:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table th.name,
:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table td.name,
:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table th.nick,
:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table td.nick,
:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table th.nickname,
:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table td.nickname {
  width: 116px !important;
  min-width: 116px !important;
  max-width: 116px;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .memberlist-table th.tel,
:is(#cl-member-list-page, #cl-member-leavelist-page) .memberlist-table td.tel,
:is(#cl-member-list-page, #cl-member-leavelist-page) .memberlist-table th.phone,
:is(#cl-member-list-page, #cl-member-leavelist-page) .memberlist-table td.phone,
:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table th.tel,
:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table td.tel,
:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table th.phone,
:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table td.phone {
  width: 132px !important;
  min-width: 132px !important;
  max-width: 132px;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .memberlist-table th.birth,
:is(#cl-member-list-page, #cl-member-leavelist-page) .memberlist-table td.birth,
:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table th.birth,
:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table td.birth {
  width: 110px !important;
  min-width: 110px !important;
  max-width: 110px;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .memberlist-table th.gender,
:is(#cl-member-list-page, #cl-member-leavelist-page) .memberlist-table td.gender,
:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table th.gender,
:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table td.gender {
  width: 76px !important;
  min-width: 76px !important;
  max-width: 76px;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .memberlist-table th.addr,
:is(#cl-member-list-page, #cl-member-leavelist-page) .memberlist-table td.addr,
:is(#cl-member-list-page, #cl-member-leavelist-page) .memberlist-table th.addr1,
:is(#cl-member-list-page, #cl-member-leavelist-page) .memberlist-table td.addr1,
:is(#cl-member-list-page, #cl-member-leavelist-page) .memberlist-table th.addr2,
:is(#cl-member-list-page, #cl-member-leavelist-page) .memberlist-table td.addr2,
:is(#cl-member-list-page, #cl-member-leavelist-page) .memberlist-table th.address,
:is(#cl-member-list-page, #cl-member-leavelist-page) .memberlist-table td.address,
:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table th.addr,
:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table td.addr,
:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table th.addr1,
:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table td.addr1,
:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table th.addr2,
:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table td.addr2,
:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table th.address,
:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table td.address {
  width: 360px !important;
  min-width: 360px !important;
  max-width: 360px;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .memberlist-table td.addr,
:is(#cl-member-list-page, #cl-member-leavelist-page) .memberlist-table td.addr1,
:is(#cl-member-list-page, #cl-member-leavelist-page) .memberlist-table td.addr2,
:is(#cl-member-list-page, #cl-member-leavelist-page) .memberlist-table td.address,
:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table td.addr,
:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table td.addr1,
:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table td.addr2,
:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table td.address {
  text-align: left;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .memberlist-table th,
:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table th {
  padding: 12px 10px;
  background: #fafbfc;
  border-top: 1px solid var(--cl-border);
  border-bottom: 1px solid var(--cl-border);
  color: var(--cl-text-sub);
  font-size: 12.5px;
  font-weight: 600;
  line-height: 18px;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .memberlist-table th.memberInfo,
:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table th.memberInfo {
  width: 84px !important;
  min-width: 84px !important;
  padding-right: 10px;
  padding-left: 10px;
  white-space: nowrap !important;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .memberlist-table th.memberInfo br,
:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table th.memberInfo br {
  display: none !important;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .memberlist-table td,
:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table td {
  padding: 13px 10px;
  border-top: 0;
  border-bottom: 1px solid var(--cl-border);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 20px;
}

body.cl-dashboard-redesign-page :is(#cl-member-list-page, #cl-member-waitlist-page, #cl-member-blocklist-page, #cl-member-leavelist-page) .mng-list table tbody tr {
  cursor: default;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table tbody tr {
  --cl-member-row-bg: #fff;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table tbody tr.active:not(.listZero) {
  --cl-member-row-bg: var(--cl-green-tint);
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table tbody tr:has(td.no.disabled).active,
:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table tbody tr.listZero {
  --cl-member-row-bg: #fff;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table tbody tr > td {
  background: var(--cl-member-row-bg) !important;
  background-color: var(--cl-member-row-bg) !important;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table tbody tr > td.no.newcheckbox.disabled {
  opacity: 1 !important;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .memberlist-table td.id,
:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table td.id {
  color: var(--cl-green-text);
  font-weight: 600;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .memberlist-table td.email,
:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table td.email {
  color: var(--cl-text);
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .memberlist-table :is(th, td).level,
:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table :is(th, td).level {
  width: 120px !important;
  min-width: 120px !important;
  max-width: 120px;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) #member-level-select {
  width: auto;
  min-width: 54px;
  height: 30px;
  margin: 0;
  padding: 0 22px 0 10px;
  appearance: none;
  -webkit-appearance: none;
  background-color: #fff;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238A8F98' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-position: right 6px center;
  background-repeat: no-repeat;
  background-size: 12px;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  color: var(--cl-text);
  font-size: 13px;
  line-height: 30px;
  cursor: pointer;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) #member-level-select:hover,
:is(#cl-member-list-page, #cl-member-leavelist-page) #member-level-select:focus {
  height: 30px;
  background-color: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  box-shadow: none;
  outline: 0;
}

#cl-member-list-page td.level .bootstrap-select.cl-member-level-select {
  width: 54px !important;
  min-width: 54px;
  height: 30px;
  margin: 0;
  vertical-align: middle;
}

#cl-member-list-page td.level .bootstrap-select.cl-member-level-select > .dropdown-toggle,
#cl-member-list-page td.level .bootstrap-select.cl-member-level-select > .dropdown-toggle:hover,
#cl-member-list-page td.level .bootstrap-select.cl-member-level-select > .dropdown-toggle:focus,
#cl-member-list-page td.level .bootstrap-select.cl-member-level-select.open > .dropdown-toggle {
  width: 54px;
  height: 30px;
  min-height: 30px;
  margin: 0;
  padding: 0 22px 0 10px;
  background-color: #fff !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238A8F98' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-position: right 6px center;
  background-repeat: no-repeat;
  background-size: 12px;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  box-shadow: none;
  outline: 0 !important;
  color: var(--cl-text);
  font-size: 13px;
  font-weight: 400;
  line-height: 28px;
  text-align: left;
}

#cl-member-list-page td.level .bootstrap-select.cl-member-level-select.open > .dropdown-toggle {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238A8F98' stroke-width='2'%3E%3Cpath d='M6 15l6-6 6 6'/%3E%3C/svg%3E");
}

#cl-member-list-page td.level .bootstrap-select.cl-member-level-select .filter-option {
  display: flex;
  align-items: center;
  height: 28px;
  padding: 0;
  line-height: 28px;
}

#cl-member-list-page td.level .bootstrap-select.cl-member-level-select .filter-option-inner,
#cl-member-list-page td.level .bootstrap-select.cl-member-level-select .filter-option-inner-inner {
  width: 100%;
  padding: 0;
}

#cl-member-list-page td.level .bootstrap-select.cl-member-level-select .bs-caret {
  display: none;
}

#cl-member-list-page td.level .bootstrap-select.cl-member-level-select > .dropdown-menu {
  width: 54px;
  min-width: 54px;
  margin: 4px 0 0;
  padding: 4px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
  box-shadow: var(--shadow-menu, 0 14px 40px rgba(20,24,32,.2));
}

#cl-member-list-page td.level .bootstrap-select.cl-member-level-select > .dropdown-menu > .inner {
  overflow-x: hidden;
}

#cl-member-list-page td.level .bootstrap-select.cl-member-level-select > .dropdown-menu .dropdown-menu.inner {
  min-width: 0 !important;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

#cl-member-list-page td.level .bootstrap-select.cl-member-level-select > .dropdown-menu .dropdown-menu.inner > li > a {
  display: flex;
  align-items: center;
  min-height: 30px;
  padding: 6px 10px;
  border-radius: 6px;
  color: var(--cl-text);
  font-size: 13px;
  font-weight: 400;
  line-height: 18px;
}

#cl-member-list-page td.level .bootstrap-select.cl-member-level-select > .dropdown-menu .dropdown-menu.inner > li.active > a,
#cl-member-list-page td.level .bootstrap-select.cl-member-level-select > .dropdown-menu .dropdown-menu.inner > li.selected > a,
#cl-member-list-page td.level .bootstrap-select.cl-member-level-select > .dropdown-menu .dropdown-menu.inner > li > a:hover,
#cl-member-list-page td.level .bootstrap-select.cl-member-level-select > .dropdown-menu .dropdown-menu.inner > li > a:focus {
  background: var(--cl-green-soft);
  box-shadow: inset 0 0 0 1px var(--cl-green-line);
  color: var(--cl-green-text);
}

body.cl-dashboard-redesign-page > .bs-container.cl-member-level-select {
  z-index: 1650;
  width: 54px !important;
  min-width: 54px;
}

body.cl-dashboard-redesign-page > .bs-container.cl-member-level-select > .dropdown-menu {
  width: 54px;
  min-width: 54px;
  margin: 4px 0 0;
  padding: 4px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
  box-shadow: var(--shadow-menu, 0 14px 40px rgba(20,24,32,.2));
}

body.cl-dashboard-redesign-page > .bs-container.cl-member-level-select > .dropdown-menu > .inner {
  overflow-x: hidden;
}

body.cl-dashboard-redesign-page > .bs-container.cl-member-level-select > .dropdown-menu .dropdown-menu.inner {
  min-width: 0 !important;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

body.cl-dashboard-redesign-page > .bs-container.cl-member-level-select > .dropdown-menu .dropdown-menu.inner > li > a {
  display: flex;
  align-items: center;
  min-height: 30px;
  padding: 6px 10px;
  border-radius: 6px;
  color: var(--cl-text);
  font-size: 13px;
  font-weight: 400;
  line-height: 18px;
}

body.cl-dashboard-redesign-page > .bs-container.cl-member-level-select > .dropdown-menu .dropdown-menu.inner > li:is(.active, .selected) > a,
body.cl-dashboard-redesign-page > .bs-container.cl-member-level-select > .dropdown-menu .dropdown-menu.inner > li > a:hover,
body.cl-dashboard-redesign-page > .bs-container.cl-member-level-select > .dropdown-menu .dropdown-menu.inner > li > a:focus {
  background: var(--cl-green-soft);
  box-shadow: inset 0 0 0 1px var(--cl-green-line);
  color: var(--cl-green-text);
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .admin_level {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  min-width: 54px;
  min-height: 28px;
  padding: 0 10px;
  border-radius: 6px;
  background: #f1f2f5;
  color: var(--cl-text-sub);
  font-size: 12.5px;
  font-weight: 800;
  line-height: 28px;
  white-space: nowrap;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .newcheckbox {
  position: relative;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table :is(th, td).newcheckbox {
  display: table-cell !important;
  width: 44px !important;
  min-width: 44px !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: center;
  vertical-align: middle;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table .newcheckbox label {
  position: static;
  inset: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  min-height: 44px;
  margin: 0;
  float: none;
  line-height: 1;
  background: transparent !important;
  background-color: transparent !important;
  transform: none;
  cursor: pointer;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table tbody td.newcheckbox label {
  height: 50px;
  min-height: 50px;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table tbody td.no.newcheckbox.disabled label {
  opacity: 1 !important;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .newcheckbox input[type="checkbox"] {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 16px;
  height: 16px;
  margin: 0;
  opacity: 0;
  cursor: pointer;
  transform: translate(-50%, -50%);
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .newcheckboxSvg {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  flex: none;
  background: transparent !important;
  background-color: transparent !important;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .newcheckbox svg {
  display: block;
  width: 16px;
  height: 16px;
  color: #c9ced6;
  fill: currentColor;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table tbody td.no.newcheckbox.disabled label > svg {
  opacity: 0.32 !important;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table :is(th, td).newcheckbox label > svg:not(.cm-popover-info) {
  position: static !important;
  top: auto !important;
  left: auto !important;
  margin: 0 !important;
  flex: 0 0 16px;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .newcheckbox svg.active {
  display: none;
  color: var(--cl-green);
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .newcheckbox input[type="checkbox"]:checked ~ svg {
  display: none;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .newcheckbox input[type="checkbox"]:checked ~ svg.active {
  display: block;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .member-info {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  margin: 0 auto;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 7px;
  background: transparent;
  box-shadow: none;
  color: var(--cl-text-sub);
  cursor: pointer;
  appearance: none;
  transition: background-color .12s ease, border-color .12s ease, color .12s ease;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .member-info:hover,
:is(#cl-member-list-page, #cl-member-leavelist-page) .member-info:focus-visible {
  background: var(--cl-green-tint);
  border-color: var(--cl-green-line);
  color: var(--cl-green);
  outline: none;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .member-info:active {
  background: var(--cl-green-soft);
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .member-info.is-loading {
  pointer-events: none;
  background: var(--cl-green-tint);
  color: var(--cl-green);
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .member-info svg {
  display: block;
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .member-info.is-loading svg {
  opacity: 0;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .member-info.is-loading::after {
  content: "";
  position: absolute;
  width: 14px;
  height: 14px;
  border: 2px solid var(--cl-green-line);
  border-top-color: var(--cl-green);
  border-radius: 50%;
  animation: cl-member-info-spin .7s linear infinite;
}

@keyframes cl-member-info-spin {
  to {
    transform: rotate(360deg);
  }
}

#info-process.cl-info-process {
  position: fixed !important;
  inset: 0 !important;
  z-index: 10000000000 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100vw !important;
  height: 100vh !important;
  padding: 20px !important;
  background: rgba(20, 24, 32, .24) !important;
  box-sizing: border-box !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transition: opacity .12s ease !important;
}

#info-process.cl-info-process.show {
  display: flex !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

#info-process.cl-info-process .cl-info-process-box {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 14px !important;
  width: 300px !important;
  height: 112px !important;
  min-width: 0 !important;
  max-width: calc(100vw - 48px) !important;
  padding: 24px 28px 22px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 14px !important;
  box-shadow: 0 18px 45px rgba(20, 24, 32, .18) !important;
  box-sizing: border-box !important;
  color: var(--cl-text) !important;
  font-family: var(--cl-source-font) !important;
  text-align: center !important;
}

#info-process.cl-info-process .cl-info-process-spinner {
  display: block !important;
  position: relative !important;
  width: 30px !important;
  height: 30px !important;
  border: 3px solid var(--cl-green-line) !important;
  border-top-color: var(--cl-green) !important;
  border-radius: 50% !important;
  animation: cl-info-process-spin .7s linear infinite !important;
}

#info-process.cl-info-process .cl-info-process-check-icon {
  display: block !important;
  position: static !important;
  inset: auto !important;
  width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  overflow: visible !important;
  color: #03C75A !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  opacity: 1 !important;
  animation: cl-info-process-check-pop .24s ease-out .05s both !important;
}

#info-process.cl-info-process .cl-info-process-check-icon path {
  stroke: currentColor !important;
  stroke-dasharray: 24 !important;
  stroke-dashoffset: 0 !important;
  animation: cl-info-process-check-draw .28s ease-out .08s both !important;
}

.processModal.is-complete svg.cl-info-process-check-icon {
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  width: 40px !important;
  height: 40px !important;
  margin: auto !important;
  overflow: visible !important;
  color: #03C75A !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2.7 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  opacity: 1 !important;
  animation: cl-info-process-check-pop .24s ease-out .05s both !important;
}

.processModal.is-complete svg.cl-info-process-check-icon path {
  stroke: currentColor !important;
  stroke-dasharray: 24 !important;
  stroke-dashoffset: 0 !important;
  animation: cl-info-process-check-draw .28s ease-out .08s both !important;
}

#info-process.cl-info-process p {
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 20px !important;
  max-width: 100%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

#info-process.cl-info-process .cl-info-process-spinner,
#info-process.cl-info-process .cl-info-process-check-icon {
  flex-shrink: 0 !important;
}

/* Preserve progress counters, cancellation and upload results in the shared overlay. */
@layer cl-info-process-detail {
  #info-process.cl-info-process.has-detail > .cl-info-process-box { display: none !important; }
  #info-process.cl-info-process > .cl-info-process-detail {
    position: static !important;
    display: block !important;
    inset: auto !important;
    width: auto !important;
    height: auto !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    overflow: visible !important;
  }
  #info-process .cl-info-process-detail :is(.progress-wrap, .upload-wrap) {
    position: relative !important;
    inset: auto !important;
    display: flex !important;
    flex-direction: column !important;
    width: 420px !important;
    max-width: calc(100vw - 40px) !important;
    height: 300px !important;
    max-height: calc(100vh - 40px) !important;
    margin: 0 !important;
    padding: 32px !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 14px !important;
    background: #fff !important;
    box-shadow: 0 18px 45px rgba(20, 24, 32, .18) !important;
    color: #222428 !important;
    font-family: var(--cl-source-font) !important;
    box-sizing: border-box !important;
    transform: none !important;
    overflow: auto !important;
  }
  #info-process .cl-info-process-detail .upload-wrap { width: 560px !important; height: 520px !important; }
  #info-process .cl-info-process-detail :is(.progress-header, .upload-header) {
    position: relative !important;
    flex: 0 0 auto !important;
    padding: 0 !important;
    margin: 0 !important;
    text-align: center !important;
  }
  #info-process .cl-info-process-detail h1 {
    margin: 0 20px 24px !important;
    padding: 0 !important;
    font: 700 18px/1.4 var(--cl-source-font) !important;
    color: #222428 !important;
    overflow-wrap: anywhere !important;
  }
  #info-process .cl-info-process-detail .file-upload-progress {
    position: relative !important;
    width: 100% !important;
    height: 6px !important;
    margin: 0 0 16px !important;
    border-radius: 3px !important;
    background: #eaf9f1 !important;
    overflow: hidden !important;
  }
  #info-process .cl-info-process-detail .progress-bar {
    height: 100% !important;
    background: #03C75A !important;
    box-shadow: none !important;
  }
  #info-process .cl-info-process-detail :is(.info1, .info2) {
    position: static !important;
    margin: 8px 0 0 !important;
    padding: 0 !important;
    color: #8a8f98 !important;
    font: 400 13px/20px var(--cl-source-font) !important;
    overflow: hidden !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
  }
  #info-process .cl-info-process-detail .info1 i { font-size: 16px !important; color: #03C75A !important; }
  #info-process .cl-info-process-detail .progress-header > p { display: none !important; }
  #info-process .cl-info-process-detail .progress-content { margin-top: auto !important; padding: 14px 0 0 !important; }
  #info-process .cl-info-process-detail :is(.progress-cancel, .upload-cancel) { margin: 0 !important; padding: 0 !important; }
  #info-process .cl-info-process-detail :is(.progress-cancel, .upload-cancel) .btn {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 46px !important;
    margin: 0 !important;
    padding: 0 16px !important;
    border: 0 !important;
    border-radius: 8px !important;
    background: transparent !important;
    color: #8a8f98 !important;
    font: 600 13.5px/1 var(--cl-source-font) !important;
  }
  #info-process .cl-info-process-detail :is(.progress-cancel, .upload-cancel) .btn:is(:hover, :focus-visible) { background: #eaf9f1 !important; color: var(--cl-green-text) !important; }
  #info-process .cl-info-process-detail .upload-content { flex: 1 !important; min-height: 0 !important; margin-top: 20px !important; padding: 0 !important; overflow: auto !important; }
  #info-process .cl-info-process-detail .upload-content .file { width: 100% !important; max-width: 100% !important; box-sizing: border-box !important; }
  #info-process .cl-info-process-detail .file-name { overflow-wrap: anywhere !important; }
  #info-process .cl-info-process-detail > .upload-close { display: none !important; }
  #info-process .cl-info-process-detail .upload-header .upload-close {
    position: absolute !important;
    top: -16px !important;
    right: -16px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 30px !important;
    height: 30px !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 8px !important;
    background: transparent !important;
    color: #8a8f98 !important;
    opacity: 1 !important;
  }
  #info-process .cl-info-process-detail .upload-header .upload-close:is(:hover, :focus-visible) { background: #f1f2f5 !important; color: #222428 !important; }
  #info-process .cl-info-process-detail .upload-close :is(span, svg) { display: block !important; width: 15px !important; height: 15px !important; fill: currentColor !important; }
}

@keyframes cl-info-process-spin {
  to {
    transform: rotate(360deg);
  }
}

@keyframes cl-info-process-check-pop {
  0% {
    opacity: 1;
    transform: scale(.65);
  }
  70% {
    opacity: 1;
    transform: scale(1.12);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes cl-info-process-check-draw {
  from {
    stroke-dashoffset: 24;
  }
  to {
    stroke-dashoffset: 0;
  }
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .listZero td {
  padding: 60px 0;
  color: var(--cl-text-muted);
  font-size: 13.5px;
  text-align: center;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .btn-wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
  margin: 16px 0 0;
  padding: 0;
}

#cl-member-list-page .btn-wrap {
  justify-content: flex-start;
}

#cl-member-list-page .cl-source-member-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  max-width: 100%;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .member-leave-btn,
:is(#cl-member-list-page, #cl-member-leavelist-page) .member-block-btn,
:is(#cl-member-list-page, #cl-member-leavelist-page) .member-level-btn,
#cl-member-list-page .member-shopgrade-btn {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  height: 34px;
  min-height: 34px;
  margin: 0;
  padding: 6px 12px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  box-shadow: none;
  color: #8a8f98 !important;
  font-size: 12.5px;
  font-weight: 700;
  line-height: 18px;
  opacity: 1 !important;
  text-decoration: none;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .member-leave-btn:hover,
:is(#cl-member-list-page, #cl-member-leavelist-page) .member-block-btn:hover,
:is(#cl-member-list-page, #cl-member-leavelist-page) .member-level-btn:hover,
#cl-member-list-page .member-shopgrade-btn:hover {
  background: #fafbfc;
  border-color: #d5d9e0;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-bottom-btn-wrap {
  display: flex;
  align-items: center;
  align-self: center;
  float: none;
  margin: 0 0 0 auto;
  padding: 0;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-bottom-btn-wrap .btn {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  height: 34px;
  min-height: 34px;
  margin: 0;
  padding: 6px 12px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  box-shadow: none;
  color: #8a8f98 !important;
  font-size: 12.5px;
  font-weight: 600;
  line-height: 18px;
  text-decoration: none;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-bottom-btn-wrap .btn:hover {
  background: #fafbfc;
  border-color: #d5d9e0;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-exel-download {
  width: 12px;
  height: 10px;
  margin-right: 6px;
  fill: currentColor;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) nav.text-center {
  display: flex;
  justify-content: center;
  width: 100%;
  margin: 22px 0 0;
  padding: 0;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-list-pagination {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-list-pagination > li {
  display: inline-flex;
  margin: 0;
  padding: 0;
  border: 0;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-list-pagination > li > a,
:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-list-pagination > li > span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  min-width: 30px;
  height: 30px;
  margin: 0;
  padding: 0 8px;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 6px;
  color: var(--cl-text-sub);
  font-size: 13px;
  font-weight: 400;
  line-height: 1;
  text-decoration: none;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-list-pagination > li.active > a,
:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-list-pagination > li.active > span {
  background: #fcfcfb;
  border-color: var(--cl-green);
  color: var(--cl-green-text);
  font-weight: 700;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-list-pagination > li > a:hover {
  background: var(--cl-green-tint);
  color: var(--cl-green-text);
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-list-pagination .mng-arrow {
  display: block;
  width: 15px;
  height: 15px;
  color: var(--cl-text-muted);
  fill: currentColor;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-list-pagination .fa-angle-double-left,
:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-list-pagination .fa-angle-double-right {
  display: block;
  width: 15px;
  height: 15px;
  background-color: currentColor;
  color: var(--cl-text-muted);
  font-size: 0;
  line-height: 0;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: 15px 15px;
  mask-size: 15px 15px;
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-list-pagination .fa-angle-double-left {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M18 6l-6 6 6 6M11 6l-6 6 6 6'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M18 6l-6 6 6 6M11 6l-6 6 6 6'/%3E%3C/svg%3E");
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-list-pagination .fa-angle-double-right {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6 6l6 6-6 6M13 6l6 6-6 6'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6 6l6 6-6 6M13 6l6 6-6 6'/%3E%3C/svg%3E");
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-list-pagination .fa-angle-double-left::before,
:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-list-pagination .fa-angle-double-right::before {
  content: "";
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-list-pagination > li > a:hover .mng-arrow,
:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-list-pagination > li > a:hover .fa-angle-double-left,
:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-list-pagination > li > a:hover .fa-angle-double-right {
  color: var(--cl-green);
}

:is(#cl-member-list-page, #cl-member-leavelist-page) .mng-list-pagination > li.nonpage > a {
  pointer-events: none;
  color: var(--cl-text-muted);
}

/* Source member detail modal */
/* Member workflows also include legacy notices and nested confirmations. */
@layer cl-member-modal-chrome {
  body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-member-workflow-wrap, .cl-source-coupon-confirm-wrap) {
    position: fixed !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    background: rgba(0, 0, 0, .45) !important;
    z-index: var(--cl-coupon-modal-z, var(--cl-member-modal-z, 1000000)) !important;
  }

  body.cl-dashboard-redesign-page :is(.cl-source-member-workflow-wrap, .cl-source-coupon-confirm-wrap) + .modal-backdrop,
  body.cl-dashboard-redesign-page :is(.cl-source-member-workflow-wrap, .cl-source-coupon-confirm-wrap) .modal-default > .cl-mobile-btn.close {
    display: none !important;
  }

  body.cl-dashboard-redesign-page :is(.cl-source-member-workflow-wrap, .cl-source-coupon-confirm-wrap) .modal-content > .close-button-dialog {
    position: absolute !important;
    top: 16px !important;
    right: 16px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 30px !important;
    height: 30px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 8px !important;
    background: transparent !important;
    color: var(--cl-text-sub) !important;
    opacity: 1 !important;
    font-size: 0 !important;
    line-height: 0 !important;
    box-shadow: none !important;
    transform: none !important;
    transition: background .12s, color .12s, transform .18s cubic-bezier(.34,1.56,.64,1) !important;
  }

  body.cl-dashboard-redesign-page :is(.cl-source-member-workflow-wrap, .cl-source-coupon-confirm-wrap) .modal-content > .close-button-dialog:is(:hover, :focus-visible) {
    background: #f1f2f5 !important;
    color: var(--cl-text) !important;
    transform: rotate(90deg) !important;
  }

  body.cl-dashboard-redesign-page :is(.cl-source-member-workflow-wrap, .cl-source-coupon-confirm-wrap) .modal-content > .close-button-dialog::before,
  body.cl-dashboard-redesign-page :is(.cl-source-member-workflow-wrap, .cl-source-coupon-confirm-wrap) .modal-content > .close-button-dialog::after {
    content: none !important;
    display: none !important;
  }

  body.cl-dashboard-redesign-page :is(.cl-source-member-workflow-wrap, .cl-source-coupon-confirm-wrap) .modal-content > .close-button-dialog :is(span, svg) {
    display: block !important;
    width: 15px !important;
    height: 15px !important;
    margin: 0 !important;
    fill: currentColor !important;
    stroke: none !important;
  }

  body.cl-dashboard-redesign-page :is(.cl-source-member-workflow-wrap, .cl-source-coupon-confirm-wrap) .modal-footer > .btn {
    order: 1 !important;
    float: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 46px !important;
    padding: 0 16px !important;
    border: 0 !important;
    border-radius: 8px !important;
    background: transparent !important;
    color: var(--cl-text-sub) !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    line-height: 20px !important;
    box-shadow: none !important;
    text-transform: none !important;
    transition: background .12s, color .12s !important;
  }

  body.cl-dashboard-redesign-page :is(.cl-source-member-workflow-wrap, .cl-source-coupon-confirm-wrap) .modal-footer > .btn:is(:hover, :focus-visible) {
    background: var(--cl-green-soft) !important;
    color: var(--cl-green-text) !important;
  }

  body.cl-dashboard-redesign-page :is(.cl-source-member-workflow-wrap, .cl-source-coupon-confirm-wrap) .modal-footer > .ok-button-dialog {
    order: 0 !important;
    background: var(--cl-green) !important;
    color: #fff !important;
    font-size: 15px !important;
    font-weight: 700 !important;
  }

  body.cl-dashboard-redesign-page :is(.cl-source-member-workflow-wrap, .cl-source-coupon-confirm-wrap) .modal-footer > .ok-button-dialog:is(:hover, :focus-visible) {
    background: var(--cl-green-hover) !important;
    color: #fff !important;
  }

  body.cl-dashboard-redesign-page :is(.cl-source-member-workflow-wrap, .cl-source-coupon-confirm-wrap) .cl-member-danger .modal-footer > .ok-button-dialog {
    background: var(--cl-danger, #e5484d) !important;
  }

  body.cl-dashboard-redesign-page :is(.cl-source-member-workflow-wrap, .cl-source-coupon-confirm-wrap) .cl-member-danger .modal-footer > .ok-button-dialog:is(:hover, :focus-visible) {
    background: #cf3e43 !important;
  }

  body.cl-dashboard-redesign-page :is(.cl-source-member-workflow-wrap, .cl-source-coupon-confirm-wrap) .modal-footer > .btn:disabled {
    opacity: .5 !important;
    cursor: not-allowed !important;
  }

  body.cl-dashboard-redesign-page :is(.cl-source-member-workflow-wrap, .cl-source-coupon-confirm-wrap) .modal-footer > .btn:is(.hide, [hidden]) {
    display: none !important;
  }
}

body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-member-workflow-wrap, .cl-source-coupon-confirm-wrap):has(:is(.cl-source-member-workflow-modal, .cl-source-coupon-confirm-modal)) > .modal-default {
  position: absolute !important;
  inset: 0 !important;
  display: flex !important;
  align-items: flex-start !important;
  width: 100% !important;
  height: 100% !important;
  padding: 32px 16px !important;
  overflow: auto !important;
  background: transparent !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-member-workflow-wrap, .cl-source-coupon-confirm-wrap) .modal-default .modal-dialog:is(.cl-source-member-workflow-modal, .cl-source-coupon-confirm-modal) {
  position: relative !important;
  inset: auto !important;
  flex: 0 1 560px !important;
  width: 560px !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: auto !important;
  max-height: none !important;
  margin: auto !important;
  padding: 0 !important;
  overflow: visible !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-member-workflow-wrap .modal-default .modal-dialog.cl-source-member-workflow-modal:is(.cl-member-list-leave-modal, .cl-member-list-leave-empty-modal, .cl-member-list-block-modal, .cl-member-list-level-modal, .cl-member-list-shopgrade-modal, .cl-member-list-block, .cl-member-collection-delete-modal),
body.cl-dashboard-redesign-page .flat-modal.cl-source-member-workflow-wrap .modal-default.cl-source-uadmin-modal > .modal-dialog.cl-source-member-workflow-modal:is(.uadmin-memo-edit-modal, .cl-member-danger) {
  flex-basis: 440px !important;
  width: 440px !important;
  max-width: calc(100vw - 32px) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-member-workflow-wrap .modal-default .modal-dialog.cl-member-list-shopgrade-modal :is(.modal-content, .modal-body, .modal-footer, .sg-modal, .grade-create-table, .grade-create-table tbody) {
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
}

body.cl-dashboard-redesign-page .cl-source-member-workflow-wrap .cl-member-list-shopgrade-modal .shopgrade-modal-select .member-custom-select-btn:hover {
  border-color: var(--cl-border-hover, #d5d9e0);
}

body.cl-dashboard-redesign-page .cl-source-member-workflow-wrap .cl-member-list-shopgrade-modal .shopgrade-modal-select.active .member-custom-select-btn,
body.cl-dashboard-redesign-page .cl-source-member-workflow-wrap .cl-member-list-shopgrade-modal .shopgrade-modal-select .member-custom-select-btn:focus-visible {
  color: var(--cl-green-text);
  border-color: var(--cl-green-action, #03c75a);
}

body.cl-dashboard-redesign-page .cl-source-member-workflow-wrap .cl-member-list-shopgrade-modal .shopgrade-modal-select .member-custom-select-btn:focus-visible {
  box-shadow: var(--cl-ring, 0 0 0 3px rgba(3, 199, 90, .13));
}

body.cl-dashboard-redesign-page .cl-source-member-workflow-wrap .cl-member-list-shopgrade-modal .shopgrade-modal-select.active .member-custom-select-btn svg,
body.cl-dashboard-redesign-page .cl-source-member-workflow-wrap .cl-member-list-shopgrade-modal .shopgrade-modal-select .member-custom-select-btn:focus-visible svg {
  fill: var(--cl-green, #03C75A);
}

body.cl-dashboard-redesign-page .cl-source-member-workflow-wrap .cl-member-list-shopgrade-modal .shopgrade-modal-select .member-custom-select-option:is(:hover, .active) {
  color: var(--cl-green-text);
  background-color: var(--cl-green-soft, #eaf9f1);
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-member-workflow-wrap .modal-default .modal-dialog.cl-member-list-shopgrade-modal .shopgrade-notice-row {
  width: 100% !important;
  max-width: 376px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-member-workflow-wrap .modal-default .modal-dialog.cl-member-list-shopgrade-modal .shopgrade-notice-row:not(.shopgrade-notice-disabled) .shopgrade-notice-check,
body.cl-dashboard-redesign-page .flat-modal.cl-source-member-workflow-wrap .modal-default .modal-dialog.cl-member-list-shopgrade-modal .shopgrade-notice-row:not(.shopgrade-notice-disabled) .shopgrade-notice-check .newcheckboxSvg,
body.cl-dashboard-redesign-page .flat-modal.cl-source-member-workflow-wrap .modal-default .modal-dialog.cl-member-list-shopgrade-modal .shopgrade-notice-row:not(.shopgrade-notice-disabled) .shopgrade-notice-check input {
  background-color: transparent !important;
  background-image: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-member-workflow-wrap .modal-default .modal-dialog.cl-member-list-shopgrade-modal .shopgrade-notice-row:not(.shopgrade-notice-disabled) .shopgrade-notice-check .newcheckboxSvg svg:not(.disabled) {
  display: none !important;
  fill: transparent !important;
  opacity: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-member-workflow-wrap .modal-default .modal-dialog.cl-member-list-shopgrade-modal .shopgrade-notice-row:not(.shopgrade-notice-disabled) .shopgrade-notice-check .newcheckboxSvg::before,
body.cl-dashboard-redesign-page .flat-modal.cl-source-member-workflow-wrap .modal-default .modal-dialog.cl-member-list-shopgrade-modal .shopgrade-notice-row:not(.shopgrade-notice-disabled) .shopgrade-notice-check .newcheckboxSvg::after {
  content: "";
  position: absolute;
  box-sizing: border-box;
  pointer-events: none;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-member-workflow-wrap .modal-default .modal-dialog.cl-member-list-shopgrade-modal .shopgrade-notice-row:not(.shopgrade-notice-disabled) .shopgrade-notice-check .newcheckboxSvg::before {
  inset: 0;
  background: transparent;
  border: 1px solid var(--cl-border-hover, #d5d9e0);
  border-radius: 3px;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-member-workflow-wrap .modal-default .modal-dialog.cl-member-list-shopgrade-modal .shopgrade-notice-row:not(.shopgrade-notice-disabled) .shopgrade-notice-check .newcheckboxSvg::after {
  top: 2px;
  left: 5px;
  width: 5px;
  height: 9px;
  border: solid var(--cl-green-action, #03c75a);
  border-width: 0 2px 2px 0;
  opacity: 0;
  transform: rotate(45deg);
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-member-workflow-wrap .modal-default .modal-dialog.cl-member-list-shopgrade-modal .shopgrade-notice-row:not(.shopgrade-notice-disabled) .shopgrade-notice-check .newcheckboxSvg:has(input:checked)::before {
  border-color: var(--cl-green-action, #03c75a);
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-member-workflow-wrap .modal-default .modal-dialog.cl-member-list-shopgrade-modal .shopgrade-notice-row:not(.shopgrade-notice-disabled) .shopgrade-notice-check .newcheckboxSvg:has(input:checked)::after {
  opacity: 1;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-member-workflow-wrap .modal-default .modal-dialog.cl-member-list-shopgrade-modal .shopgrade-notice-row:not(.shopgrade-notice-disabled) .shopgrade-notice-check .newcheckboxSvg:has(input:focus-visible) {
  border-radius: 3px;
  box-shadow: var(--cl-ring, 0 0 0 3px rgba(3, 199, 90, .13));
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-member-workflow-wrap .modal-default .modal-dialog.cl-member-list-shopgrade-modal .shopgrade-notice-tooltip-wrap,
body.cl-dashboard-redesign-page .flat-modal.cl-source-member-workflow-wrap .modal-default .modal-dialog.cl-member-list-shopgrade-modal .shopgrade-notice-tooltip {
  color: var(--cl-green) !important;
  fill: var(--cl-green) !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-member-workflow-wrap .modal-default .modal-dialog.cl-member-list-shopgrade-modal .shopgrade-notice-tooltip :is(path, rect, circle) {
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page > .tooltip.shopgrade-notice-tooltip-popover {
  z-index: 1000100 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-member-workflow-wrap .modal-default .modal-dialog.cl-member-list-shopgrade-modal .modal-title {
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 18px 24px !important;
  text-align: center !important;
}

@media (min-width: 768px) {
  body.cl-dashboard-redesign-page .flat-modal.cl-source-member-workflow-wrap .modal-default .modal-dialog.cl-member-list-shopgrade-modal .grade-create-table tr {
    grid-template-columns: 50px minmax(0, 258px) !important;
    column-gap: 50px !important;
    justify-content: center !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-member-workflow-wrap .modal-default .modal-dialog.cl-member-list-shopgrade-modal .grade-create-table tr > td:first-child {
    grid-column: 1 !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-member-workflow-wrap .modal-default .modal-dialog.cl-member-list-shopgrade-modal .grade-create-table tr > td:last-child {
    grid-column: 2 !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-member-workflow-wrap .modal-default .modal-dialog.cl-member-list-shopgrade-modal .grade-create-table tr > td[colspan] {
    grid-column: 1 / -1 !important;
  }

  body.cl-dashboard-redesign-page .cl-member-list-shopgrade-modal .grade-create-table tr:last-child > .form-title-chagne {
    align-items: center;
    height: 36px;
    min-height: 36px;
    max-height: 36px;
  }
}

body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-member-workflow-wrap, .cl-source-coupon-confirm-wrap) .modal-default :is(.cl-source-member-workflow-modal, .cl-source-coupon-confirm-modal) .modal-content {
  position: relative !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  padding: 40px 36px 28px !important;
  overflow: visible !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 14px !important;
  background: #fff !important;
  box-shadow: 0 20px 50px rgba(20,24,32,.25) !important;
  color: var(--cl-text) !important;
}

body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-member-workflow-wrap, .cl-source-coupon-confirm-wrap) .modal-default :is(.cl-source-member-workflow-modal, .cl-source-coupon-confirm-modal) :is(.modal-body, .modal-footer) {
  position: static !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--cl-text-sub) !important;
  font-size: 14px !important;
  line-height: 1.7 !important;
  text-align: center !important;
  overflow-wrap: anywhere;
}

body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-member-workflow-wrap, .cl-source-coupon-confirm-wrap) .modal-default :is(.cl-source-member-workflow-modal, .cl-source-coupon-confirm-modal) .modal-footer {
  margin-top: 28px !important;
}

body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-member-workflow-wrap, .cl-source-coupon-confirm-wrap) .modal-default :is(.cl-source-member-workflow-modal, .cl-source-coupon-confirm-modal) .modal-title {
  margin: 0 18px 24px !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  line-height: 28px !important;
  letter-spacing: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .cl-source-member-workflow-modal .modal-title:empty {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.shopgrade-delete-confirm-modal {
  flex-basis: 440px !important;
  width: min(440px, calc(100vw - 32px)) !important;
  min-width: 0 !important;
  max-width: min(440px, calc(100vw - 32px)) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.shopgrade-delete-confirm-modal :is(.modal-content, .modal-body, .modal-footer) {
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.shopgrade-delete-confirm-modal .modal-content {
  padding-right: 28px !important;
  padding-left: 28px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.shopgrade-delete-confirm-modal .modal-footer {
  width: 384px !important;
  max-width: calc(100% + 2px) !important;
  margin-right: auto !important;
  margin-left: auto !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.shopgrade-delete-confirm-modal .modal-footer > .btn {
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin-right: 0 !important;
  margin-left: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.shopgrade-delete-confirm-modal .modal-title {
  box-sizing: border-box !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.shopgrade-delete-confirm-modal .delete-grade-modal {
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin-right: auto !important;
  margin-left: auto !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.shopgrade-delete-confirm-modal .delete-grade-name-row {
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.shopgrade-delete-confirm-modal .delete-grade-message {
  max-width: 100% !important;
  margin-right: auto !important;
  margin-left: auto !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.shopgrade-delete-confirm-modal:has(.delete-grade-name-row) .modal-title {
  margin-bottom: 20px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.shopgrade-delete-confirm-modal:has(.delete-grade-name-row) .delete-grade-modal {
  margin-top: 0 !important;
}

@layer cl-member-modal-chrome {
  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.shopgrade-delete-confirm-modal:has(.delete-grade-name-row) .modal-footer .ok-button-dialog,
  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.shopgrade-delete-confirm-modal:has(.delete-grade-name-row) .modal-footer .ok-button-dialog:hover,
  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.shopgrade-delete-confirm-modal:has(.delete-grade-name-row) .modal-footer .ok-button-dialog:focus {
    background: var(--cl-danger, #e5484d) !important;
    border: 1px solid var(--cl-danger, #e5484d) !important;
    color: #fff !important;
  }
}

body.cl-dashboard-redesign-page .cl-source-member-workflow-modal :is(.mng-modal-body, .addressee-wrap, .uadmin-wrap, .uadmin-txt) {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 14px !important;
  line-height: 1.7 !important;
}

body.cl-dashboard-redesign-page .cl-source-member-workflow-modal .level-modal {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}

body.cl-dashboard-redesign-page .cl-source-member-workflow-modal .level-modal > :is(p, .error) {
  grid-column: 1 / -1;
}

body.cl-dashboard-redesign-page .cl-source-member-workflow-modal .level-modal .level-btn {
  width: 100% !important;
  height: 40px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  background: #fff !important;
  color: var(--cl-text) !important;
  font-size: 14px !important;
  line-height: 38px !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .cl-source-member-workflow-modal .level-modal .level-btn:is(:hover, :focus-visible, .active) {
  border-color: var(--cl-green) !important;
  background: var(--cl-green-soft) !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-member-workflow-modal :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), textarea, select).form-control,
body.cl-dashboard-redesign-page .cl-source-member-workflow-modal #uadm-memo {
  width: 100% !important;
  max-width: 100% !important;
  min-height: 42px !important;
  margin: 0 !important;
  padding: 10px 12px !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  background: #fff !important;
  color: var(--cl-text) !important;
  font-size: 14px !important;
  line-height: 20px !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .cl-source-member-workflow-modal :is(.form-control, #uadm-memo):focus {
  outline: 0 !important;
  border-color: var(--cl-green) !important;
  box-shadow: 0 0 0 3px rgba(3,199,90,.13) !important;
}

body.cl-dashboard-redesign-page .cl-source-member-workflow-modal textarea {
  min-height: 100px !important;
  resize: vertical;
}

body.cl-dashboard-redesign-page .cl-source-member-workflow-modal .error {
  display: block;
  margin-top: 8px;
  color: var(--cl-danger, #e5484d) !important;
  font-size: 12.5px !important;
  line-height: 20px !important;
}

body.cl-dashboard-redesign-page .cl-source-member-workflow-modal.block-add-modal .form-inline {
  display: grid;
  grid-template-columns: 140px minmax(0, 1fr);
  gap: 12px;
}

body.cl-dashboard-redesign-page .cl-source-member-workflow-modal.block-add-modal :is(.form-row, .form-inline) {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-member-workflow-modal.block-add-modal .form-inline::before,
body.cl-dashboard-redesign-page .cl-source-member-workflow-modal.block-add-modal .form-inline::after {
  display: none;
}

body.cl-dashboard-redesign-page .cl-source-member-workflow-modal.block-add-modal .form-group {
  width: 100%;
  margin: 0;
  padding: 0;
  text-align: left;
}

@media (max-width: 600px) {
  body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-member-workflow-wrap, .cl-source-coupon-confirm-wrap) .modal-default :is(.cl-source-member-workflow-modal, .cl-source-coupon-confirm-modal) .modal-content {
    padding: 40px 20px 24px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-member-workflow-modal.block-add-modal .form-inline {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* Shopping grade add/edit modal */
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-form-modal-wrap > .modal-default > .modal-dialog.shopgrade-add-modal {
  flex: 0 1 600px !important;
  width: min(600px, calc(100vw - 32px)) !important;
  min-width: 0 !important;
  max-width: min(600px, calc(100vw - 32px)) !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: auto !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-form-modal-wrap .modal-default .modal-dialog.shopgrade-add-modal > .modal-content {
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: calc(100vh - 64px) !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: var(--cl-surface, #fff) !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 14px !important;
  box-shadow: 0 20px 50px rgba(20, 24, 32, .25) !important;
  color: var(--cl-text) !important;
  font-family: var(--cl-source-font) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-form-modal-wrap .modal-default .modal-dialog.shopgrade-add-modal > .modal-content > .modal-title {
  display: block !important;
  box-sizing: border-box !important;
  flex: 0 0 auto !important;
  width: 100% !important;
  min-width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 44px 64px 28px !important;
  color: var(--cl-text) !important;
  font-family: inherit !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  line-height: 28px !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  white-space: normal !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-form-modal-wrap .modal-default .modal-dialog.shopgrade-add-modal > .modal-content > button.close {
  top: 20px !important;
  right: 22px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-form-modal-wrap .modal-default .modal-dialog.shopgrade-add-modal .modal-body {
  flex: 1 1 auto !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 40px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-form-modal-wrap .modal-default .modal-dialog.shopgrade-add-modal :is(#grade-form, .mng-modal-body, .grade-create-table) {
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 520px !important;
  margin-right: auto !important;
  margin-left: auto !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-form-modal-wrap .modal-default .modal-dialog.shopgrade-add-modal .config-tooltip {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-left: 4px !important;
  color: var(--cl-green) !important;
  line-height: 1 !important;
  vertical-align: -1px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-form-modal-wrap .modal-default .modal-dialog.shopgrade-add-modal .config-tooltip svg.sg-grade-use {
  display: block !important;
  width: 13px !important;
  min-width: 13px !important;
  height: 13px !important;
  margin: 0 !important;
  color: inherit !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-form-modal-wrap .modal-default .modal-dialog.shopgrade-add-modal .config-tooltip svg.sg-grade-use :is(path, rect, circle) {
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-form-modal-wrap .modal-default .modal-dialog.shopgrade-add-modal .grade-create-table td.form-title {
  color: var(--cl-text-strong-sub, #5c616b) !important;
  font-family: inherit !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-form-modal-wrap .modal-default .modal-dialog.shopgrade-add-modal .grade-create-table input[type="text"] {
  border: 1px solid var(--cl-border) !important;
  border-radius: 6px !important;
  background: var(--cl-surface, #fff) !important;
  color: var(--cl-text) !important;
  font-family: inherit !important;
  font-size: 13.5px !important;
  box-shadow: none !important;
  transition: border-color .12s, background .12s, box-shadow .12s !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-form-modal-wrap .modal-default .modal-dialog.shopgrade-add-modal .grade-create-table input[type="text"]:hover {
  border-color: var(--cl-border-hover) !important;
  background: var(--cl-bg-subtle) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-form-modal-wrap .modal-default .modal-dialog.shopgrade-add-modal .grade-create-table input[type="text"]:focus {
  border-color: var(--cl-green-action, #03c75a) !important;
  background: var(--cl-surface, #fff) !important;
  outline: 0 !important;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .13) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-form-modal-wrap .modal-default .modal-dialog.shopgrade-add-modal .grade-create-table input[type="text"].input-error,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-form-modal-wrap .modal-default .modal-dialog.shopgrade-add-modal .grade-create-table input[type="text"].input-error:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-form-modal-wrap .modal-default .modal-dialog.shopgrade-add-modal .grade-create-table input[type="text"].input-error:focus {
  border-color: var(--cl-danger, #e5484d) !important;
  box-shadow: 0 0 0 3px rgba(229, 72, 77, .13) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-form-modal-wrap .modal-default .modal-dialog.shopgrade-add-modal :is(.criteria-cycle, .shopgrade-benefit-max-line > .max-label, .shopgrade-benefit-max-line > .max-label .limit-star) {
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-form-modal-wrap .modal-default .modal-dialog.shopgrade-add-modal .shopgrade-type-select-btn {
  border: 1px solid var(--cl-border) !important;
  border-radius: 6px !important;
  background: var(--cl-surface, #fff) !important;
  color: var(--cl-text-sub) !important;
  font-family: inherit !important;
  box-shadow: none !important;
  transition: border-color .12s, background .12s, box-shadow .12s !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-form-modal-wrap .modal-default .modal-dialog.shopgrade-add-modal .shopgrade-type-select-btn:hover {
  border-color: var(--cl-border-hover) !important;
  background: var(--cl-bg-subtle) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-form-modal-wrap .modal-default .modal-dialog.shopgrade-add-modal .shopgrade-type-select.open .shopgrade-type-select-btn,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-form-modal-wrap .modal-default .modal-dialog.shopgrade-add-modal .shopgrade-type-select:focus-visible .shopgrade-type-select-btn {
  border-color: var(--cl-green-action, #03c75a) !important;
  background: var(--cl-surface, #fff) !important;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .13) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-form-modal-wrap .modal-default .modal-dialog.shopgrade-add-modal .shopgrade-type-select.open .shopgrade-type-select-btn::after {
  background-color: var(--cl-green-action, #03c75a) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-form-modal-wrap .modal-default .modal-dialog.shopgrade-add-modal .shopgrade-type-select-menu {
  padding: 4px !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  background: var(--cl-surface, #fff) !important;
  box-shadow: 0 14px 40px rgba(20, 24, 32, .2) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-form-modal-wrap .modal-default .modal-dialog.shopgrade-add-modal .shopgrade-type-select-option {
  border-radius: 6px !important;
  background: transparent !important;
  color: var(--cl-text-sub) !important;
  font-family: inherit !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-form-modal-wrap .modal-default .modal-dialog.shopgrade-add-modal .shopgrade-type-select-option:hover {
  background: var(--cl-green-tint) !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-form-modal-wrap .modal-default .modal-dialog.shopgrade-add-modal .shopgrade-type-select-option.selected {
  background: var(--cl-green-soft) !important;
  color: var(--cl-green-text) !important;
  box-shadow: inset 0 0 0 1px var(--cl-green-line) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-form-modal-wrap .modal-default .modal-dialog.shopgrade-add-modal .grade-create-table .toggle-switch {
  display: flex !important;
  align-items: center !important;
  width: 36px !important;
  min-width: 36px !important;
  height: 20px !important;
  min-height: 20px !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-form-modal-wrap .modal-default .modal-dialog.shopgrade-add-modal .grade-create-table :is(.auto-grade-row, .discount-benefit-form-row, .reserve-benefit-form-row) > td:not(.form-title) > .toggle-switch {
  display: flex !important;
  align-items: center !important;
  width: 36px !important;
  min-width: 36px !important;
  height: 36px !important;
  min-height: 36px !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-form-modal-wrap .modal-default .modal-dialog.shopgrade-add-modal .grade-create-table .simple-switch {
  position: relative !important;
  display: inline-block !important;
  flex: none !important;
  width: 36px !important;
  min-width: 36px !important;
  height: 20px !important;
  min-height: 20px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 999px !important;
  line-height: 0 !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-form-modal-wrap .modal-default .modal-dialog.shopgrade-add-modal .grade-create-table .simple-switch-input {
  position: absolute !important;
  inset: 0 !important;
  z-index: 2 !important;
  width: 36px !important;
  height: 20px !important;
  margin: 0 !important;
  padding: 0 !important;
  opacity: 0 !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-form-modal-wrap .modal-default .modal-dialog.shopgrade-add-modal .grade-create-table .simple-switch-label {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 36px !important;
  height: 20px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: var(--cl-border-hover, #d5d9e0) !important;
  border: 0 !important;
  border-radius: 999px !important;
  box-shadow: none !important;
  transition: background var(--cl-motion-move, .18s) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-form-modal-wrap .modal-default .modal-dialog.shopgrade-add-modal .grade-create-table .simple-switch-label::before,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-form-modal-wrap .modal-default .modal-dialog.shopgrade-add-modal .grade-create-table .simple-switch-label::after {
  display: none !important;
  content: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-form-modal-wrap .modal-default .modal-dialog.shopgrade-add-modal .grade-create-table .simple-switch-handle {
  position: absolute !important;
  top: 3px !important;
  left: 3px !important;
  right: auto !important;
  bottom: auto !important;
  z-index: 1 !important;
  display: block !important;
  width: 14px !important;
  height: 14px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #fff !important;
  border: 0 !important;
  border-radius: 50% !important;
  box-shadow: 0 1px 3px rgba(20, 24, 32, .2) !important;
  transform: translateX(0) !important;
  transition: transform var(--cl-motion-move, .18s) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-form-modal-wrap .modal-default .modal-dialog.shopgrade-add-modal .grade-create-table .simple-switch-input:checked ~ .simple-switch-label {
  background: var(--cl-green-action, #03c75a) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-form-modal-wrap .modal-default .modal-dialog.shopgrade-add-modal .grade-create-table .simple-switch-input:checked ~ .simple-switch-handle {
  left: 3px !important;
  transform: translateX(16px) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-form-modal-wrap .modal-default .modal-dialog.shopgrade-add-modal .grade-create-table .simple-switch-input:focus-visible ~ .simple-switch-label {
  outline: 2px solid var(--cl-green-action, #03c75a) !important;
  outline-offset: 2px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-form-modal-wrap .modal-default .modal-dialog.shopgrade-add-modal .grade-create-table .simple-switch.shopgrade-auto-policy-disabled {
  opacity: .5 !important;
  cursor: not-allowed !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-form-modal-wrap .modal-default .modal-dialog.shopgrade-add-modal .modal-footer {
  box-sizing: border-box !important;
  flex: 0 0 auto !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 28px 40px 28px !important;
  border: 0 !important;
}

@media (max-width: 640px) {
  body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-form-modal-wrap .modal-default .modal-dialog.shopgrade-add-modal > .modal-content > .modal-title {
    padding: 40px 52px 24px !important;
    font-size: 18px !important;
    line-height: 26px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-form-modal-wrap .modal-default .modal-dialog.shopgrade-add-modal .modal-body {
    padding-right: 20px !important;
    padding-left: 20px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-form-modal-wrap .modal-default .modal-dialog.shopgrade-add-modal .modal-footer {
    padding: 24px 20px !important;
  }
}

/* Shopping grade auto-adjust policy modal */
@layer cl-member-modal-chrome {
  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-member-workflow-wrap.cl-source-shopgrade-setting-modal-wrap.shopgrade-auto-policy-parent-covered {
    pointer-events: none !important;
    background: transparent !important;
  }
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap {
  background: rgba(0, 0, 0, .45) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap > .modal-default {
  align-items: center !important;
  justify-content: center !important;
  padding: 24px 16px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap .modal-default .modal-dialog.shopgrade-auto-policy-modal .modal-content {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: calc(100vh - 48px) !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 14px !important;
  background: var(--cl-surface, #fff) !important;
  box-shadow: 0 24px 64px rgba(20, 24, 32, .25) !important;
  color: var(--cl-text) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap .modal-default .modal-dialog.shopgrade-auto-policy-modal .modal-body {
  flex: 1 1 auto !important;
  box-sizing: border-box !important;
  padding: 0 40px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap .modal-default .modal-dialog.shopgrade-auto-policy-modal .modal-title {
  display: block !important;
  box-sizing: border-box !important;
  flex: 0 0 auto !important;
  width: 100% !important;
  min-width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 32px 64px 28px !important;
  color: var(--cl-text) !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  line-height: 28px !important;
  letter-spacing: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap .modal-default .modal-dialog.shopgrade-auto-policy-modal .modal-content > button.close {
  top: 16px !important;
  right: 18px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap .modal-default .modal-dialog.shopgrade-auto-policy-modal :is(.modal-body, .modal-footer, #auto-adjust-form, .mng-modal-body, .grade-create-table, .grade-create-table tbody, .grade-create-table tr, .grade-create-table td) {
  background: transparent !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap .modal-default .modal-dialog.shopgrade-auto-policy-modal :is(.modal-body, .modal-footer) {
  background: var(--cl-surface, #fff) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap .modal-default .modal-dialog.shopgrade-auto-policy-modal :is(#auto-adjust-form, .mng-modal-body, .grade-create-table) {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap .modal-default .modal-dialog.shopgrade-auto-policy-modal .grade-create-table tr {
  display: grid !important;
  grid-template-columns: 120px minmax(0, 1fr) !important;
  width: 100% !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap .modal-default .modal-dialog.shopgrade-auto-policy-modal .grade-create-table tr:last-child {
  height: auto !important;
  min-height: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap .modal-default .modal-dialog.shopgrade-auto-policy-modal .grade-create-table td:not(.form-title),
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap .modal-default .modal-dialog.shopgrade-auto-policy-modal .policy-preview,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap .modal-default .modal-dialog.shopgrade-auto-policy-modal .grade-changeex {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap .modal-default .modal-dialog.shopgrade-auto-policy-modal .policy-preview {
  min-height: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap .modal-default .modal-dialog.shopgrade-auto-policy-modal .grade-create-table .form-title {
  color: var(--cl-text-sub) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap .modal-default .modal-dialog.shopgrade-auto-policy-modal .grade-create-table .form-title .config-tooltip > svg.sg-grade-use.shopgrade-auto-policy-help,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap .modal-default .modal-dialog.shopgrade-auto-policy-modal .grade-create-table .form-title .config-tooltip > svg.sg-grade-use.shopgrade-auto-policy-help:is(:hover, :focus, :active) {
  color: var(--cl-green) !important;
  fill: var(--cl-green) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap .modal-default .modal-dialog.shopgrade-auto-policy-modal .cycle_type {
  display: flex !important;
  align-items: center !important;
  gap: 22px !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap .modal-default .modal-dialog.shopgrade-auto-policy-modal .cycle_type .shopgrade-auto-policy-radio {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 18px !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 18px !important;
  white-space: nowrap !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap .modal-default .modal-dialog.shopgrade-auto-policy-modal .cycle_type .shopgrade-auto-policy-radio > input[type="radio"] {
  position: absolute !important;
  inset: 0 auto auto 0 !important;
  display: block !important;
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
  opacity: 0 !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap .modal-default .modal-dialog.shopgrade-auto-policy-modal .shopgrade-auto-policy-radio-ui {
  position: relative !important;
  display: inline-flex !important;
  box-sizing: border-box !important;
  flex: 0 0 18px !important;
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
  border: 2px solid #c9cdd4 !important;
  border-radius: 50% !important;
  background: #fff !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap .modal-default .modal-dialog.shopgrade-auto-policy-modal .shopgrade-auto-policy-radio-ui::after {
  content: "" !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  display: block !important;
  width: 8px !important;
  height: 8px !important;
  border-radius: 50% !important;
  background: var(--cl-green) !important;
  opacity: 0 !important;
  transform: translate(-50%, -50%) scale(.6) !important;
  transition: opacity .12s, transform .12s !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap .modal-default .modal-dialog.shopgrade-auto-policy-modal .shopgrade-auto-policy-radio > input[type="radio"]:checked + .shopgrade-auto-policy-radio-ui {
  border-color: var(--cl-green) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap .modal-default .modal-dialog.shopgrade-auto-policy-modal .shopgrade-auto-policy-radio > input[type="radio"]:checked + .shopgrade-auto-policy-radio-ui::after {
  opacity: 1 !important;
  transform: translate(-50%, -50%) scale(1) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap .modal-default .modal-dialog.shopgrade-auto-policy-modal .shopgrade-auto-policy-radio > input[type="radio"]:focus-visible + .shopgrade-auto-policy-radio-ui {
  border-color: var(--cl-green) !important;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .13) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap .modal-default .modal-dialog.shopgrade-auto-policy-modal .shopgrade-auto-policy-radio-text {
  color: var(--cl-text) !important;
  font: inherit !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap .modal-default .modal-dialog.shopgrade-auto-policy-modal .auto-policy-month-select,
body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap .modal-default .modal-dialog.shopgrade-auto-policy-modal .auto-policy-month-select-btn {
  width: 115px !important;
  min-width: 115px !important;
  max-width: 115px !important;
  height: 40px !important;
  min-height: 40px !important;
  max-height: 40px !important;
  border-radius: 8px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap .modal-default .modal-dialog.shopgrade-auto-policy-modal .auto-policy-month-select-btn {
  padding: 0 28px 0 12px !important;
  border: 1px solid var(--cl-border) !important;
  background: #fff !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  line-height: 38px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap .modal-default .modal-dialog.shopgrade-auto-policy-modal .auto-policy-month-select-btn::after {
  right: 10px !important;
  width: 12px !important;
  height: 12px !important;
  background-color: var(--cl-text-sub) !important;
  transition: transform .18s cubic-bezier(.4,0,.2,1), background .12s !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap .modal-default .modal-dialog.shopgrade-auto-policy-modal .auto-policy-month-select-btn:hover {
  border-color: var(--cl-border-hover) !important;
  background: var(--cl-bg-2, #fafbfc) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap .modal-default .modal-dialog.shopgrade-auto-policy-modal .auto-policy-month-select.open .auto-policy-month-select-btn {
  border-color: var(--cl-green) !important;
  background: #fff !important;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .13) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap .modal-default .modal-dialog.shopgrade-auto-policy-modal .auto-policy-month-select.open .auto-policy-month-select-btn::after {
  background-color: var(--cl-green) !important;
  transform: rotate(180deg) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap .modal-default .modal-dialog.shopgrade-auto-policy-modal .auto-policy-month-select-menu,
body.cl-dashboard-redesign-page > .auto-policy-month-select-floating-menu {
  padding: 4px !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  background: #fff !important;
  box-shadow: 0 14px 40px rgba(20, 24, 32, .2) !important;
}

body.cl-dashboard-redesign-page > .auto-policy-month-select-floating-menu {
  z-index: 1000001;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap .modal-default .modal-dialog.shopgrade-auto-policy-modal .auto-policy-month-select-option,
body.cl-dashboard-redesign-page > .auto-policy-month-select-floating-menu .auto-policy-month-select-option {
  height: 34px !important;
  padding: 0 8px !important;
  border-radius: 6px !important;
  background: #fff !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  line-height: 34px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap .modal-default .modal-dialog.shopgrade-auto-policy-modal .auto-policy-month-select-option:hover,
body.cl-dashboard-redesign-page > .auto-policy-month-select-floating-menu .auto-policy-month-select-option:hover {
  background: var(--cl-green-tint) !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap .modal-default .modal-dialog.shopgrade-auto-policy-modal .auto-policy-month-select-option.selected,
body.cl-dashboard-redesign-page > .auto-policy-month-select-floating-menu .auto-policy-month-select-option.selected {
  background: var(--cl-green-soft) !important;
  color: var(--cl-green-text) !important;
  box-shadow: inset 0 0 0 1px var(--cl-green-line) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap .modal-default .modal-dialog.shopgrade-auto-policy-modal :is(.grade-changeex span, .policy-date-text) {
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap .modal-default .modal-dialog.shopgrade-auto-policy-modal #auto-adjust-form .grade-changeex .policy-date-text {
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap .modal-default .modal-dialog.shopgrade-auto-policy-modal .modal-footer {
  box-sizing: border-box !important;
  width: 100% !important;
  margin-top: 20px !important;
  padding: 0 40px 28px !important;
  background: var(--cl-surface, #fff) !important;
}

body.cl-dashboard-redesign-page > .tooltip.cl-shopgrade-auto-policy-tooltip {
  box-sizing: border-box !important;
  width: max-content !important;
  min-width: 0 !important;
  max-width: min(300px, calc(100vw - 32px)) !important;
  margin: 0 !important;
  padding: 0 !important;
  opacity: 1 !important;
  font-family: var(--cl-source-font) !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page > .tooltip.cl-shopgrade-auto-policy-tooltip .tooltip-inner {
  box-sizing: border-box !important;
  width: max-content !important;
  min-width: 0 !important;
  max-width: min(300px, calc(100vw - 32px)) !important;
  margin: 0 !important;
  padding: 12px 14px !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 10px !important;
  background: var(--cl-surface, #fff) !important;
  box-shadow: 0 8px 24px rgba(20, 24, 32, .14) !important;
  color: var(--cl-text-sub) !important;
  font-family: inherit !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  line-height: 1.55 !important;
  letter-spacing: 0 !important;
  text-align: left !important;
  white-space: normal !important;
  word-break: keep-all !important;
}

body.cl-dashboard-redesign-page > .tooltip.cl-shopgrade-auto-policy-tooltip .tooltip-inner ul {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

body.cl-dashboard-redesign-page > .tooltip.cl-shopgrade-auto-policy-tooltip .tooltip-inner ul ul {
  margin-top: 6px !important;
}

body.cl-dashboard-redesign-page > .tooltip.cl-shopgrade-auto-policy-tooltip .tooltip-inner li {
  position: relative !important;
  margin: 0 0 6px !important;
  padding: 0 0 0 11px !important;
  list-style: none !important;
  color: var(--cl-text-sub) !important;
  font: inherit !important;
}

body.cl-dashboard-redesign-page > .tooltip.cl-shopgrade-auto-policy-tooltip .tooltip-inner li:last-child {
  margin-bottom: 0 !important;
}

body.cl-dashboard-redesign-page > .tooltip.cl-shopgrade-auto-policy-tooltip .tooltip-inner li::before {
  content: "" !important;
  position: absolute !important;
  top: 8px !important;
  left: 0 !important;
  width: 3px !important;
  height: 3px !important;
  border-radius: 50% !important;
  background: #b9bfc7 !important;
}

body.cl-dashboard-redesign-page > .tooltip.cl-shopgrade-auto-policy-tooltip.right .tooltip-arrow {
  border-right-color: var(--cl-border) !important;
}

body.cl-dashboard-redesign-page > .tooltip.cl-shopgrade-auto-policy-tooltip.right .tooltip-arrow::after {
  content: "" !important;
  position: absolute !important;
  top: -4px !important;
  left: 1px !important;
  width: 0 !important;
  height: 0 !important;
  border-width: 4px 5px 4px 0 !important;
  border-style: solid !important;
  border-color: transparent var(--cl-surface, #fff) transparent transparent !important;
}

@media (max-width: 600px) {
  body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap .modal-default .modal-dialog.shopgrade-auto-policy-modal .modal-body {
    padding: 0 24px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap .modal-default .modal-dialog.shopgrade-auto-policy-modal .modal-title {
    margin: 0 !important;
    padding: 24px 52px !important;
    font-size: 18px !important;
    line-height: 26px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap .modal-default .modal-dialog.shopgrade-auto-policy-modal .modal-footer {
    padding: 0 24px 20px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap .modal-default .modal-dialog.shopgrade-auto-policy-modal .grade-create-table tr {
    display: block !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap .modal-default .modal-dialog.shopgrade-auto-policy-modal :is(.mng-modal-body, .grade-create-table, .grade-create-table tbody) {
    display: block !important;
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap .modal-default .modal-dialog.shopgrade-auto-policy-modal .grade-create-table {
    table-layout: fixed !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap .modal-default .modal-dialog.shopgrade-auto-policy-modal .grade-create-table :is(tr, td, .form-inline, .policy-preview, .shopgrade-auto-policy-preview-text) {
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-shopgrade-auto-policy-modal-wrap .modal-default .modal-dialog.shopgrade-auto-policy-modal .cycle_type {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 12px !important;
  }
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-source-member-info-modal) {
  position: fixed !important;
  inset: 0 !important;
  z-index: 999999 !important;
  display: block !important;
  width: 100vw !important;
  height: 100vh !important;
  min-height: 100vh !important;
  padding: 0 !important;
  background: transparent !important;
  overflow: hidden !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-source-member-info-modal) + .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-source-member-info-modal) + .modal-backdrop.fade,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-source-member-info-modal) + .modal-backdrop.in,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-source-member-info-modal) + .modal-backdrop.fade.in {
  display: none !important;
  opacity: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default:has(.modal-dialog.cl-source-member-info-modal),
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default.in:has(.modal-dialog.cl-source-member-info-modal),
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default.show:has(.modal-dialog.cl-source-member-info-modal) {
  position: fixed !important;
  inset: 0 !important;
  z-index: 999999 !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
  width: 100vw !important;
  height: 100vh !important;
  min-height: 100vh !important;
  margin: 0 !important;
  padding: 6vh 16px !important;
  background: rgba(20, 24, 32, .45) !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default:has(.modal-dialog.cl-source-member-info-modal) > .cl-mobile-btn.close {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  width: 480px !important;
  max-width: calc(100vw - 32px) !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 auto !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .modal-content {
  position: relative !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 28px 32px 24px !important;
  overflow: visible !important;
  background: #fff !important;
  border: 0 !important;
  border-radius: 16px !important;
  box-shadow: 0 20px 50px rgba(20, 24, 32, .25) !important;
  color: var(--cl-text) !important;
  font-family: var(--cl-source-font) !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .modal-body,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .modal-footer {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .modal-title {
  margin: 0 36px 24px !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-size: 19px !important;
  font-weight: 800 !important;
  line-height: 26px !important;
  letter-spacing: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .modal-content > .close.close-button-dialog {
  position: absolute !important;
  top: 16px !important;
  right: 16px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  min-height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text-muted) !important;
  opacity: 1 !important;
  outline: 0 !important;
  text-shadow: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .modal-content > .close.close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .modal-content > .close.close-button-dialog:focus {
  background: #f1f2f5 !important;
  color: var(--cl-text) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .modal-content > .close.close-button-dialog svg {
  display: block !important;
  width: 9px !important;
  height: 9px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .mng-modal-body.info-modal,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .mng-modal-body.info-modal .form-horizontal {
  display: block !important;
  float: none !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .mng-modal-body.info-modal .form-group {
  position: relative !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: flex-start !important;
  gap: 0 18px !important;
  float: none !important;
  width: 100% !important;
  margin: 0 0 16px !important;
  padding: 0 !important;
  border: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .mng-modal-body.info-modal[data-list-type="member-list"] .form-group::before,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .mng-modal-body.info-modal[data-list-type="member-list"] .form-group::after {
  display: none;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .mng-modal-body.info-modal .form-group:last-child {
  margin-bottom: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .mng-modal-body.info-modal .form-group .control-label {
  position: relative !important;
  display: block !important;
  flex: 0 0 92px !important;
  float: none !important;
  width: 92px !important;
  max-width: 92px !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 10px 0 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  text-align: left !important;
  white-space: nowrap !important;
  word-break: keep-all !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .mng-modal-body.info-modal .form-group .control-label.cl-etc-list-type {
  padding-top: 2px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .mng-modal-body.info-modal[data-list-type="member-list"] .form-group .control-label {
  color: var(--cl-text) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .mng-modal-body.info-modal .form-group > .memW-info-wrap {
  display: flex !important;
  flex: 1 1 0 !important;
  flex-direction: column !important;
  float: none !important;
  width: auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .memW-info-wrap > span {
  display: block !important;
  min-height: 20px !important;
  padding-top: 9px !important;
  color: var(--cl-text) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  word-break: break-word !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .memW-info-wrap > span#member-id,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .memW-info-wrap > span[id="member-id"] {
  color: var(--cl-green-text) !important;
  font-weight: 600 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .mng-modal-body.info-modal[data-list-type="member-waitlist"] .form-group {
  min-height: 0 !important;
  margin: 0 0 16px !important;
  padding: 0 !important;
  border: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .mng-modal-body.info-modal[data-list-type="member-waitlist"] .form-group .control-label {
  flex: 0 0 92px !important;
  width: 92px !important;
  max-width: 92px !important;
  margin: 0 !important;
  padding: 10px 0 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .mng-modal-body.info-modal[data-list-type="member-waitlist"] .form-group > .memW-info-wrap {
  flex: 1 1 0 !important;
  width: auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .mng-modal-body.info-modal[data-list-type="member-waitlist"] .memW-info-wrap > span {
  display: block !important;
  width: 100% !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 9px 12px !important;
  background-color: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: var(--cl-radius-sm) !important;
  box-shadow: none !important;
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  word-break: break-word !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .mng-modal-body.info-modal[data-list-type="member-waitlist"] .memW-info-wrap > span#member-id,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .mng-modal-body.info-modal[data-list-type="member-waitlist"] .memW-info-wrap > span[id="member-id"] {
  background-color: #f7f8fa !important;
  color: var(--cl-text-sub) !important;
  font-weight: 400 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .cl-common-form-wrap,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .cl-common-form-group {
  display: block !important;
  float: none !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .memW-info-wrap > .cl-common-form-wrap + .cl-common-form-wrap,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .memW-info-wrap > .cl-s-form-wrap + .cl-common-form-wrap {
  margin-top: 8px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal input.form-control:not(.cl-common-form-radio-hide),
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal select.form-control,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal textarea.form-control,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .member-info-input {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  height: 40px !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 9px 12px !important;
  background-color: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: var(--cl-radius-sm) !important;
  box-shadow: none !important;
  color: var(--cl-text) !important;
  font-family: var(--cl-source-font) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  outline: 0 !important;
  box-sizing: border-box !important;
  transition: border-color var(--cl-motion-fast), background var(--cl-motion-fast), box-shadow var(--cl-motion-fast) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal input.form-control:not(.cl-common-form-radio-hide):hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal select.form-control:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal textarea.form-control:hover {
  border-color: #d5d9e0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal input.form-control:not(.cl-common-form-radio-hide):focus,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal select.form-control:focus,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal textarea.form-control:focus {
  border-color: var(--cl-green) !important;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .13) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal input.form-control:not(.cl-common-form-radio-hide)[disabled],
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal select.form-control[disabled],
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal textarea.form-control[readonly],
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .cl-common-form-group.disabled input.form-control {
  background-color: #f7f8fa !important;
  color: var(--cl-text-sub) !important;
  cursor: not-allowed !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal #member-addr1[readonly] {
  background-color: #fff !important;
  cursor: pointer !important;
  pointer-events: auto !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal select.form-control {
  padding-right: 34px !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 4' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%238A8F98' d='m0 0 4 4 4-4z'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 12px center !important;
  background-size: 8px 4px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal select.form-control + svg {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal textarea.form-control {
  height: auto !important;
  min-height: 70px !important;
  max-height: 150px !important;
  resize: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal #member-memo + label {
  display: block !important;
  float: none !important;
  width: 100% !important;
  margin: 4px 0 0 !important;
  padding: 0 !important;
  color: var(--cl-text-muted) !important;
  font-size: 11.5px !important;
  font-weight: 400 !important;
  line-height: 16px !important;
  text-align: right !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .cl-etc-jcoltype.newcheckbox {
  display: block !important;
  width: 100% !important;
  margin: 0 0 8px !important;
  padding: 0 !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .cl-etc-jcoltype.newcheckbox:last-child {
  margin-bottom: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .cl-etc-jcoltype.newcheckbox label {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  width: auto !important;
  min-height: 22px !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .newcheckboxSvg,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .newcheckboxSvgRadio {
  position: relative !important;
  display: inline-flex !important;
  flex: 0 0 18px !important;
  align-items: center !important;
  justify-content: center !important;
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .newcheckboxSvg input,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .newcheckboxSvgRadio input {
  position: absolute !important;
  inset: 0 !important;
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
  opacity: 0 !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .newcheckboxSvg svg,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .newcheckboxSvgRadio svg {
  display: block !important;
  width: 18px !important;
  height: 18px !important;
  fill: #d7dce3 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .newcheckboxSvg svg.active,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .newcheckboxSvgRadio svg.active {
  display: none !important;
  fill: var(--cl-green) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .newcheckboxSvg input:checked ~ svg,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .newcheckboxSvgRadio input:checked ~ svg {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .newcheckboxSvg input:checked ~ svg.active,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .newcheckboxSvgRadio input:checked ~ svg.active {
  display: block !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .newcheckbox label > span {
  display: inline-block !important;
  min-width: 0 !important;
  color: inherit !important;
  line-height: 20px !important;
  word-break: break-word !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .btn-load-addresses.adm-member-addr:not(.hide) {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  height: 34px !important;
  margin: 0 0 8px !important;
  padding: 0 12px !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: var(--cl-radius-sm) !important;
  background: #fff !important;
  color: var(--cl-text-sub) !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .btn-load-addresses.adm-member-addr.hide,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .btn-load-addresses.adm-member-addr ~ .cl-common-form-wrap {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .btn-load-addresses.adm-member-addr .cl-s-form-group,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .btn-load-addresses.adm-member-addr span {
  display: inline-flex !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  color: inherit !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .sm-parent {
  margin-top: 10px !important;
  padding: 12px !important;
  background: #f7f8fa !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: var(--cl-radius-sm) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .sm-parent > .cl-s-form-wrap,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .sm-parent > .cl-s-form-wrap > .cl-s-form-group {
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .sm-parent.emptyFlag {
  height: 40px !important;
  margin: 0 !important;
  padding: 9px 12px !important;
  box-sizing: border-box !important;
  cursor: not-allowed;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .sm-parent.emptyFlag .cl-s-form-control:not(.noaddress),
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .sm-parent:not(.emptyFlag) .noaddress {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .sm-parent .cl-s-form-control {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 4px !important;
  width: 100% !important;
  margin: 0 0 6px !important;
  padding: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 12.5px !important;
  line-height: 18px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .sm-parent .cl-s-form-control:last-child {
  margin-bottom: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .sm-parent.emptyFlag .noaddress {
  min-height: 0 !important;
  height: auto !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .sm-parent .sm-name {
  color: var(--cl-text) !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .sm-parent .sm-default-addr span {
  display: inline-flex !important;
  align-items: center !important;
  height: 18px !important;
  padding: 0 6px !important;
  background: var(--cl-green-soft) !important;
  border-radius: 4px !important;
  color: var(--cl-green-text) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .fupload-cell {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  width: 100% !important;
  min-width: 0 !important;
  padding-top: 8px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .fupload-cell .file-name {
  overflow: hidden !important;
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  line-height: 20px !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .fupload-cell .file-download-btn {
  display: inline-flex !important;
  flex: 0 0 28px !important;
  align-items: center !important;
  justify-content: center !important;
  width: 28px !important;
  height: 28px !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: var(--cl-radius-sm) !important;
  color: var(--cl-text-sub) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .mng-modal-body.info-modal .form-group .mng-error {
  display: flex !important;
  flex: 0 0 calc(100% - 110px) !important;
  align-items: flex-start !important;
  gap: 6px !important;
  float: none !important;
  width: auto !important;
  margin: 5px 0 0 110px !important;
  padding: 0 !important;
  color: var(--cl-danger) !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 18px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .mng-error .error-icon {
  flex: 0 0 13px !important;
  width: 13px !important;
  height: 13px !important;
  margin: 2px 0 0 !important;
  fill: currentColor !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .modal-footer {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  margin-top: 22px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .modal-footer .ok-button-dialog,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .modal-footer .ok-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .modal-footer .ok-button-dialog:focus {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: none !important;
  height: 46px !important;
  min-height: 46px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  background: var(--cl-green) !important;
  border: 1px solid var(--cl-green) !important;
  border-radius: 10px !important;
  box-shadow: none !important;
  color: #fff !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .modal-footer .ok-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .modal-footer .ok-button-dialog:focus {
  background: var(--cl-green-hover) !important;
  border-color: var(--cl-green-hover) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .modal-footer .close-button-dialog,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .modal-footer .cancel-button-dialog {
  border-radius: 10px !important;
}

@media (min-width: 768px) and (max-width: 991px) {
  body.cl-dashboard-redesign-page #cl-member-list-page .member-list-setting-box {
    padding: 0 !important;
  }

  body.cl-dashboard-redesign-page #cl-member-list-page .mng-settings.memberlist {
    padding: 24px !important;
  }
}

@media (max-width: 900px) {
  :is(#cl-member-list-page, #cl-member-leavelist-page) {
    margin-right: 0;
    margin-left: 0;
  }
}

@media (max-width: 640px) {
  :is(#cl-member-list-page, #cl-member-leavelist-page) {
    padding: 20px 14px 40px;
  }

  :is(#cl-member-list-page, #cl-member-leavelist-page) .mng-settings.memberlist {
    padding: 18px 14px;
  }

  :is(#cl-member-list-page, #cl-member-leavelist-page) .cl-source-member-toolbar {
    align-items: stretch;
  }

  :is(#cl-member-list-page, #cl-member-leavelist-page) .mng-title,
  :is(#cl-member-list-page, #cl-member-leavelist-page) .mng-search-box,
  :is(#cl-member-list-page, #cl-member-leavelist-page) .mng-subMenu-list,
  :is(#cl-member-list-page, #cl-member-leavelist-page) .mng-selectboxlist {
    width: 100%;
    flex-basis: 100%;
    margin-left: 0;
  }

  :is(#cl-member-list-page, #cl-member-leavelist-page) .mng-selectboxlist,
  :is(#cl-member-list-page, #cl-member-leavelist-page) .mng-subMenu-list {
    flex-wrap: wrap;
  }

  #cl-member-list-page .mng-selectboxlist {
    width: auto;
    flex: 0 0 auto;
  }

  #cl-member-list-page .mng-sortWrap {
    flex: none;
    margin-left: auto;
  }

  /* 필터 버튼이 줄바꿈되어도 팝업의 기준 폭은 도구 영역 전체로 유지한다. */
  body.cl-dashboard-redesign-page :is(#cl-member-list-page, #cl-member-leavelist-page) .mng-subMenu-list {
    position: relative;
  }

  body.cl-dashboard-redesign-page :is(#cl-member-list-page, #cl-member-leavelist-page) :is(.mng-sortWrap, .mng-shopgradeWrap) {
    position: static;
  }

  body.cl-dashboard-redesign-page :is(#cl-member-list-page, #cl-member-leavelist-page) :is(.mng-sortlistWrap, .mng-sortshoplistWrap) {
    right: auto;
    left: 0;
    max-width: 100%;
  }

  :is(#cl-member-list-page, #cl-member-leavelist-page) .btn-wrap {
    flex-wrap: wrap;
  }

  :is(#cl-member-list-page, #cl-member-leavelist-page) .mng-bottom-btn-wrap {
    width: 100%;
    margin-left: 0;
  }

  #cl-member-list-page .mng-bottom-btn-wrap {
    width: auto;
    margin-left: auto;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default:has(.modal-dialog.cl-source-member-info-modal),
  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default.in:has(.modal-dialog.cl-source-member-info-modal),
  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default.show:has(.modal-dialog.cl-source-member-info-modal) {
    padding: 20px 14px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal {
    width: 100% !important;
    max-width: calc(100vw - 28px) !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .modal-content {
    padding: 24px 22px 20px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .modal-title {
    margin-bottom: 22px !important;
    font-size: 18px !important;
    line-height: 25px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .mng-modal-body.info-modal .form-group {
    flex-direction: column !important;
    gap: 7px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .mng-modal-body.info-modal .form-group .control-label {
    flex: none !important;
    width: 100% !important;
    max-width: none !important;
    padding-top: 0 !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .mng-modal-body.info-modal .form-group > .memW-info-wrap {
    width: 100% !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-member-info-modal .mng-modal-body.info-modal .form-group .mng-error {
    flex: none !important;
    width: 100% !important;
    margin-left: 0 !important;
  }
}

/* Source member signup request page */
#cl-member-waitlist-page {
  width: auto;
  max-width: none;
  margin-top: 0;
  margin-right: var(--cl-source-app-gutter);
  margin-left: calc(var(--cl-source-app-gutter) + var(--cl-source-sidebar-w));
  padding: 28px 32px 60px;
  background: transparent;
  color: var(--cl-text);
}

#cl-member-waitlist-page,
#cl-member-waitlist-page * {
  box-sizing: border-box;
}

#cl-member-waitlist-page > .dashbottom-container,
#cl-member-waitlist-page .mng-body,
#cl-member-waitlist-page .setting-box,
#cl-member-waitlist-page .setting-sub-box,
#cl-member-waitlist-page .mng-wrap {
  float: none;
  width: 100%;
  max-width: none;
  min-height: 0;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

#cl-member-waitlist-page .row {
  margin-right: 0;
  margin-left: 0;
}

#cl-member-waitlist-page #section-top-menu,
#cl-member-waitlist-page .mobile-title,
#cl-member-waitlist-page .submenu_navWrap {
  display: none;
}

#cl-member-waitlist-page .cl-source-member-breadcrumb {
  display: block;
  width: 760px;
  max-width: 100%;
  margin: 0 0 26px;
  padding: 0;
  color: var(--cl-text);
  font-size: 0;
  line-height: 28px;
}

#cl-member-waitlist-page .cl-source-member-breadcrumb .bc-link,
#cl-member-waitlist-page .cl-source-member-breadcrumb .current {
  display: inline-block;
  color: var(--cl-text);
  font-size: 20px;
  font-weight: 700;
  line-height: 24px;
  vertical-align: middle;
}

#cl-member-waitlist-page .cl-source-member-breadcrumb .current {
  color: var(--cl-text-sub);
}

#cl-member-waitlist-page .cl-source-member-breadcrumb .sep {
  display: inline-block;
  margin: 0 8px;
  color: var(--cl-text-muted);
  font-size: 23px;
  font-weight: 400;
  line-height: 24px;
  vertical-align: middle;
}

#cl-member-waitlist-page .cl-source-member-breadcrumb p {
  display: block;
  margin: 11px 0 0;
  padding: 0;
  color: var(--cl-text-sub);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 20px;
}

#cl-member-waitlist-page .cl-source-waitlist-panel {
  float: none;
  width: 950px;
  max-width: 100%;
  min-height: 0;
  margin: 0;
  padding: 22px 24px;
  overflow: visible;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 14px;
  box-shadow: var(--cl-shadow-panel);
}

#cl-member-waitlist-page .mng-title {
  float: none;
  width: 100%;
  margin: 0 0 16px;
  padding: 0;
  color: var(--cl-text);
  font-size: 15px;
  font-weight: 700;
  line-height: 20px;
}

#cl-member-waitlist-page .mng-title .wait-count {
  margin: 0;
  color: var(--cl-green-text);
  font-size: inherit;
  font-weight: 700;
}

#cl-member-waitlist-page .table-wrap,
#cl-member-waitlist-page .table-container {
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0;
  overflow-x: auto;
  border: 0;
  box-shadow: none;
}

#cl-member-waitlist-page .cl-source-waitlist-table {
  width: 100%;
  min-width: 880px;
  margin: 0;
  table-layout: fixed;
  border-collapse: collapse;
  border-spacing: 0;
  background: #fff;
  border: 0;
  color: var(--cl-text);
  font-size: 13.5px;
}

#cl-member-waitlist-page .cl-source-waitlist-table th,
#cl-member-waitlist-page .cl-source-waitlist-table td {
  height: auto;
  padding: 13px 8px;
  background: transparent;
  border-top: 0;
  border-right: 0;
  border-bottom: 1px solid var(--cl-border);
  border-left: 0;
  color: var(--cl-text);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 20px;
  text-align: center;
  vertical-align: middle;
  white-space: nowrap;
}

#cl-member-waitlist-page .cl-source-waitlist-table th {
  padding: 12px 8px;
  background: #fafbfc;
  border-top: 1px solid var(--cl-border);
  color: var(--cl-text-sub);
  font-size: 12.5px;
  font-weight: 600;
  line-height: 18px;
  border-radius: 0;
}

#cl-member-waitlist-page .cl-source-waitlist-table th.no {
  width: 54px !important;
}

#cl-member-waitlist-page .cl-source-waitlist-table th.id {
  width: 220px !important;
}

#cl-member-waitlist-page .cl-source-waitlist-table th.email {
  width: 230px !important;
}

#cl-member-waitlist-page .cl-source-waitlist-table th.date {
  width: 110px !important;
}

#cl-member-waitlist-page .cl-source-waitlist-table th.detail {
  width: 84px !important;
}

#cl-member-waitlist-page .cl-source-waitlist-table th.approval {
  width: 176px !important;
}

#cl-member-waitlist-page .cl-source-waitlist-table th.date br,
#cl-member-waitlist-page .cl-source-waitlist-table th.detail br {
  display: none !important;
}

#cl-member-waitlist-page .cl-source-waitlist-table td.id {
  overflow: hidden;
  color: var(--cl-green-text);
  font-weight: 600;
  text-overflow: ellipsis;
}

#cl-member-waitlist-page .cl-source-waitlist-table td.email {
  overflow: hidden;
  text-overflow: ellipsis;
}

#cl-member-waitlist-page .cl-source-waitlist-table td.detail {
  padding-right: 8px;
  padding-left: 8px;
}

#cl-member-waitlist-page .member-info {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  margin: 0 auto;
  border-radius: 6px;
  color: var(--cl-text-sub);
  cursor: pointer;
}

#cl-member-waitlist-page .member-info:hover {
  background: var(--cl-green-tint);
  color: var(--cl-green);
}

#cl-member-waitlist-page .member-info svg {
  display: block;
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
}

#cl-member-waitlist-page .cl-source-waitlist-table td.btn-wrap {
  padding: 13px 8px;
}

#cl-member-waitlist-page .cl-source-wait-actions {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
}

#cl-member-waitlist-page .approval-btn,
#cl-member-waitlist-page .deny-btn {
  appearance: none;
  -webkit-appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 52px;
  height: 32px;
  margin: 0;
  padding: 6px 12px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  box-shadow: none;
  color: var(--cl-text-sub);
  font-size: 12.5px;
  font-weight: 600;
  line-height: 18px;
  text-decoration: none;
  cursor: pointer;
}

#cl-member-waitlist-page .approval-btn:hover,
#cl-member-waitlist-page .deny-btn:hover {
  background: #fafbfc;
  border-color: #d5d9e0;
  color: var(--cl-text);
}

#cl-member-waitlist-page .approval-status {
  color: var(--cl-text-sub);
  font-size: 12.5px;
  line-height: 18px;
}

#cl-member-waitlist-page .approval-status span {
  display: block;
}

/* 빈 상태 안내는 가로로 긴 표 밖에서 카드의 표시 폭에 맞춘다. */
body.cl-dashboard-redesign-page :is(#cl-member-waitlist-page, #cl-member-blocklist-page, #cl-member-leavelist-page) .table-container > table.empty > tbody {
  display: none;
}

body.cl-dashboard-redesign-page :is(#cl-member-waitlist-page, #cl-member-blocklist-page, #cl-member-leavelist-page) .cl-source-member-empty {
  display: none;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-width: 0;
  min-height: 300px;
  padding: 40px 16px;
  box-sizing: border-box;
  color: var(--cl-text-muted);
  font-size: 13.5px;
  line-height: 1.5;
  text-align: center;
  white-space: normal;
  overflow-wrap: anywhere;
}

body.cl-dashboard-redesign-page :is(#cl-member-waitlist-page, #cl-member-blocklist-page, #cl-member-leavelist-page) .table-container:has(> table.empty) + .cl-source-member-empty {
  display: flex;
}

#cl-member-waitlist-page .listZero td {
  padding: 60px 0;
  color: var(--cl-text-muted);
  text-align: center;
}

#cl-member-waitlist-page .mng-bottom-description {
  width: 100%;
  margin: 14px 0 0;
  padding: 0;
  color: var(--cl-text-muted);
  font-size: 12px;
  font-weight: 400;
  line-height: 18px;
}

#cl-member-waitlist-page .mng-bottom-description p {
  margin: 0;
}

#cl-member-waitlist-page nav.text-center {
  display: flex;
  justify-content: center;
  width: 100%;
  margin: 22px 0 0;
  padding: 0;
}

#cl-member-waitlist-page .mng-list-pagination {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
}

#cl-member-waitlist-page .mng-list-pagination > li {
  display: inline-flex;
  margin: 0;
  padding: 0;
  border: 0;
}

#cl-member-waitlist-page .mng-list-pagination > li > a,
#cl-member-waitlist-page .mng-list-pagination > li > span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 30px;
  height: 30px;
  margin: 0;
  padding: 0 8px;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 6px;
  color: var(--cl-text-sub);
  font-size: 13px;
  font-weight: 400;
  line-height: 1;
  text-decoration: none;
}

#cl-member-waitlist-page .mng-list-pagination > li.active > a,
#cl-member-waitlist-page .mng-list-pagination > li.active > span {
  background: #fcfcfb;
  border-color: var(--cl-green);
  color: var(--cl-green-text);
  font-weight: 700;
}

#cl-member-waitlist-page .mng-list-pagination > li > a:hover {
  background: var(--cl-green-tint);
  color: var(--cl-green-text);
}

#cl-member-waitlist-page .mng-list-pagination .mng-arrow {
  display: block;
  width: 15px;
  height: 15px;
  color: var(--cl-text-muted);
  fill: currentColor;
}

#cl-member-waitlist-page .mng-list-pagination .mng-arrow-double {
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

#cl-member-waitlist-page .mng-list-pagination > li.nonpage > a {
  pointer-events: none;
  color: var(--cl-text-muted);
}

@media (max-width: 900px) {
  #cl-member-waitlist-page {
    margin-right: 0;
    margin-left: 0;
  }
}

@media (max-width: 640px) {
  #cl-member-waitlist-page {
    padding: 20px 14px 40px;
  }

  #cl-member-waitlist-page .cl-source-waitlist-panel {
    padding: 18px 14px;
  }
}

/* Source member block list page */
#cl-member-blocklist-page {
  width: auto;
  max-width: none;
  margin-top: 0;
  margin-right: var(--cl-source-app-gutter);
  margin-left: calc(var(--cl-source-app-gutter) + var(--cl-source-sidebar-w));
  padding: 28px 32px 60px;
  background: transparent;
  color: var(--cl-text);
}

#cl-member-blocklist-page,
#cl-member-blocklist-page * {
  box-sizing: border-box;
}

#cl-member-blocklist-page > .dashbottom-container,
#cl-member-blocklist-page .mng-body,
#cl-member-blocklist-page .setting-box,
#cl-member-blocklist-page .setting-sub-box,
#cl-member-blocklist-page .mng-wrap {
  float: none;
  width: 100%;
  max-width: none;
  min-height: 0;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}

#cl-member-blocklist-page .row {
  margin-right: 0;
  margin-left: 0;
}

#cl-member-blocklist-page #section-top-menu,
#cl-member-blocklist-page .mobile-title,
#cl-member-blocklist-page .submenu_navWrap {
  display: none;
}

#cl-member-blocklist-page .cl-source-member-breadcrumb {
  display: block;
  width: 760px;
  max-width: 100%;
  margin: 0 0 26px;
  padding: 0;
  color: var(--cl-text);
  font-size: 0;
  line-height: 28px;
}

#cl-member-blocklist-page .cl-source-member-breadcrumb .bc-link,
#cl-member-blocklist-page .cl-source-member-breadcrumb .current {
  display: inline-block;
  color: var(--cl-text);
  font-size: 20px;
  font-weight: 700;
  line-height: 24px;
  vertical-align: middle;
}

#cl-member-blocklist-page .cl-source-member-breadcrumb .current {
  color: var(--cl-text-sub);
}

#cl-member-blocklist-page .cl-source-member-breadcrumb .sep {
  display: inline-block;
  margin: 0 8px;
  color: var(--cl-text-muted);
  font-size: 23px;
  font-weight: 400;
  line-height: 24px;
  vertical-align: middle;
}

#cl-member-blocklist-page .cl-source-member-breadcrumb p {
  display: block;
  margin: 11px 0 0;
  padding: 0;
  color: var(--cl-text-sub);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 20px;
}

#cl-member-blocklist-page .cl-source-blocklist-panel {
  float: none;
  width: 760px;
  max-width: 100%;
  min-height: 0;
  margin: 0;
  padding: 22px 24px;
  overflow: visible;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 14px;
  box-shadow: var(--cl-shadow-panel);
}

#cl-member-blocklist-page .mng-title {
  float: none;
  width: auto;
  margin: 0 0 16px;
  padding: 0;
  color: var(--cl-text);
  font-size: 15px;
  font-weight: 700;
  line-height: 20px;
}

#cl-member-blocklist-page .mng-title .block-count {
  margin: 0;
  color: var(--cl-green-text);
  font-size: inherit;
  font-weight: 700;
}

#cl-member-blocklist-page .table-wrap,
#cl-member-blocklist-page .table-container {
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0;
  overflow-x: auto;
  border: 0;
  box-shadow: none;
}

#cl-member-blocklist-page .cl-source-blocklist-table {
  width: 100%;
  min-width: 710px;
  margin: 0;
  table-layout: fixed;
  border-collapse: collapse;
  border-spacing: 0;
  background: #fff;
  border: 0;
  color: var(--cl-text);
  font-size: 13.5px;
}

#cl-member-blocklist-page .cl-source-blocklist-table th,
#cl-member-blocklist-page .cl-source-blocklist-table td {
  height: auto;
  padding: 13px 10px;
  background: transparent;
  border-top: 0;
  border-right: 0;
  border-bottom: 1px solid var(--cl-border);
  border-left: 0;
  color: var(--cl-text);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 20px;
  text-align: center;
  vertical-align: middle;
  white-space: nowrap;
}

#cl-member-blocklist-page .cl-source-blocklist-table th {
  padding: 12px 10px;
  background: #fafbfc;
  border-top: 1px solid var(--cl-border);
  color: var(--cl-text-sub);
  font-size: 12.5px;
  font-weight: 600;
  line-height: 18px;
  border-radius: 0;
}

#cl-member-blocklist-page .cl-source-blocklist-table th.num {
  width: 76px;
}

#cl-member-blocklist-page .cl-source-blocklist-table th.id {
  width: 344px;
}

#cl-member-blocklist-page .cl-source-blocklist-table th.date {
  width: 150px;
}

#cl-member-blocklist-page .cl-source-blocklist-table th.clear {
  width: 140px;
}

#cl-member-blocklist-page .cl-source-blocklist-table td.id {
  overflow: hidden;
  color: var(--cl-green-text);
  font-weight: 600;
  text-overflow: ellipsis;
}

#cl-member-blocklist-page .block-clear-btn {
  appearance: none;
  -webkit-appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 52px;
  height: 32px;
  margin: 0;
  padding: 6px 12px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  box-shadow: none;
  color: var(--cl-text-sub);
  font-size: 12.5px;
  font-weight: 600;
  line-height: 18px;
  text-decoration: none;
  cursor: pointer;
}

#cl-member-blocklist-page .block-clear-btn:hover {
  background: #fafbfc;
  border-color: #d5d9e0;
  color: var(--cl-text);
}

#cl-member-blocklist-page .listZero td {
  padding: 60px 0;
  color: var(--cl-text-muted);
  text-align: center;
}

#cl-member-blocklist-page nav.text-center {
  display: flex;
  justify-content: center;
  width: 100%;
  margin: 22px 0 0;
  padding: 0;
}

#cl-member-blocklist-page .mng-list-pagination {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
}

#cl-member-blocklist-page .mng-list-pagination > li {
  display: inline-flex;
  margin: 0;
  padding: 0;
  border: 0;
}

#cl-member-blocklist-page .mng-list-pagination > li > a,
#cl-member-blocklist-page .mng-list-pagination > li > span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 30px;
  height: 30px;
  margin: 0;
  padding: 0 8px;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 6px;
  color: var(--cl-text-sub);
  font-size: 13px;
  font-weight: 400;
  line-height: 1;
  text-decoration: none;
}

#cl-member-blocklist-page .mng-list-pagination > li.active > a,
#cl-member-blocklist-page .mng-list-pagination > li.active > span {
  background: #fcfcfb;
  border-color: var(--cl-green);
  color: var(--cl-green-text);
  font-weight: 700;
}

#cl-member-blocklist-page .mng-list-pagination > li > a:hover {
  background: var(--cl-green-tint);
  color: var(--cl-green-text);
}

#cl-member-blocklist-page .mng-list-pagination .mng-arrow {
  display: block;
  width: 15px;
  height: 15px;
  color: var(--cl-text-muted);
  fill: currentColor;
}

#cl-member-blocklist-page .mng-list-pagination .mng-arrow-double {
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

#cl-member-blocklist-page .mng-list-pagination > li.nonpage > a {
  pointer-events: none;
  color: var(--cl-text-muted);
}

@media (max-width: 900px) {
  #cl-member-blocklist-page {
    margin-right: 0;
    margin-left: 0;
  }
}

@media (max-width: 640px) {
  #cl-member-blocklist-page {
    padding: 20px 14px 40px;
  }

  #cl-member-blocklist-page .cl-source-blocklist-panel {
    padding: 18px 14px;
  }

  /* 모바일 첫 화면에서 번호·아이디·차단일·해제 항목을 모두 노출한다. */
  body.cl-dashboard-redesign-page #cl-member-blocklist-page .table-container {
    overflow-x: hidden;
  }

  body.cl-dashboard-redesign-page #cl-member-blocklist-page .cl-source-blocklist-table {
    width: 100%;
    min-width: 0;
  }

  body.cl-dashboard-redesign-page #cl-member-blocklist-page .cl-source-blocklist-table th,
  body.cl-dashboard-redesign-page #cl-member-blocklist-page .cl-source-blocklist-table td {
    padding-right: 4px;
    padding-left: 4px;
  }

  body.cl-dashboard-redesign-page #cl-member-blocklist-page .cl-source-blocklist-table th.num {
    width: 34px;
  }

  body.cl-dashboard-redesign-page #cl-member-blocklist-page .cl-source-blocklist-table th.id {
    width: auto;
  }

  body.cl-dashboard-redesign-page #cl-member-blocklist-page .cl-source-blocklist-table th.date {
    width: 88px;
  }

  body.cl-dashboard-redesign-page #cl-member-blocklist-page .cl-source-blocklist-table th.clear,
  body.cl-dashboard-redesign-page #cl-member-blocklist-page .cl-source-blocklist-table td.clear {
    position: static;
    width: 64px;
    min-width: 64px;
    max-width: 64px;
    box-shadow: none;
  }

  body.cl-dashboard-redesign-page #cl-member-blocklist-page .cl-source-blocklist-table td.id {
    white-space: normal;
    overflow-wrap: anywhere;
  }

  body.cl-dashboard-redesign-page #cl-member-blocklist-page .cl-source-blocklist-table td.date {
    font-size: 12px;
    line-height: 16px;
    white-space: normal;
  }

  body.cl-dashboard-redesign-page #cl-member-blocklist-page .block-clear-btn {
    min-width: 52px;
    padding-right: 7px;
    padding-left: 7px;
  }
}

/* Source withdrawn member list page */
#cl-member-leavelist-page .cl-source-member-breadcrumb,
#cl-member-leavelist-page .mng-settings.memberlist {
  width: 100%;
  max-width: none;
}

#cl-member-leavelist-page .cl-source-member-toolbar {
  row-gap: 12px;
  margin-bottom: 12px;
}

#cl-member-leavelist-page .cl-source-member-toolbar > .mng-title {
  flex: 0 0 100%;
  width: 100%;
  margin-bottom: 4px;
  line-height: 20px;
}

#cl-member-leavelist-page .cl-source-leavelist-table,
#cl-member-leavelist-page .tableListContainer table {
  min-width: 914px;
}

#cl-member-leavelist-page .cl-source-leavelist-table th.process,
#cl-member-leavelist-page .cl-source-leavelist-table td.process,
#cl-member-leavelist-page .tableListContainer table th.process,
#cl-member-leavelist-page .tableListContainer table td.process {
  width: 110px !important;
  min-width: 110px !important;
}

#cl-member-leavelist-page .cl-source-leave-row-actions {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
}

#cl-member-leavelist-page .member-delete-btn {
  appearance: none;
  -webkit-appearance: none;
  box-sizing: border-box;
  margin: 0;
  box-shadow: none;
  font-family: inherit;
  cursor: pointer;
}

body.cl-dashboard-redesign-page #cl-member-leavelist-page .cl-source-leave-restore {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 48px;
  height: 30px;
  padding: 0 13px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  color: var(--cl-text-sub);
  font-size: 12.5px;
  font-weight: 700;
  line-height: 1;
  transition: background .12s, border-color .12s, color .12s;
}

body.cl-dashboard-redesign-page #cl-member-leavelist-page .cl-source-leave-restore:is(:hover, :focus-visible) {
  background: #fafbfc;
  border-color: #d5d9e0;
  color: var(--cl-text);
}

#cl-member-leavelist-page .cl-source-leave-delete {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  padding: 0;
  background: transparent;
  border: 0;
  color: var(--cl-text-sub);
}

body.cl-dashboard-redesign-page #cl-member-leavelist-page .cl-source-leave-delete:is(:hover, :focus-visible) {
  color: var(--cl-danger);
}

#cl-member-leavelist-page .cl-source-leave-delete svg {
  display: block;
  width: 16px;
  height: 16px;
}

#cl-member-leavelist-page .cl-source-leave-selection-bar {
  display: none;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  margin: 0 0 14px;
  padding: 9px 8px 9px 16px;
  background: #e4f7ec;
  border: 1px solid #c6e9d3;
  border-radius: 8px;
}

#cl-member-leavelist-page .cl-source-leave-selection-count {
  color: var(--cl-text);
  font-size: 13px;
  font-weight: 600;
  line-height: 18px;
}

#cl-member-leavelist-page .cl-source-leave-selection-count b {
  color: var(--cl-green-text);
  font-weight: 800;
}

#cl-member-leavelist-page .cl-source-leave-selection-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

#cl-member-leavelist-page .cl-source-leave-selection-btn {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  height: 32px;
  margin: 0;
  padding: 0 16px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  box-shadow: none;
  color: var(--cl-text);
  font-size: 12.5px;
  font-weight: 700;
  line-height: 1;
}

#cl-member-leavelist-page .cl-source-leave-selection-btn.danger {
  border-color: #f1c7c9;
  color: #e5484d;
}

#cl-member-leavelist-page .cl-source-leave-selection-clear {
  height: 32px;
  margin: 0;
  padding: 0 8px;
  background: transparent;
  border: 0;
  color: var(--cl-text-sub);
  font-size: 12.5px;
  font-weight: 400;
  cursor: pointer;
}

#cl-member-leavelist-page .cl-source-leave-note {
  display: block;
  clear: both;
  width: 100%;
  margin: 0;
  padding: 16px 0 0;
  color: var(--cl-text-muted);
  font-size: 12px;
  font-weight: 400;
  line-height: 18px;
}

#cl-member-leavelist-page .mng-list-pagination .mng-arrow-double {
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

@media (max-width: 640px) {
  #cl-member-leavelist-page .cl-source-leave-selection-bar {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
  }

  #cl-member-leavelist-page .cl-source-leave-selection-actions {
    flex-wrap: wrap;
  }
}

/* Source member signup settings page */
html:has(body.cl-dashboard-redesign-page.join-style-preview-open),
body.cl-dashboard-redesign-page.join-style-preview-open {
  /* shopping.css의 html/body overflow 강제 지정보다 팝업 상태를 우선한다. */
  overflow: hidden !important;
}

body.cl-dashboard-redesign-page #join-style-preview-modal {
  position: fixed;
  z-index: 999999;
  top: var(--join-preview-top, 0px);
  right: auto;
  bottom: auto;
  left: var(--join-preview-left, 0px);
  width: var(--join-preview-width, 100%);
  height: 100vh;
  height: var(--join-preview-height, 100dvh);
  overflow: hidden;
  background: rgba(0, 0, 0, .45);
}

body.cl-dashboard-redesign-page #join-style-preview-modal,
body.cl-dashboard-redesign-page #join-style-preview-modal * {
  box-sizing: border-box;
}

body.cl-dashboard-redesign-page #join-style-preview-modal .join-style-preview-stage {
  overscroll-behavior: contain;
}

@media (max-width: 767px) {
  body.cl-dashboard-redesign-page #join-style-preview-modal .join-style-preview-panel {
    top: max(10px, env(safe-area-inset-top));
    bottom: max(10px, env(safe-area-inset-bottom));
  }

  body.cl-dashboard-redesign-page #join-style-preview-modal .join-style-preview-bar {
    position: relative;
    padding-right: 60px;
  }

  body.cl-dashboard-redesign-page #join-style-preview-modal .join-style-preview-close {
    position: absolute;
    top: 4px;
    right: 4px;
    width: 44px;
    height: 44px;
  }
}

#cl-member-signup-settings-page {
  --cl-collection-used-width: 70px;
  --cl-collection-required-width: 60px;
  width: auto;
  max-width: none;
  margin-top: 0;
  margin-right: var(--cl-source-app-gutter);
  margin-left: calc(var(--cl-source-app-gutter) + var(--cl-source-sidebar-w));
  padding: 28px 32px 60px;
  background: transparent;
  color: var(--cl-text);
}

#cl-member-signup-settings-page,
#cl-member-signup-settings-page * {
  box-sizing: border-box;
}

#cl-member-signup-settings-page > .dashbottom-container,
#cl-member-signup-settings-page .mng-body,
#cl-member-signup-settings-page .setting-box {
  float: none;
  width: 100%;
  max-width: none;
  min-height: 0;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}

#cl-member-signup-settings-page .row {
  margin-right: 0;
  margin-left: 0;
}

#cl-member-signup-settings-page #section-top-menu,
#cl-member-signup-settings-page .mobile-title,
#cl-member-signup-settings-page .submenu_navWrap {
  display: none;
}

#cl-member-signup-settings-page .cl-source-signup-settings-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  width: 760px;
  max-width: 100%;
  margin: 0 0 23px;
}

#cl-member-signup-settings-page .cl-source-member-breadcrumb {
  display: block;
  flex: none;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  color: var(--cl-text);
  font-size: 0;
  line-height: 24px;
}

#cl-member-signup-settings-page .cl-source-member-breadcrumb .bc-link,
#cl-member-signup-settings-page .cl-source-member-breadcrumb .current {
  display: inline-block;
  color: var(--cl-text);
  font-size: 20px;
  font-weight: 700;
  line-height: 24px;
  vertical-align: middle;
}

#cl-member-signup-settings-page .cl-source-member-breadcrumb .current {
  color: var(--cl-text-sub);
}

#cl-member-signup-settings-page .cl-source-member-breadcrumb .sep {
  display: inline-block;
  margin: 0 8px;
  color: var(--cl-text-muted);
  font-size: 23px;
  font-weight: 400;
  line-height: 24px;
  vertical-align: middle;
}

#cl-member-signup-settings-page .cl-source-signup-settings-description {
  display: block;
  margin: 11px 0 0;
  padding: 0;
  color: var(--cl-text-sub);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 20px;
}

#cl-member-signup-settings-page .cl-source-signup-settings-note {
  display: flex;
  align-items: center;
  flex: none;
  gap: 6px;
  max-width: 280px;
  margin: 2px 0 0;
  padding: 0;
  color: var(--cl-green-text);
  font-size: 12.5px;
  font-weight: 400;
  line-height: 20px;
  word-break: keep-all;
}

#cl-member-signup-settings-page .cl-source-signup-settings-note svg {
  display: block;
  flex: 0 0 14px;
  width: 14px;
  height: 14px;
}

#cl-member-signup-settings-page .setting-sub-box {
  display: block;
  float: none;
  width: 760px;
  max-width: 100%;
  min-height: 0;
  margin: 0;
  padding: 22px 24px;
  overflow: visible;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 14px;
  box-shadow: var(--cl-shadow-panel);
}

#cl-member-signup-settings-page .mng-settings.setting-subInfoBox {
  float: none;
  width: 100%;
  max-width: none;
  min-height: 0;
  margin: 0 0 36px;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

#cl-member-signup-settings-page .mng-settings.setting-subInfoBox:last-child {
  margin-bottom: 0;
}

#cl-member-signup-settings-page .mng-title.setting-sub-title {
  float: none;
  width: 100%;
  margin: 0 0 20px;
  padding: 0;
  color: var(--cl-text);
  font-size: 16px;
  font-weight: 800;
  line-height: 22px;
}

#cl-member-signup-settings-page .mng-wrap.setting-sub-content {
  display: block;
  position: static;
  float: none;
  width: 100%;
  max-width: none;
  min-height: 0;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
}

#cl-member-signup-settings-page .cl-signup-basic-title {
  float: none !important;
  width: 100% !important;
  margin: 0 0 20px !important;
  padding: 0 !important;
}

#cl-member-signup-settings-page .cl-signup-basic-fields {
  display: flex !important;
  align-items: stretch;
  flex-direction: column;
  gap: 18px;
  position: static !important;
  float: none !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

#cl-member-signup-settings-page .cl-signup-field {
  display: grid !important;
  grid-template-columns: 149px minmax(0, 400px);
  align-items: center;
  gap: 24px;
  position: static !important;
  float: none !important;
  clear: both;
  width: 100% !important;
  max-width: 573px !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

#cl-member-signup-settings-page .cl-signup-field-label {
  display: flex !important;
  align-items: center;
  gap: 5px;
  float: none !important;
  width: 149px !important;
  max-width: 100%;
  min-height: 20px;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text-sub);
  font-size: 13.5px;
  font-weight: 600;
  line-height: 20px;
}

#cl-member-signup-settings-page .cl-signup-field-label .cm-popover-info {
  flex: 0 0 13px;
  width: 13px;
  height: 13px;
  margin: 0;
  fill: var(--cl-accent-blue);
  transform: none !important;
}

#cl-member-signup-settings-page .cl-signup-field-control {
  display: block !important;
  position: static !important;
  float: none !important;
  width: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

#cl-member-signup-settings-page .cl-signup-field--description {
  align-items: start;
}

#cl-member-signup-settings-page .cl-signup-select,
#cl-member-signup-settings-page .cl-signup-select .bootstrap-select,
#cl-member-signup-settings-page .cl-signup-select .dropdown-toggle {
  width: 180px !important;
  max-width: none;
}

#cl-member-signup-settings-page .cl-signup-select--activate,
#cl-member-signup-settings-page .cl-signup-select--activate .bootstrap-select,
#cl-member-signup-settings-page .cl-signup-select--activate .dropdown-toggle {
  width: 173px !important;
}

#cl-member-signup-settings-page .cl-signup-select--approval,
#cl-member-signup-settings-page .cl-signup-select--approval .bootstrap-select,
#cl-member-signup-settings-page .cl-signup-select--approval .dropdown-toggle {
  width: 94px !important;
}

#cl-member-signup-settings-page .cl-signup-select,
#cl-member-signup-settings-page .cl-signup-select--activate {
  --cl-signup-select-text: #8a8f98;
  --cl-signup-select-active: var(--cl-green-text);
  display: block !important;
  position: relative;
  float: none !important;
  height: 35px;
  margin: 0;
  padding: 0;
}

#cl-member-signup-settings-page .cl-signup-select > svg {
  display: none;
}

#cl-member-signup-settings-page .cl-signup-select .dropdown-toggle,
#cl-member-signup-settings-page .cl-signup-select .dropdown-toggle:hover,
#cl-member-signup-settings-page .cl-signup-select .dropdown-toggle:focus,
#cl-member-signup-settings-page .cl-signup-select .open > .dropdown-toggle {
  display: flex;
  align-items: center;
  height: 35px;
  margin: 0;
  padding: 0 30px 0 12px;
  background-color: #fff !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238A8F98' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-position: right 8px center;
  background-repeat: no-repeat;
  background-size: 14px;
  border: 1px solid var(--cl-border);
  border-radius: var(--cl-radius-sm);
  box-shadow: none;
  outline: 0 !important;
  color: var(--cl-signup-select-text) !important;
  font-size: 13.5px;
  font-weight: 600;
  line-height: 33px;
  text-align: left;
  white-space: nowrap;
}

#cl-member-signup-settings-page .cl-signup-select .bootstrap-select.open .dropdown-toggle {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238A8F98' stroke-width='2'%3E%3Cpath d='M6 15l6-6 6 6'/%3E%3C/svg%3E");
}

#cl-member-signup-settings-page .cl-signup-select .dropdown-toggle .caret {
  display: none;
}

#cl-member-signup-settings-page .cl-signup-select .dropdown-toggle .filter-option,
#cl-member-signup-settings-page .cl-signup-select .dropdown-toggle .filter-option-inner,
#cl-member-signup-settings-page .cl-signup-select .dropdown-toggle .filter-option-inner-inner {
  width: 100%;
  height: 33px;
  margin: 0;
  padding: 0 !important;
  overflow: hidden;
  color: var(--cl-signup-select-text) !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  line-height: 33px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#cl-member-signup-settings-page .cl-signup-select .bootstrap-select > .dropdown-menu {
  width: 100%;
  min-width: 100%;
  margin: 4px 0 0;
  padding: 4px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(20, 24, 32, .14);
}

#cl-member-signup-settings-page .cl-signup-select .bootstrap-select > .dropdown-menu > .inner {
  overflow-x: hidden;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

#cl-member-signup-settings-page .cl-signup-select .bootstrap-select > .dropdown-menu .dropdown-menu.inner {
  min-width: 0 !important;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

#cl-member-signup-settings-page .cl-signup-select .bootstrap-select > .dropdown-menu .dropdown-menu.inner > li > a {
  padding: 8px 12px;
  border-radius: var(--cl-radius-sm);
  color: var(--cl-signup-select-text) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 18px;
}

#cl-member-signup-settings-page .cl-signup-select .bootstrap-select > .dropdown-menu .dropdown-menu.inner > li > a > span {
  color: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
}

#cl-member-signup-settings-page .cl-signup-select .bootstrap-select > .dropdown-menu .dropdown-menu.inner > li:not(.active):not(.selected) > a:hover,
#cl-member-signup-settings-page .cl-signup-select .bootstrap-select > .dropdown-menu .dropdown-menu.inner > li:not(.active):not(.selected) > a:focus {
  background: var(--cl-green-tint);
  color: var(--cl-green-text) !important;
  font-weight: 400 !important;
}

#cl-member-signup-settings-page .cl-signup-select .bootstrap-select > .dropdown-menu .dropdown-menu.inner > li.active > a,
#cl-member-signup-settings-page .cl-signup-select .bootstrap-select > .dropdown-menu .dropdown-menu.inner > li.active > a:hover,
#cl-member-signup-settings-page .cl-signup-select .bootstrap-select > .dropdown-menu .dropdown-menu.inner > li.active > a:focus,
#cl-member-signup-settings-page .cl-signup-select .bootstrap-select > .dropdown-menu .dropdown-menu.inner > li.selected > a,
#cl-member-signup-settings-page .cl-signup-select .bootstrap-select > .dropdown-menu .dropdown-menu.inner > li.selected > a:hover,
#cl-member-signup-settings-page .cl-signup-select .bootstrap-select > .dropdown-menu .dropdown-menu.inner > li.selected > a:focus {
  background: var(--cl-green-tint);
  color: var(--cl-green-text) !important;
  font-weight: 600 !important;
}

#cl-member-signup-settings-page .cl-signup-description-input,
#cl-member-signup-settings-page .mng-settings[data-type="policies"] textarea {
  display: block;
  width: 100%;
  margin: 0;
  padding: 10px 12px;
  resize: vertical;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  box-shadow: none;
  color: var(--cl-text);
  font-family: inherit;
  font-size: 13.5px;
  font-weight: 400;
  line-height: 20px;
}

#cl-member-signup-settings-page .cl-signup-description-input {
  height: 70px;
  min-height: 70px;
}

#cl-member-signup-settings-page .cl-signup-field--captcha {
  display: grid !important;
  align-items: center;
  gap: 24px;
}

#cl-member-signup-settings-page .cl-signup-field--captcha .cl-signup-field-label {
  margin-bottom: 0 !important;
}

#cl-member-signup-settings-page .cl-signup-captcha-control {
  display: flex !important;
  align-items: center;
  align-self: center;
  width: auto !important;
  height: 20px;
  line-height: 0;
}

#cl-member-signup-settings-page .cl-signup-captcha-control > span {
  display: flex;
  align-items: center;
  height: 20px;
  margin: 0;
  padding: 0;
  line-height: 0;
}

#cl-member-signup-settings-page .cl-signup-captcha-control .switch {
  display: block !important;
  position: relative;
  flex: 0 0 36px;
  vertical-align: middle !important;
  margin: 0;
  transform: none !important;
}

#cl-member-signup-settings-page .cl-signup-captcha-control .cl-style.switch {
  width: 36px !important;
  height: 20px !important;
  padding: 0 !important;
  border: 0;
  box-shadow: none;
  cursor: pointer;
}

#cl-member-signup-settings-page .cl-signup-captcha-control .cl-style.switch .switch-input {
  position: absolute;
  inset: 0;
  z-index: 2;
  width: 36px;
  height: 20px;
  margin: 0;
  padding: 0;
  opacity: 0;
  cursor: pointer;
}

#cl-member-signup-settings-page .cl-signup-captcha-control .cl-style.switch .switch-label {
  position: absolute;
  inset: 0;
  display: block;
  width: 36px;
  height: 20px;
  margin: 0;
  background: #d5d9e0;
  border: 0;
  border-radius: 999px;
  box-shadow: none;
  transition: background .18s;
}

#cl-member-signup-settings-page .cl-signup-captcha-control .cl-style.switch .switch-handle {
  top: 3px;
  left: 3px;
  width: 14px;
  height: 14px;
  background: #fff;
  border: 0;
  border-radius: 50%;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .2) !important;
  transform: translateX(0);
  transition: transform .18s;
}

#cl-member-signup-settings-page .cl-signup-captcha-control .cl-style.switch .switch-input:checked ~ .switch-label {
  background: var(--cl-green);
  border: 0;
}

#cl-member-signup-settings-page .cl-signup-captcha-control .cl-style.switch .switch-input:checked ~ .switch-handle {
  left: 3px;
  transform: translateX(16px);
}

#cl-member-signup-settings-page .cl-signup-captcha-control .cl-style.switch .switch-input:focus-visible ~ .switch-label {
  outline: 2px solid var(--cl-green);
  outline-offset: 2px;
}

#cl-member-signup-settings-page .cl-signup-captcha-control .cl-style.switch.disabled,
#cl-member-signup-settings-page .cl-signup-captcha-control .cl-style.switch .switch-input:disabled {
  cursor: default;
}

#cl-member-signup-settings-page .cl-signup-captcha-control .cl-style.switch.disabled .switch-label,
#cl-member-signup-settings-page .cl-signup-captcha-control .cl-style.switch .switch-input:disabled ~ .switch-label {
  background: #d6d9dc !important;
}

#cl-member-signup-settings-page .cl-signup-captcha-control .cl-style.switch.disabled .switch-handle,
#cl-member-signup-settings-page .cl-signup-captcha-control .cl-style.switch .switch-input:disabled ~ .switch-handle {
  background: #f5f6f8 !important;
}

#cl-member-signup-settings-page .collection-content-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) var(--cl-collection-used-width) var(--cl-collection-required-width);
  align-items: center;
  width: 100%;
  max-width: 700px;
  height: 39px;
  margin: 0;
  padding: 0 10px !important;
  background: #fafbfc;
  border-top: 1px solid var(--cl-border);
  border-bottom: 1px solid var(--cl-border);
}

#cl-member-signup-settings-page .collection-content-heading > div {
  display: flex;
  align-items: center;
  justify-content: center;
  float: none !important;
  width: auto !important;
  height: 39px;
  margin: 0;
  color: var(--cl-text-sub);
  font-size: 12.5px;
  font-weight: 600;
  line-height: 18px;
  text-align: center;
}

#cl-member-signup-settings-page .collection-content-heading > div:first-child {
  grid-column: 1;
  justify-content: flex-start;
}

#cl-member-signup-settings-page .collection-content-heading > div:nth-child(2) {
  grid-column: 3;
}

#cl-member-signup-settings-page .collection-content-heading > div:nth-child(3) {
  grid-column: 2;
}

#cl-member-signup-settings-page .collection-content {
  width: 100%;
  max-width: 700px;
  margin: 0;
  padding: 0;
}

#cl-member-signup-settings-page .collection-content .collection-item {
  position: relative;
  display: grid;
  /* 항목명 뒤에 수정·삭제를 두고, 남는 공간 뒤 사용·필수 열은 고정한다. */
  grid-template-columns: minmax(0, max-content) 44px 26px minmax(0, 1fr) var(--cl-collection-used-width) var(--cl-collection-required-width);
  align-items: center;
  width: 100%;
  min-height: 43px;
  margin: 0;
  /* 시안의 셀 padding 10px + 핸들 margin-left -6px와 같은 시작점이다. */
  padding: 0 10px 0 4px;
  background: #fff;
  border-bottom: 1px solid var(--cl-border);
}

.cl-dashboard-redesign #cl-member-signup-settings-page .collection-content .collection-item:not([data-etc]):not(.collection-status-edit) {
  grid-template-columns: minmax(0, 1fr) 0 0 0 var(--cl-collection-used-width) var(--cl-collection-required-width);
}

#cl-member-signup-settings-page .collection-content .collection-item .collection-info {
  position: relative;
  z-index: 1;
  display: flex !important;
  align-items: center;
  gap: 8px;
  grid-column: 1;
  grid-row: 1;
  float: none !important;
  width: 100% !important;
  min-width: 0;
  height: 38px;
  margin: 0;
  padding: 0 !important;
  color: var(--cl-text);
  font-size: 13.5px;
  line-height: 20px;
}

#cl-member-signup-settings-page .collection-content .collection-item .collection-info > .icon-move {
  position: static;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  flex: 0 0 20px;
  width: 20px;
  height: 24px;
  padding: 0 !important;
  color: var(--cl-text-muted);
  cursor: grab !important;
}

#cl-member-signup-settings-page .collection-content .collection-item .collection-info > .icon-move svg {
  display: block;
  width: 20px;
  height: 20px;
  fill: currentColor;
}

.cl-dashboard-redesign #cl-member-signup-settings-page .collection-item:not(.collection-status-edit) .collection-info {
  gap: 6px;
}

.cl-dashboard-redesign #cl-member-signup-settings-page .collection-item:not(.collection-status-edit) .collection-info > .icon-move {
  flex-basis: 14px;
  width: 14px;
}

.cl-dashboard-redesign #cl-member-signup-settings-page .collection-item:not(.collection-status-edit) .collection-info > .icon-move svg {
  width: 14px;
  height: 16px;
}

#cl-member-signup-settings-page .collection-content .collection-item.fix .collection-info > .icon-move,
#cl-member-signup-settings-page .collection-content .collection-item.additem .collection-info > .icon-move,
#cl-member-signup-settings-page .collection-content.ss_user_noActive .collection-info > .icon-move,
#cl-member-signup-settings-page .collection-content.member_disabled .collection-info > .icon-move {
  visibility: hidden;
  pointer-events: none;
}

#cl-member-signup-settings-page .collection-content .collection-item .collection-name {
  float: none;
  width: auto;
  min-width: 0;
  margin: 0;
  padding: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#cl-member-signup-settings-page .collection-content .collection-item .collection-config {
  position: static !important;
  display: contents !important;
  align-items: center;
  justify-items: center;
  float: none !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0;
  padding: 0 !important;
  pointer-events: none;
}

#cl-member-signup-settings-page .collection-content .collection-item .collection-config > .icons {
  display: flex !important;
  align-items: center;
  justify-content: center;
  grid-row: 1;
  width: 22px !important;
  height: 22px !important;
  margin: 0;
  pointer-events: auto;
}

#cl-member-signup-settings-page .collection-content .collection-item .collection-config > .icons:nth-child(1) {
  grid-column: 2;
  justify-self: end;
}

#cl-member-signup-settings-page .collection-content .collection-item .collection-config > .icons:nth-child(2) {
  grid-column: 3;
  justify-self: end;
}

#cl-member-signup-settings-page .collection-content .collection-item .collection-config > .cl-collection-action {
  position: relative;
  z-index: 2;
  padding: 0;
  border: 0;
  border-radius: 6px;
  background: transparent;
  box-shadow: none;
  color: var(--cl-text-sub);
  cursor: pointer;
  opacity: 0;
  pointer-events: none;
}

#cl-member-signup-settings-page .collection-content .collection-item:hover .collection-config > .cl-collection-action,
#cl-member-signup-settings-page .collection-content .collection-item .collection-config > .cl-collection-action:focus-visible {
  opacity: 1;
  pointer-events: auto;
}

#cl-member-signup-settings-page .collection-content .collection-item .cl-collection-action:hover,
#cl-member-signup-settings-page .collection-content .collection-item .cl-collection-action:focus-visible {
  background: var(--cl-bg-3);
  color: var(--cl-text-sub);
}

#cl-member-signup-settings-page .collection-content .collection-item .cl-collection-action:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 2px;
}

#cl-member-signup-settings-page .collection-content .collection-item .collection-config > .icons.hide,
#cl-member-signup-settings-page .collection-content.ss_user_noActive .collection-config > .cl-collection-action,
#cl-member-signup-settings-page .collection-content.member_disabled .collection-config > .cl-collection-action {
  display: none !important;
}

@media (hover: none) {
  #cl-member-signup-settings-page .collection-content .collection-item .collection-config > .cl-collection-action {
    opacity: 1;
    pointer-events: auto;
  }
}

#cl-member-signup-settings-page .collection-content .collection-item .collection-config > .icons.empty,
#cl-member-signup-settings-page .collection-content .collection-item .collection-config > .icons:nth-child(3) {
  visibility: hidden;
  grid-column: 4;
}

#cl-member-signup-settings-page .collection-content .collection-item .memberconfig-svg {
  width: 13px;
  height: 13px;
  fill: var(--cl-text-sub);
}

#cl-member-signup-settings-page .collection-content .collection-item .cl-collection-action > .memberconfig-svg {
  flex: 0 0 16px;
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  pointer-events: none;
}

#cl-member-signup-settings-page .collection-content .use-option-check {
  display: contents;
}

#cl-member-signup-settings-page .collection-content .use-option-check .checkboxs {
  display: flex !important;
  align-items: center;
  justify-content: center;
  grid-row: 1;
  width: var(--cl-collection-used-width);
  height: 38px;
  margin: 0 !important;
  pointer-events: auto;
}

#cl-member-signup-settings-page .collection-content .use-option-check .checkboxs:nth-child(1) {
  grid-column: 5;
}

#cl-member-signup-settings-page .collection-content .use-option-check .checkboxs:nth-child(2) {
  grid-column: 6;
  width: var(--cl-collection-required-width);
}

#cl-member-signup-settings-page .collection-content .use-option-check .newcheckboxSvg,
#cl-member-signup-settings-page .collection-content .use-option-check input,
#cl-member-signup-settings-page .collection-content .use-option-check svg {
  width: 16px !important;
  height: 16px !important;
  margin: 0;
}

body.cl-dashboard-redesign-page #cl-member-signup-settings-page .collection-content .use-option-check .checkboxs.disabled,
body.cl-dashboard-redesign-page #cl-member-signup-settings-page .collection-content .use-option-check .checkboxs:has(input:disabled) {
  opacity: .4 !important;
}

body.cl-dashboard-redesign-page #cl-member-signup-settings-page .collection-content .use-option-check .checkboxs.disabled,
body.cl-dashboard-redesign-page #cl-member-signup-settings-page .collection-content .use-option-check .checkboxs.disabled :is(label, input, .newcheckboxSvg),
body.cl-dashboard-redesign-page #cl-member-signup-settings-page .collection-content .use-option-check .checkboxs:has(input:disabled),
body.cl-dashboard-redesign-page #cl-member-signup-settings-page .collection-content .use-option-check .checkboxs:has(input:disabled) :is(label, input, .newcheckboxSvg) {
  cursor: default !important;
}

body.cl-dashboard-redesign-page #cl-member-signup-settings-page .collection-content .collection-item:has(.checkboxs.disabled) .collection-name,
body.cl-dashboard-redesign-page #cl-member-signup-settings-page .collection-content .collection-item:has(.collection-item-used:disabled):has(.collection-item-optional:disabled) .collection-name {
  color: var(--cl-text-muted, #B4B8BF);
}

#cl-member-signup-settings-page .collection-content .use-option-check .checkboxs:nth-child(1) .newcheckboxSvg > svg,
#cl-member-signup-settings-page .collection-content .use-option-check .checkboxs:nth-child(2) .newcheckboxSvg > svg {
  display: none !important;
}

#cl-member-signup-settings-page .collection-content .use-option-check .collection-item-used {
  position: static !important;
  display: block;
  width: 16px !important;
  height: 16px !important;
  padding: 0;
  opacity: 1;
  appearance: none;
  -webkit-appearance: none;
  background-color: transparent;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23B4B8BF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12s3.5-7 10-7 10 7 10 7-3.5 7-10 7S2 12 2 12z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3Cpath d='M3 3l18 18'/%3E%3C/svg%3E");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 16px 16px;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

#cl-member-signup-settings-page .collection-content .use-option-check .collection-item-used:checked {
  background-color: transparent;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2303C75A' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12s3.5-7 10-7 10 7 10 7-3.5 7-10 7-10-7-10-7z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");
}

#cl-member-signup-settings-page .collection-content .use-option-check .collection-item-optional {
  position: static !important;
  display: block;
  width: 16px !important;
  height: 16px !important;
  padding: 0;
  opacity: 1;
  appearance: none;
  -webkit-appearance: none;
  background: #fff;
  border: 1.5px solid #c9cdd4;
  border-radius: 4px;
  box-shadow: none;
}

#cl-member-signup-settings-page .collection-content .use-option-check .collection-item-optional:checked {
  background-color: var(--cl-green);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12.5l4.2 4.2L19 6.5' fill='none' stroke='%23ffffff' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 12px 12px;
  border-color: var(--cl-green);
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit {
  display: grid !important;
  opacity: 1;
  pointer-events: auto;
  grid-template-columns: minmax(0, 1fr) var(--cl-collection-used-width) var(--cl-collection-required-width);
  gap: 0;
  width: 100%;
  max-width: 100%;
  min-height: 0;
  margin: 8px 0;
  padding: 14px 10px;
  overflow: visible;
  background: #fafbfc !important;
  border: 1px solid #d2ecdc;
  border-radius: 10px;
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit > .collection-info {
  display: flex !important;
  width: 20px !important;
  height: 36px;
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit > .collection-info > .collection-name {
  display: none;
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit:not(.additem) > .collection-info > .icon-move {
  opacity: 1;
  visibility: visible;
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit > .collection-name-input {
  position: static !important;
  z-index: 2;
  display: block !important;
  grid-column: 1;
  grid-row: 1;
  width: calc(100% - 28px) !important;
  max-width: none !important;
  height: 36px;
  margin: 0 0 0 28px !important;
  padding: 0 4px !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid var(--cl-border) !important;
  border-radius: 0;
  box-shadow: none;
  color: var(--cl-text);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 34px;
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit > .collection-name-input::placeholder {
  color: var(--cl-text-muted);
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit > .collection-name-input:focus {
  outline: 0;
  border-bottom-color: var(--cl-green) !important;
  box-shadow: none;
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit > .collection-config {
  display: grid !important;
  grid-column: 1 / 4;
  grid-row: 1;
  grid-template-columns: minmax(0, 1fr) var(--cl-collection-used-width) var(--cl-collection-required-width);
  gap: 0;
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit > .collection-config > .icons {
  display: none !important;
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .use-option-check .checkboxs {
  width: var(--cl-collection-used-width) !important;
  height: 36px;
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .use-option-check .checkboxs:nth-child(1) {
  grid-column: 2;
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .use-option-check .checkboxs:nth-child(2) {
  grid-column: 3;
  width: var(--cl-collection-required-width) !important;
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .use-option-check .newcheckboxSvg,
#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .use-option-check input,
#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .use-option-check svg {
  width: 16px !important;
  height: 16px !important;
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .use-option-check .collection-item-used {
  background-size: 16px 16px;
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit > .collection-item-content {
  display: flex;
  grid-column: 1 / 4;
  grid-row: 2;
  align-items: stretch;
  flex-direction: column;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0 !important;
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .collection-item-content-wrap,
#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .collection-item-content-info {
  display: flex;
  align-items: center;
  gap: 8px;
  width: calc(100% - 28px);
  max-width: none;
  margin: 12px 0 0 28px;
  padding: 0 !important;
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .collection-type-title {
  display: inline-flex;
  align-items: center;
  flex: 0 0 24px;
  width: 24px;
  height: 20px;
  margin: 0;
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .collection-type-title svg {
  display: block;
  width: 24px;
  height: 15px;
  fill: var(--cl-accent-blue);
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .collection-type-text {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
  width: auto;
  height: 20px;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  color: var(--cl-text);
  font-size: 13.5px;
  font-weight: 500;
  line-height: 20px;
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .collection-type-selectbox,
#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .bootstrap-select.jcollection-select,
#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .bootstrap-select.jcollection-select > .dropdown-toggle {
  width: 150px !important;
  max-width: 150px !important;
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .bootstrap-select.jcollection-select > .dropdown-toggle,
#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .bootstrap-select.jcollection-select > .dropdown-toggle:hover,
#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .bootstrap-select.jcollection-select > .dropdown-toggle:focus {
  display: flex;
  align-items: center;
  height: 36px;
  padding: 0 32px 0 12px;
  background: #fff !important;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  box-shadow: none;
  color: var(--cl-text);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 33px;
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .bootstrap-select.jcollection-select .filter-option,
#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .bootstrap-select.jcollection-select .filter-option-inner,
#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .bootstrap-select.jcollection-select .filter-option-inner-inner {
  height: 34px;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 34px;
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .collection-type-selectbox > svg,
#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .bootstrap-select.jcollection-select .caret {
  display: none !important;
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .bootstrap-select.jcollection-select > .dropdown-toggle::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 12px;
  width: 14px;
  height: 14px;
  margin: 0;
  border: 0;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238A8F98' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center / 14px 14px no-repeat;
  transform: translateY(-50%);
  pointer-events: none;
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .bootstrap-select.jcollection-select > .dropdown-menu {
  width: 150px;
  min-width: 150px;
  margin: 4px 0 0;
  padding: 4px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(20, 24, 32, .14);
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .bootstrap-select.jcollection-select > .dropdown-menu > .inner,
#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .bootstrap-select.jcollection-select > .dropdown-menu .dropdown-menu.inner {
  min-width: 0 !important;
  margin: 0;
  padding: 0;
  overflow-x: hidden;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .bootstrap-select.jcollection-select > .dropdown-menu .dropdown-menu.inner > li > a {
  padding: 9px 12px;
  border-radius: 6px;
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 18px;
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .bootstrap-select.jcollection-select > .dropdown-menu .dropdown-menu.inner > li.active > a,
#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .bootstrap-select.jcollection-select > .dropdown-menu .dropdown-menu.inner > li.selected > a {
  background: var(--cl-green-tint);
  color: var(--cl-green-text) !important;
  font-weight: 600 !important;
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .collection-type-info {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 14px;
  width: 14px !important;
  height: 14px !important;
  margin: 0;
  color: var(--cl-accent-blue);
  background-color: currentColor;
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13 13' width='14' height='14' fill='%23000'%3E%3Cpath d='M6.5 0C2.91 0 0 2.91 0 6.5S2.91 13 6.5 13 13 10.09 13 6.5 10.09 0 6.5 0zM6.5 12C3.47 12 1 9.53 1 6.5S3.47 1 6.5 1 12 3.47 12 6.5 9.53 12 6.5 12z'/%3E%3Crect x='6' y='9' width='1' height='1'/%3E%3Cpath d='M6.66 3.01C5.61 3.01 4.58 3.5 4.5 4.8c0 .06-.01.12 0 .2h1.02c0-.07.01-.15.02-.23.08-.62.52-.76 1.08-.76.63 0 1.02.37 1.02.95-.01.48-.3.87-.76 1.34C6.21 6.97 6.02 7.37 6 8h.99c.01-.34.05-.63.68-1.25.5-.48 1.03-1.07 1.03-1.88 0-1.02-.81-1.86-2.04-1.86z'/%3E%3C/svg%3E");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: 14px 14px;
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .collection-type-info svg {
  display: none !important;
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .collection-item-option-wrap,
#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .jcol-add-option {
  flex: 0 0 auto;
  width: calc(100% - 130px);
  max-width: none;
  margin: 12px 0 0;
  padding: 0;
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .description-wrap {
  flex: 0 0 auto;
  width: calc(100% - 158px);
  max-width: none;
  margin: 12px 0 0 28px;
  padding: 0;
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .description-input .cl-common-form-wrap,
#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .description-input .cl-common-form-group {
  width: 100%;
  height: auto;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .description-input .cl-common-form-wrap .cl-common-form-group input {
  position: static;
  width: 100%;
  min-width: 0;
  max-width: none;
  height: 36px;
  margin: 0;
  padding: 0 12px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  box-shadow: none;
  color: var(--cl-text);
  font-size: 13.5px;
  line-height: 34px;
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .description-text::placeholder,
#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .jcol-option-name::placeholder {
  color: var(--cl-text-muted);
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .description-input .cl-common-form-wrap .cl-common-form-group input:focus {
  outline: 0;
  border-color: var(--cl-green);
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .18);
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .description-wrap > .newcheckbox {
  margin: 5px 0 0 3px;
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .description-wrap > .newcheckbox label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 0;
  color: var(--cl-text-sub);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 20px;
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .description-wrap .newcheckboxSvg {
  display: inline-flex;
  flex: 0 0 16px;
  width: 16px;
  height: 16px;
  margin: 0;
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .description-wrap .newcheckboxSvg svg {
  display: none !important;
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .description-wrap .newcheckboxSvg input {
  position: static;
  display: block;
  width: 16px;
  height: 16px;
  margin: 0;
  padding: 0;
  opacity: 1;
  appearance: none;
  -webkit-appearance: none;
  background: #fff;
  border: 1.5px solid #c9cdd4;
  border-radius: 4px;
  cursor: pointer;
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .description-wrap .newcheckboxSvg input:checked {
  background: var(--cl-green) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12.5l4.2 4.2L19 6.5' fill='none' stroke='%23ffffff' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 12px 12px no-repeat;
  border-color: var(--cl-green);
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .description-wrap .newcheckboxSvg input:focus-visible {
  outline: 2px solid var(--cl-green);
  outline-offset: 2px;
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .jcollection-item-box {
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr) 24px;
  align-items: center;
  gap: 8px;
  width: 100%;
  max-width: none;
  padding: 0;
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .jcol-option-name {
  position: static;
  grid-column: 2;
  grid-row: 1;
  width: 100%;
  min-width: 0;
  max-width: none;
  height: 36px;
  margin: 0;
  padding: 0 4px;
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--cl-border);
  border-radius: 0;
  box-shadow: none;
  color: var(--cl-text);
  font-size: 13.5px;
  line-height: 35px;
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .jcol-option-name:focus {
  outline: 0;
  border-bottom-color: var(--cl-green);
  box-shadow: none;
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .jcollection-item-box > .error_wrap {
  grid-column: 2;
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .jcollection-item-option-move,
#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .jcol-option-delete {
  position: static;
  grid-row: 1;
  width: 20px;
  height: 24px;
  transform: none;
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .jcollection-item-option-move {
  grid-column: 1;
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .jcol-option-delete {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  grid-column: 3;
  width: 24px;
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .jcol-option-delete svg {
  fill: var(--cl-danger);
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .jcol-add-option {
  color: var(--cl-green-text);
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .jcol-add-option svg {
  fill: currentColor;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.jcol-selecttype-modal) + .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.jcol-selecttype-modal) + .modal-backdrop.fade,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.jcol-selecttype-modal) + .modal-backdrop.in {
  display: none !important;
  opacity: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.jcol-selecttype-modal) > .modal-default {
  position: fixed !important;
  inset: 0 !important;
  z-index: 1200 !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
  width: 100vw !important;
  height: 100vh !important;
  padding: 5vh 0 !important;
  overflow-y: auto !important;
  background: rgba(0, 0, 0, .45) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.jcol-selecttype-modal) > .modal-default > .cl-mobile-btn {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.jcol-selecttype-modal {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  flex: 0 0 auto !important;
  width: 560px !important;
  max-width: 94vw !important;
  margin: 0 auto !important;
  padding: 0 !important;
  overflow: visible !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.jcol-selecttype-modal .modal-content {
  position: relative !important;
  display: block !important;
  float: none !important;
  width: 100% !important;
  padding: 28px 30px 26px !important;
  overflow: visible !important;
  background: #fff !important;
  border: 0 !important;
  border-radius: 16px !important;
  box-shadow: 0 20px 50px rgba(20, 24, 32, .25) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.jcol-selecttype-modal .modal-body {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.jcol-selecttype-modal .modal-title {
  margin: 0 0 22px !important;
  color: var(--cl-text) !important;
  font-size: 19px !important;
  font-weight: 800 !important;
  line-height: 26px !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.jcol-selecttype-modal .modal-content > .close {
  position: absolute !important;
  top: 16px !important;
  right: 16px !important;
  z-index: 3 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text-sub) !important;
  background: none !important;
  border: 0 !important;
  border-radius: 8px !important;
  opacity: 1 !important;
  transition: color .15s, background .15s, transform .18s cubic-bezier(.34, 1.56, .64, 1) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.jcol-selecttype-modal .modal-content > .close svg {
  display: block !important;
  width: 9px !important;
  height: 9px !important;
  fill: currentColor !important;
  stroke: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.jcol-selecttype-modal .modal-content > .close:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.jcol-selecttype-modal .modal-content > .close:focus {
  color: var(--cl-text) !important;
  background: #f1f2f5 !important;
  outline: 0 !important;
  transform: rotate(90deg) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.jcol-selecttype-modal .jcol_info_wrap {
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.jcol-selecttype-modal .jcol_info_wrap > li,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.jcol-selecttype-modal .jcol_info_wrap > li:first-child,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.jcol-selecttype-modal .jcol_info_wrap > li:last-child {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 18px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 16px 0 !important;
  background: #fff !important;
  border: 0 !important;
  border-bottom: 1px solid var(--cl-line) !important;
  list-style: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.jcol-selecttype-modal .jcol_info_wrap > li:first-child {
  padding-top: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.jcol-selecttype-modal .jcol_info_wrap > li:last-child {
  padding-bottom: 0 !important;
  border-bottom: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.jcol-selecttype-modal .jcol_img_box {
  flex: 0 0 100px !important;
  width: 100px !important;
  height: 83px !important;
  margin: 0 !important;
  overflow: hidden !important;
  background: #fafbfc !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.jcol-selecttype-modal .jcol_img_box img {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  object-fit: cover !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.jcol-selecttype-modal .jcol_info_text,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.jcol-selecttype-modal .jcol_info_text.en {
  display: flex !important;
  align-items: flex-start !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
  width: auto !important;
  max-width: none !important;
  min-width: 0 !important;
  color: var(--cl-text-sub) !important;
  line-height: 1.55 !important;
  letter-spacing: 0 !important;
  text-align: left !important;
  word-break: keep-all !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.jcol-selecttype-modal .jcol_info_text .title {
  display: block !important;
  margin: 0 0 5px !important;
  color: var(--cl-green-text) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 20px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.jcol-selecttype-modal .jcol_info_text .contents {
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.jcol-selecttype-modal .modal-footer {
  position: static !important;
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  margin: 24px 0 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  opacity: 1 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.jcol-selecttype-modal .modal-footer .btn.ok-button-dialog {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 48px !important;
  margin: 0 !important;
  padding: 14px !important;
  color: #fff !important;
  background: var(--cl-green) !important;
  border: 0 !important;
  border-radius: 10px !important;
  box-shadow: none !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 20px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.jcol-selecttype-modal .modal-footer .btn.ok-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.jcol-selecttype-modal .modal-footer .btn.ok-button-dialog:focus {
  background: var(--cl-green-hover) !important;
}

@media (max-width: 767px) {
  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.jcol-selecttype-modal) > .modal-default {
    padding: 16px 0 !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.jcol-selecttype-modal .modal-content {
    padding: 24px 18px 20px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.jcol-selecttype-modal .jcol_info_wrap > li,
  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.jcol-selecttype-modal .jcol_info_wrap > li:first-child,
  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.jcol-selecttype-modal .jcol_info_wrap > li:last-child {
    gap: 12px !important;
    padding: 14px 0 !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.jcol-selecttype-modal .jcol_info_wrap > li:first-child {
    padding-top: 0 !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.jcol-selecttype-modal .jcol_info_wrap > li:last-child {
    padding-bottom: 0 !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.jcol-selecttype-modal .jcol_img_box {
    flex-basis: 82px !important;
    width: 82px !important;
    height: 68px !important;
  }
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .jcol-btn-wrap {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  width: 100%;
  max-width: none;
  margin: 14px 0 0;
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .jcol-btn {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  max-width: none;
  min-width: 70px;
  min-height: 34px;
  padding: 0 22px;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .jcol-btn-cancel {
  margin: 0;
  background: #fff;
  border-color: var(--cl-border);
  color: var(--cl-text-sub);
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .jcol-btn-cancel:hover {
  background: var(--cl-green-soft);
  border-color: var(--cl-green);
  color: var(--cl-green-text);
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .jcol-btn-save {
  background: var(--cl-green);
  border-color: var(--cl-green);
  color: #fff;
}

#cl-member-signup-settings-page .collection-content .collection-item.collection-status-edit .jcol-btn-save:hover {
  background: var(--cl-green-hover);
  border-color: var(--cl-green-hover);
}

#cl-member-signup-settings-page .mng-settings[data-type="collection"] .btn-wrap {
  display: flex !important;
  align-items: center;
  justify-content: flex-end !important;
  width: 100%;
  max-width: 700px;
  margin: 12px 0 0;
  padding: 0 !important;
}

#cl-member-signup-settings-page .mng-settings[data-type="collection"] .collection-add {
  display: inline-flex;
  flex: none;
  align-items: center;
  justify-content: center;
  gap: 5px;
  width: auto;
  height: 40px;
  margin: 0;
  padding: 0 14px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
  box-shadow: none;
  color: var(--cl-green-text);
  font-size: 13px;
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
  word-break: keep-all;
  cursor: pointer;
  transition: background .12s, border-color .12s, color .12s, box-shadow .12s;
}

#cl-member-signup-settings-page .mng-settings[data-type="collection"] .collection-add:hover,
#cl-member-signup-settings-page .mng-settings[data-type="collection"] .collection-add:focus {
  background: var(--cl-green-tint);
  border-color: var(--cl-green);
  color: var(--cl-green-text);
  outline: 0;
}

#cl-member-signup-settings-page .mng-settings[data-type="collection"] .collection-add:focus-visible {
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .13);
}

#cl-member-signup-settings-page .mng-settings[data-type="collection"] .collection-add svg {
  flex: none;
  width: 14px;
  height: 14px;
  margin: 0;
  fill: currentColor;
}

#cl-member-signup-settings-page .cl-source-legal-notice {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  width: 100%;
  max-width: 100%;
  margin: 0 0 20px;
  padding: 12px 14px;
  background: #fdf2f4;
  border-radius: var(--cl-radius-md);
  color: #97565f;
}

#cl-member-signup-settings-page .cl-source-legal-notice > .cl-source-legal-notice-icon {
  display: block;
  flex: 0 0 15px;
  width: 15px;
  height: 15px;
  margin: 3px 0 0;
  fill: #ee445f;
}

#cl-member-signup-settings-page .mngPoliciesInfo {
  flex: 1 1 auto;
  min-width: 0;
  min-height: 0;
  margin: 0;
  padding: 0;
  color: inherit;
  font-size: 12.5px;
  font-weight: 400;
  line-height: 20px;
}

#cl-member-signup-settings-page .mng-settings[data-type="policies"] .setting-sub-content-title {
  display: block;
  clear: both;
  width: 100%;
  margin: 0 0 8px;
  padding: 0;
  color: var(--cl-text);
  font-size: 13.5px;
  font-weight: 600;
  line-height: 20px;
}

#cl-member-signup-settings-page .mng-settings[data-type="policies"] .setting-text-box {
  width: 100%;
  margin: 0 0 22px;
  padding: 0;
  background: transparent;
  border: 0;
}

#cl-member-signup-settings-page .mng-settings[data-type="policies"] textarea {
  height: 110px;
  min-height: 110px;
}

#cl-member-signup-settings-page .mng-settings[data-type="policies"] p.privacy_join,
#cl-member-signup-settings-page .mng-settings[data-type="policies"] p.privacy_nonmem {
  clear: both;
  width: 100%;
  margin: 22px 0 8px;
  padding: 0;
  color: var(--cl-text);
  font-size: 13.5px;
  font-weight: 600;
  line-height: 20px;
}

#cl-member-signup-settings-page .mng-settings[data-type="policies"] textarea.privacy_join,
#cl-member-signup-settings-page .mng-settings[data-type="policies"] textarea.privacy_nonmem {
  width: 100%;
  margin: 0;
}

#cl-member-signup-settings-page .mng-bottom-btn-wrap.siteUM {
  float: none;
  width: 100%;
  margin: 0;
  padding: 0;
  text-align: left;
}

#cl-member-signup-settings-page .mng-bottom-btn-wrap.siteUM .btn,
#cl-member-signup-settings-page .mng-bottom-btn-wrap.siteUM .btn:hover,
#cl-member-signup-settings-page .mng-bottom-btn-wrap.siteUM .btn:focus {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 40px;
  margin: 0;
  padding: 0 18px;
  background: var(--cl-green);
  border: 1px solid var(--cl-green);
  border-radius: 6px;
  box-shadow: none;
  color: #fff;
  font-size: 13.5px;
  font-weight: 700;
  line-height: 1;
}

@media (max-width: 900px) {
  #cl-member-signup-settings-page {
    margin-right: 0;
    margin-left: 0;
  }
}

@media (max-width: 767px) {
  #cl-member-signup-settings-page .cl-source-signup-settings-header {
    flex-direction: column;
    gap: 12px;
  }

  #cl-member-signup-settings-page .cl-source-signup-settings-note {
    max-width: 100%;
    margin-top: 0;
  }
}

@media (max-width: 640px) {
  #cl-member-signup-settings-page {
    padding: 20px 14px 40px;
  }

  #cl-member-signup-settings-page .setting-sub-box {
    padding: 18px 14px;
  }

  #cl-member-signup-settings-page .collection-content-heading,
  #cl-member-signup-settings-page .collection-content .collection-item {
    min-width: 520px;
  }

  #cl-member-signup-settings-page .mng-settings[data-type="collection"] .mng-wrap {
    overflow-x: auto;
  }
}

@media (max-width: 480px) {
  .cl-dashboard-redesign #cl-member-signup-settings-page {
    --cl-collection-used-width: 44px;
    --cl-collection-required-width: 44px;
  }
}

/* ===== Member verify settings ===== */
#cl-member-verify-page {
  width: auto;
  max-width: none;
  margin-top: 0;
  margin-right: var(--cl-source-app-gutter);
  margin-left: calc(var(--cl-source-app-gutter) + var(--cl-source-sidebar-w));
  padding: 28px 32px 60px;
  background: transparent;
  color: var(--cl-text);
}

#cl-member-verify-page,
#cl-member-verify-page *,
#cl-member-verify-page *::before,
#cl-member-verify-page *::after {
  box-sizing: border-box;
}

#cl-member-verify-page > .dashbottom-container,
#cl-member-verify-page .cl-source-verify-content,
#cl-member-verify-page .cl-source-verify-form,
#cl-member-verify-page .cl-source-verify-settings,
#cl-member-verify-page .cl-source-verify-panel,
#cl-member-verify-page .cl-source-verify-box,
#cl-member-verify-page .cl-source-verify-wrap {
  float: none;
  width: 100%;
  max-width: none;
  min-height: 0;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}

#cl-member-verify-page > .dashbottom-container {
  margin-right: 0;
  margin-left: 0;
}

#cl-member-verify-page #section-top-menu,
#cl-member-verify-page .mobile-title,
#cl-member-verify-page .submenu_navWrap,
#cl-member-verify-page .cl-source-verify-box > .mng-title {
  display: none !important;
}

#cl-member-verify-page .cl-source-verify-header {
  display: block;
  width: 760px;
  max-width: 100%;
  margin: 0 0 23px;
}

#cl-member-verify-page .cl-source-member-breadcrumb {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 0;
  color: var(--cl-text);
  font-size: 20px;
  font-weight: 700;
  line-height: 28px;
}

#cl-member-verify-page .cl-source-member-breadcrumb .bc-link,
#cl-member-verify-page .cl-source-member-breadcrumb .current {
  display: inline;
  margin: 0;
  padding: 0;
  border: 0;
  color: var(--cl-text);
  font-size: inherit;
  font-weight: 700;
  line-height: inherit;
}

#cl-member-verify-page .cl-source-member-breadcrumb .current {
  color: var(--cl-text-sub);
}

#cl-member-verify-page .cl-source-member-breadcrumb .sep {
  color: var(--cl-text-muted);
  font-size: 23px;
  font-weight: 400;
  line-height: 1;
}

#cl-member-verify-page .cl-source-verify-description {
  display: block;
  margin: 11px 0 0;
  padding: 0;
  color: var(--cl-text-sub);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 20px;
}

#cl-member-verify-page .cl-source-verify-form,
#cl-member-verify-page .settingBtnSaveWrap {
  width: 760px;
  max-width: 100%;
}

#cl-member-verify-page .cl-source-verify-panel {
  padding: 24px;
  background: var(--cl-surface);
  border: 1px solid var(--cl-border);
  border-radius: var(--cl-radius-lg);
  box-shadow: var(--cl-shadow-panel);
}

#cl-member-verify-page .cl-source-verify-wrap > .mng-panel {
  float: none;
  width: 100%;
  min-height: 0;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

#cl-member-verify-page .cl-source-verify-intro {
  margin-bottom: 32px !important;
}

#cl-member-verify-page .cl-source-verify-intro > p.mb-15,
#cl-member-verify-page .cl-source-verify-key > p.mb-15 {
  margin: 0 0 14px !important;
  padding: 0;
  color: var(--cl-text);
  font-size: 15px;
  font-weight: 700;
  line-height: 22px;
}

#cl-member-verify-page .cl-source-verify-intro,
#cl-member-verify-page .cl-source-verify-intro p:not(.mb-15),
#cl-member-verify-page .cl-source-verify-key > p:not(.mb-15) {
  color: var(--cl-text-sub);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 1.8;
}

#cl-member-verify-page .cl-source-verify-intro .cert-btn,
#cl-member-verify-page .cl-source-verify-intro .cert-btn:hover,
#cl-member-verify-page .cl-source-verify-intro .cert-btn:focus {
  position: relative !important;
  top: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  width: auto !important;
  height: 35px !important;
  min-width: 0 !important;
  margin: 16px 8px 0 0 !important;
  padding: 0 20px !important;
  border-radius: var(--cl-radius-sm) !important;
  box-shadow: none !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  line-height: 18px !important;
  text-decoration: none !important;
  vertical-align: top !important;
  transform: none !important;
  outline: 0 !important;
}

#cl-member-verify-page .cl-source-verify-intro .cert-btn:first-of-type,
#cl-member-verify-page .cl-source-verify-intro .cert-btn:first-of-type:hover,
#cl-member-verify-page .cl-source-verify-intro .cert-btn:first-of-type:focus {
  background: var(--cl-green) !important;
  border: 1px solid var(--cl-green) !important;
  color: #fff !important;
}

#cl-member-verify-page .cl-source-verify-intro .cert-btn:last-of-type,
#cl-member-verify-page .cl-source-verify-intro .cert-btn:last-of-type:hover,
#cl-member-verify-page .cl-source-verify-intro .cert-btn:last-of-type:focus {
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  color: var(--cl-text) !important;
  font-weight: 600 !important;
}

#cl-member-verify-page .cl-source-verify-key {
  margin-bottom: 22px !important;
}

#cl-member-verify-page .cert-code-input {
  display: block;
  width: 420px;
  max-width: 100%;
  margin: 0 0 22px !important;
  padding: 0;
}

#cl-member-verify-page .cert-code-input > .mb-5 {
  display: flex;
  align-items: center;
  gap: 5px;
  width: 100%;
  min-height: 0;
  margin: 0 0 8px !important;
  padding: 0;
  color: var(--cl-text-sub);
  font-size: 13.5px;
  font-weight: 600;
  line-height: 20px;
}

#cl-member-verify-page .cert-code-input .cl-common-form-wrap,
#cl-member-verify-page .cert-code-input .cl-common-form-group {
  display: block;
  float: none;
  width: 100%;
  max-width: none;
  height: auto;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0 !important;
  border-radius: 0;
  box-shadow: none;
}

#cl-member-verify-page .cert-code-input .setting-input,
#cl-member-verify-page .cert-code-input .setting-input:hover,
#cl-member-verify-page .cert-code-input .setting-input:focus {
  display: block;
  float: none;
  width: 100%;
  max-width: none;
  height: 38px;
  margin: 0;
  padding: 9px 12px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: var(--cl-radius-sm);
  box-shadow: none;
  color: var(--cl-text);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 18px;
  outline: 0;
}

#cl-member-verify-page .cert-code-input .setting-input:focus {
  border-color: var(--cl-green);
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .1);
}

#cl-member-verify-page .cert-code-input .setting-input[readonly] {
  background: #fff;
  color: var(--cl-text);
}

#cl-member-verify-page .cert-code-input .setting-input:-webkit-autofill,
#cl-member-verify-page .cert-code-input .setting-input:-webkit-autofill:hover,
#cl-member-verify-page .cert-code-input .setting-input:-webkit-autofill:focus,
#cl-member-verify-page .cert-code-input .setting-input:-webkit-autofill:active {
  -webkit-box-shadow: 0 0 0 1000px #fff inset !important;
  box-shadow: 0 0 0 1000px #fff inset !important;
  -webkit-text-fill-color: var(--cl-text) !important;
  caret-color: var(--cl-text);
  transition: background-color 9999s ease-out 0s;
}

#cl-member-verify-page .cert-code-input .error {
  display: flex;
  align-items: center;
  gap: 5px;
  margin: 5px 0 0;
  padding-left: 5px;
  color: var(--cl-danger);
  font-size: 12px;
  font-weight: 400;
  line-height: 18px;
}

#cl-member-verify-page .cert-code-input .error.hide {
  display: none !important;
}

#cl-member-verify-page .cert-code-input .error svg {
  flex: 0 0 13px;
  width: 13px;
  height: 13px;
  fill: currentColor;
}

#cl-member-verify-page .cl-source-verify-option {
  margin-bottom: 18px !important;
}

#cl-member-verify-page .cl-source-verify-option:last-child {
  margin-bottom: 0 !important;
}

#cl-member-verify-page .mng-panel-label {
  display: flex;
  align-items: center;
  gap: 5px;
  width: 100%;
  margin: 0 0 8px;
  padding: 0;
  color: var(--cl-text-sub);
  font-size: 13.5px;
  font-weight: 600;
  line-height: 20px;
}

#cl-member-verify-page .mng-panel-label .cm-popover-info {
  display: block;
  flex: 0 0 13px;
  width: 13px;
  height: 13px;
  margin: 0;
  fill: var(--cl-accent-blue);
  transform: none !important;
}

#cl-member-verify-page .setting-sub-content-radio-box {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 22px;
  float: none;
  width: 100%;
  min-height: 0;
  margin: 0 0 18px;
  padding: 0;
  color: var(--cl-text-sub);
  background: transparent;
  border: 0;
}

#cl-member-verify-page .setting-sub-content-radio-box > div,
#cl-member-verify-page .setting-sub-content-radio-box .newcheckbox,
#cl-member-verify-page .setting-sub-content-radio-box label {
  display: flex;
  align-items: center;
  float: none;
  width: auto;
  min-height: 0;
  margin: 0;
  padding: 0;
  color: inherit;
  font-size: 13.5px;
  font-weight: 400;
  line-height: 1;
}

#cl-member-verify-page .setting-sub-content-radio-box label {
  gap: 6px;
  cursor: pointer;
}

#cl-member-verify-page .newcheckboxSvgRadio {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 15px;
  width: 15px;
  height: 15px;
  margin: 0;
}

#cl-member-verify-page .newcheckboxSvgRadio input[type="radio"] {
  position: absolute;
  inset: 0;
  width: 15px;
  height: 15px;
  margin: 0;
  opacity: 0;
  cursor: inherit;
}

#cl-member-verify-page .newcheckboxSvgRadio svg {
  display: block;
  width: 15px;
  height: 15px;
  margin: 0;
  fill: #aeb4be;
}

#cl-member-verify-page .newcheckboxSvgRadio svg.active {
  display: none;
  fill: var(--cl-green);
}

#cl-member-verify-page .newcheckboxSvgRadio input[type="radio"]:checked ~ svg {
  display: none;
}

#cl-member-verify-page .newcheckboxSvgRadio input[type="radio"]:checked ~ svg.active {
  display: block;
}

#cl-member-verify-page .cl-source-verify-option.disabled {
  opacity: 1;
}

#cl-member-verify-page .cl-source-verify-option.disabled .mng-panel-label,
#cl-member-verify-page .cl-source-verify-option.disabled .setting-sub-content-radio-box {
  color: var(--cl-text-muted);
}

#cl-member-verify-page .cl-source-verify-option.disabled label {
  cursor: default;
}

#cl-member-verify-page .cl-source-verify-option.disabled .newcheckboxSvgRadio svg,
#cl-member-verify-page .newcheckboxSvgRadio input[type="radio"]:disabled ~ svg {
  fill: #c9cdd4;
}

#cl-member-verify-page .cl-source-verify-option.disabled .newcheckboxSvgRadio svg.active,
#cl-member-verify-page .newcheckboxSvgRadio input[type="radio"]:disabled ~ svg.active {
  fill: #aeb4be;
}

#cl-member-verify-page .settingBtnSaveWrap {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  float: none;
  margin: 16px 0 0;
  padding: 0;
  text-align: right;
}

#cl-member-verify-page .settingBtnSaveWrap .setting-button,
#cl-member-verify-page .settingBtnSaveWrap .setting-button:hover,
#cl-member-verify-page .settingBtnSaveWrap .setting-button:focus {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  min-width: 0;
  height: auto;
  margin: 0;
  padding: 11px 24px;
  background: var(--cl-green);
  border: 0;
  border-radius: var(--cl-radius-sm);
  box-shadow: none;
  color: #fff;
  font-size: 13.5px;
  font-weight: 600;
  line-height: 18px;
}

#cl-member-verify-page .settingBtnSaveWrap .setting-button.member_disabled {
  background: #c9cdd3;
  cursor: default;
}

#cl-member-verify-page .popover {
  z-index: 1400;
  max-width: min(420px, calc(100vw - 32px));
}

@media (max-width: 900px) {
  #cl-member-verify-page {
    margin-right: 0;
    margin-left: 0;
  }
}

@media (max-width: 640px) {
  #cl-member-verify-page {
    padding: 20px 14px 40px;
  }

  #cl-member-verify-page .cl-source-verify-panel {
    padding: 20px 18px;
  }

  #cl-member-verify-page .setting-sub-content-radio-box {
    gap: 14px;
  }
}

@media (max-width: 1190px) {
  body.cl-dashboard-redesign-page #cl-member-verify-page {
    padding-bottom: 90px !important;
  }
}

/* ===== Member social login ===== */
#cl-member-social-login-page {
  width: auto;
  max-width: none;
  margin-top: 0;
  margin-right: var(--cl-source-app-gutter);
  margin-left: calc(var(--cl-source-app-gutter) + var(--cl-source-sidebar-w));
  padding: 28px 32px 60px;
  background: transparent;
  color: var(--cl-text);
}

#cl-member-social-login-page,
#cl-member-social-login-page * {
  box-sizing: border-box;
}

#cl-member-social-login-page > .dashbottom-container,
#cl-member-social-login-page .cl-source-social-content,
#cl-member-social-login-page .cl-source-social-settings {
  float: none;
  width: 100%;
  max-width: none;
  min-height: 0;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}

#cl-member-social-login-page > .dashbottom-container {
  margin-right: 0;
  margin-left: 0;
}

#cl-member-social-login-page #section-top-menu,
#cl-member-social-login-page .mobile-title,
#cl-member-social-login-page .submenu_navWrap {
  display: none !important;
}

#cl-member-social-login-page .cl-source-social-header {
  display: block;
  width: 760px;
  max-width: 100%;
  margin: 0 0 23px;
}

#cl-member-social-login-page .cl-source-member-breadcrumb {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 0;
  color: var(--cl-text);
  font-size: 20px;
  font-weight: 700;
  line-height: 28px;
}

#cl-member-social-login-page .cl-source-member-breadcrumb .bc-link,
#cl-member-social-login-page .cl-source-member-breadcrumb .current {
  display: inline;
  margin: 0;
  padding: 0;
  border: 0;
  color: var(--cl-text);
  font-size: inherit;
  font-weight: 700;
  line-height: inherit;
}

#cl-member-social-login-page .cl-source-member-breadcrumb .current {
  color: var(--cl-text-sub);
}

#cl-member-social-login-page .cl-source-member-breadcrumb .sep {
  color: var(--cl-text-muted);
  font-size: 23px;
  font-weight: 400;
  line-height: 1;
}

#cl-member-social-login-page .cl-source-social-description {
  display: block;
  margin: 11px 0 0;
  padding: 0;
  color: var(--cl-text-sub);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 20px;
}

#cl-member-social-login-page .cl-source-social-content form,
#cl-member-social-login-page .cl-source-social-panel,
#cl-member-social-login-page .cl-source-social-save {
  width: 760px;
  max-width: 100%;
}

#cl-member-social-login-page .cl-source-social-panel {
  float: none;
  margin: 0;
  padding: 22px 24px;
  background: var(--cl-surface);
  border: 1px solid var(--cl-border);
  border-radius: var(--cl-radius-lg);
  box-shadow: var(--cl-shadow-panel);
}

#cl-member-social-login-page .cl-social-reg-list {
  display: block;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
}

#cl-member-social-login-page [data-social-status],
#cl-member-social-login-page [data-social-field] {
  display: none !important;
}

#cl-member-social-login-page .mkt-reg {
  display: flex;
  align-items: center;
  gap: 14px;
  width: 100%;
  min-width: 0;
  margin: 0;
  padding: 16px 0;
  border-bottom: 1px solid #f2f3f5;
}

#cl-member-social-login-page .mkt-reg:first-child {
  padding-top: 0;
}

#cl-member-social-login-page .mkt-reg:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}

#cl-member-social-login-page .mkt-reg.editing {
  align-items: flex-start;
}

#cl-member-social-login-page .mkt-reg.editing .mkt-reg-name {
  flex-direction: column;
  align-items: flex-start;
  gap: 0;
}

#cl-member-social-login-page .mkt-reg-name {
  display: flex;
  flex: none;
  align-items: center;
  gap: 9px;
  width: 210px;
  min-width: 0;
  color: var(--cl-text);
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
}

#cl-member-social-login-page .sl-nm {
  display: flex;
  align-items: center;
  gap: 9px;
}

#cl-member-social-login-page .mkt-reg-ico {
  display: inline-flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  overflow: hidden;
  border-radius: 5px;
  color: #fff;
  font-size: 12px;
  font-weight: 800;
}

#cl-member-social-login-page .mkt-reg-ico img,
#cl-member-social-login-page .mkt-reg-ico svg {
  display: block;
  width: 20px;
  height: 20px;
  object-fit: contain;
  flex: none;
}

#cl-member-social-login-page .mkt-reg-name .mkt-help {
  position: relative;
  display: inline-flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  padding: 0;
  border: 0;
  border-radius: var(--r-xs, 4px);
  background-image: none;
  background: transparent;
  color: var(--cl-green);
  font-size: 0;
  line-height: 0;
  cursor: help;
  appearance: none;
  -webkit-appearance: none;
}

#cl-member-social-login-page .mkt-reg-name .mkt-help svg {
  display: block;
  width: 14px;
  height: 14px;
  fill: none;
  stroke: currentColor;
}

body.cl-dashboard-redesign-page #cl-member-social-login-page .mkt-help:hover,
body.cl-dashboard-redesign-page #cl-member-social-login-page .mkt-help:focus-visible {
  background: transparent;
  box-shadow: none;
  outline: 0;
}

@media (pointer: coarse) {
  body.cl-dashboard-redesign-page #cl-member-social-login-page .mkt-reg-name .mkt-help {
    width: 20px;
    height: 20px;
  }

  body.cl-dashboard-redesign-page #cl-member-social-login-page .mkt-reg-name .mkt-help::after {
    content: "";
    position: absolute;
    inset: -12px;
  }
}

#cl-member-social-login-page .mkt-reg-state {
  flex: 1 1 auto;
  min-width: 0;
  color: var(--cl-text-muted);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 20px;
}

#cl-member-social-login-page .toggle-lg,
#cl-member-social-login-page .mkt-reg-toggle {
  position: relative;
  display: inline-flex;
  flex: none;
  align-items: center;
  justify-content: flex-start;
  width: 36px;
  height: 20px;
  margin: 0;
  padding: 0;
  overflow: visible;
  background: #aeb4bd;
  border: 0;
  border-radius: 999px;
  box-shadow: none;
  color: inherit;
  font: inherit;
  line-height: 1;
  cursor: pointer;
  appearance: none;
  transition: background-color .15s;
}

#cl-member-social-login-page .toggle-lg:hover,
#cl-member-social-login-page .toggle-lg:focus,
#cl-member-social-login-page .mkt-reg-toggle:hover,
#cl-member-social-login-page .mkt-reg-toggle:focus {
  border: 0;
  box-shadow: none;
  outline: 0;
}

#cl-member-social-login-page .toggle-knob-lg {
  position: absolute;
  top: 2px;
  left: 2px;
  display: block;
  width: 16px;
  height: 16px;
  background: #fff;
  border-radius: 50%;
  box-shadow: 0 1px 3px rgba(20, 24, 32, .2);
  transition: left .15s;
}

#cl-member-social-login-page .mkt-reg-toggle.on {
  background: var(--cl-green);
}

#cl-member-social-login-page .mkt-reg-toggle.on .toggle-knob-lg {
  left: 18px;
}

#cl-member-social-login-page .mkt-reg-toggle.disabled,
#cl-member-social-login-page .mkt-reg-toggle:disabled {
  background: #dfe3e8;
  cursor: default;
}

#cl-member-social-login-page .mkt-reg-off {
  display: inline-flex;
  align-items: center;
  margin-right: 8px;
  padding: 3px 9px;
  background: #edeff2;
  border-radius: 999px;
  color: var(--cl-text-sub);
  font-size: 11.5px;
  font-weight: 700;
  line-height: 16px;
  vertical-align: 1px;
}

#cl-member-social-login-page .mkt-reg-code {
  color: var(--cl-text-sub);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 13px;
  line-height: 20px;
  word-break: break-all;
}

#cl-member-social-login-page .mkt-reg-state.is-off .mkt-reg-code {
  color: var(--cl-text-muted);
}

#cl-member-social-login-page .mkt-reg-edit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  margin: 0 0 0 6px;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 6px;
  box-shadow: none;
  color: var(--cl-text-muted);
  cursor: pointer;
  vertical-align: -4px;
  opacity: 0;
  pointer-events: none;
  transition: color .12s, background .12s;
}

#cl-member-social-login-page .mkt-reg:hover .mkt-reg-edit,
#cl-member-social-login-page .mkt-reg-edit:focus-visible {
  opacity: 1;
  pointer-events: auto;
}

@media (hover: none) {
  #cl-member-social-login-page .mkt-reg-edit {
    opacity: 1;
    pointer-events: auto;
  }
}

#cl-member-social-login-page .mkt-reg-edit svg {
  display: block;
  width: 16px;
  height: 16px;
}

#cl-member-social-login-page .mkt-reg-edit:hover,
#cl-member-social-login-page .mkt-reg-edit:focus-visible {
  background: var(--cl-green-tint);
  color: var(--cl-green);
}

#cl-member-social-login-page .mkt-reg-edit:focus-visible {
  outline: 2px solid var(--cl-green);
  outline-offset: 2px;
}

#cl-member-social-login-page .mkt-reg-editor {
  display: flex;
  flex-direction: column;
  gap: 7px;
  max-width: 520px;
}

#cl-member-social-login-page .sl-edit {
  display: flex;
  flex-direction: column;
  gap: 15px;
  max-width: 520px;
}

#cl-member-social-login-page .sl-edit .social-field {
  max-width: none;
  margin: 0;
}

#cl-member-social-login-page .sl-edit .social-field label {
  display: block;
  margin: 0 0 5px;
  color: var(--cl-text-sub);
  font-size: 12px;
  font-weight: 600;
  line-height: 17px;
}

#cl-member-social-login-page .mre-row {
  display: flex;
  align-items: center;
  gap: 8px;
  max-width: 470px;
}

#cl-member-social-login-page .sf-field {
  position: relative;
  display: flex;
  flex: 1 1 auto;
  align-items: center;
  min-width: 0;
}

#cl-member-social-login-page .sf-field input {
  display: block;
  width: 100%;
  height: 38px;
  margin: 0;
  padding: 10px 34px 10px 12px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: var(--cl-radius-sm);
  box-shadow: none;
  color: var(--cl-text);
  font-family: inherit;
  font-size: 13.5px;
  font-weight: 400;
  line-height: 18px;
  outline: 0;
}

#cl-member-social-login-page .sf-field input::placeholder {
  color: var(--cl-text-muted);
}

#cl-member-social-login-page .sf-field input:focus {
  border-color: var(--cl-green);
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .12);
}

#cl-member-social-login-page .mre-clear {
  position: absolute;
  right: 7px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 5px;
  box-shadow: none;
  color: var(--cl-text-muted);
  cursor: pointer;
  transition: background .12s, color .12s;
}

#cl-member-social-login-page .mre-clear:hover,
#cl-member-social-login-page .mre-clear:focus {
  background: #f1f2f5;
  color: var(--cl-text);
  outline: 0;
}

#cl-member-social-login-page .mre-clear svg {
  width: 12px;
  height: 12px;
}

#cl-member-social-login-page .mre-ok {
  display: inline-flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  margin: 0;
  padding: 0;
  background: var(--cl-green);
  border: 1px solid var(--cl-green);
  border-radius: var(--cl-radius-sm);
  box-shadow: none;
  color: #fff;
  cursor: pointer;
  transition: background .12s, border-color .12s;
}

#cl-member-social-login-page .mre-ok:hover,
#cl-member-social-login-page .mre-ok:focus {
  background: var(--cl-green-hover, #02b853);
  border-color: var(--cl-green-hover, #02b853);
  outline: 0;
}

#cl-member-social-login-page .mre-ok svg {
  width: 16px;
  height: 16px;
}

#cl-member-social-login-page .mre-hint,
#cl-member-social-login-page .mre-msg {
  max-width: 470px;
  margin-top: 5px;
  color: var(--cl-text-muted);
  font-size: 12px;
  font-weight: 400;
  line-height: 1.55;
  word-break: break-all;
}

#cl-member-social-login-page .mre-hint:empty,
#cl-member-social-login-page .mre-msg:empty {
  display: none;
}

#cl-member-social-login-page .mre-msg.warn {
  color: #b26a00;
  font-weight: 600;
}

#cl-member-social-login-page .mre-msg.err {
  color: #d64545;
  font-weight: 600;
}

#cl-member-social-login-page .sf-field.invalid input,
#cl-member-social-login-page .sf-field.invalid input:focus {
  border-color: #d64545;
  box-shadow: 0 0 0 3px rgba(214, 69, 69, .14);
}

#cl-member-social-login-page .sf-field.invalid {
  animation: socialMreShake .34s cubic-bezier(.36, .07, .19, .97);
}

@keyframes socialMreShake {
  10%, 90% { transform: translateX(-2px); }
  20%, 80% { transform: translateX(3px); }
  30%, 50%, 70% { transform: translateX(-5px); }
  40%, 60% { transform: translateX(5px); }
}

#cl-member-social-login-page .social-field .sf-done {
  display: none;
  align-items: center;
  min-height: 38px;
}

#cl-member-social-login-page .social-field.is-done .sf-done {
  display: flex;
}

#cl-member-social-login-page .social-field.is-done .mre-row,
#cl-member-social-login-page .social-field.is-done .mre-hint {
  display: none;
}

#cl-member-social-login-page .sl-links {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 7px;
  margin-top: 12px;
}

#cl-member-social-login-page .mkt-reg:not(.editing) .sl-links {
  display: none;
}

#cl-member-social-login-page .sl-guide {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  width: auto;
  min-width: 0;
  height: auto;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  color: var(--cl-green-text);
  font-family: inherit;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.5;
  text-align: left;
  text-decoration: none;
  word-break: keep-all;
  cursor: pointer;
  transition: color .12s;
}

#cl-member-social-login-page .sl-guide svg {
  position: relative;
  top: .5px;
  display: block;
  flex: none;
  width: 11px;
  height: 11px;
  color: var(--cl-green);
  transition: transform .13s;
}

@media (hover: hover) and (pointer: fine) {
  #cl-member-social-login-page .sl-guide:hover {
    text-decoration: underline;
    text-underline-offset: 3px;
  }

  #cl-member-social-login-page .sl-guide:hover svg {
    transform: translateX(2px);
  }
}

#cl-member-social-login-page .sl-guide:focus-visible {
  border-radius: 4px;
  outline: 2px solid var(--cl-green);
  outline-offset: 3px;
}

#cl-member-social-login-page .cl-source-social-save {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  float: none;
  margin: 16px 0 0;
  padding: 0;
}

#cl-member-social-login-page .cl-source-social-save .setting-button,
#cl-member-social-login-page .cl-source-social-save .setting-button:hover,
#cl-member-social-login-page .cl-source-social-save .setting-button:focus {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  min-width: 0;
  height: auto;
  margin: 0;
  padding: 11px 24px;
  background: var(--cl-green);
  border: 0;
  border-radius: var(--cl-radius-sm);
  box-shadow: none;
  color: #fff;
  font-size: 13.5px;
  font-weight: 600;
  line-height: 18px;
}

#cl-member-social-login-page .cl-source-social-save .setting-button.member_disabled {
  background: #c9cdd3;
  cursor: default;
}

@media (prefers-reduced-motion: reduce) {
  #cl-member-social-login-page .sf-field.invalid {
    animation: none;
  }
}

@media (max-width: 1180px) {
  #cl-member-social-login-page .mkt-reg.editing {
    flex-wrap: wrap;
  }

  #cl-member-social-login-page .mkt-reg.editing .mkt-reg-state {
    flex: 1 1 100%;
    order: 3;
  }

  #cl-member-social-login-page .mkt-reg.editing .mkt-reg-editor,
  #cl-member-social-login-page .mkt-reg.editing .sl-edit {
    max-width: none;
  }
}

@media (max-width: 900px) {
  #cl-member-social-login-page {
    margin-right: 0;
    margin-left: 0;
  }
}

@media (max-width: 640px) {
  #cl-member-social-login-page {
    padding: 20px 14px 40px;
  }

  #cl-member-social-login-page .cl-source-social-panel {
    padding: 18px 16px;
  }

  #cl-member-social-login-page .mkt-reg {
    align-items: flex-start;
    flex-wrap: wrap;
  }

  #cl-member-social-login-page .mkt-reg-name {
    flex: 1 1 calc(100% - 50px);
    width: auto;
  }

  #cl-member-social-login-page .mkt-reg-toggle {
    order: 2;
  }

  #cl-member-social-login-page .mkt-reg.editing .mkt-reg-toggle {
    align-self: flex-start;
    margin-top: 0 !important;
  }

  #cl-member-social-login-page .mkt-reg-state {
    flex: 1 1 100%;
    order: 3;
  }

  #cl-member-social-login-page .mkt-reg-editor,
  #cl-member-social-login-page .sl-edit,
  #cl-member-social-login-page .mre-row,
  #cl-member-social-login-page .mre-hint,
  #cl-member-social-login-page .mre-msg {
    width: 100%;
    max-width: none;
  }
}

/* Social login setup guide modal */
body.cl-dashboard-redesign-page .cl-source-social-guide-root + .modal-backdrop {
  display: none !important;
  opacity: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-modal,
body.cl-dashboard-redesign-page .cl-source-social-guide-modal * {
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-modal {
  position: fixed !important;
  inset: 0 !important;
  z-index: 1200 !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
  width: 100vw !important;
  height: 100vh !important;
  padding: 2.6vh 20px !important;
  overflow: hidden !important;
  background: rgba(14, 18, 25, .62) !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-modal > .cl-mobile-btn {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-modal > .modal-dialog {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  display: block !important;
  width: min(calc(100vw - 40px), 1280px) !important;
  max-width: none !important;
  height: 94.8vh !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-modal .modal-dialog > .modal-content {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: var(--cl-surface) !important;
  border: 0 !important;
  border-radius: 14px !important;
  box-shadow: 0 20px 50px rgba(20, 24, 32, .25) !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-modal .modal-dialog > .modal-content > .close {
  position: absolute !important;
  top: 14px !important;
  right: 14px !important;
  z-index: 40 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub) !important;
  opacity: 1 !important;
  cursor: pointer !important;
  transition: color .15s, background .15s, transform .18s cubic-bezier(.34, 1.56, .64, 1) !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-modal .modal-dialog > .modal-content > .close:hover,
body.cl-dashboard-redesign-page .cl-source-social-guide-modal .modal-dialog > .modal-content > .close:focus {
  background: #f1f2f5 !important;
  color: var(--cl-text) !important;
  outline: 0 !important;
  transform: rotate(90deg) !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-modal .modal-dialog > .modal-content > .close svg {
  display: block !important;
  width: 15px !important;
  height: 15px !important;
  fill: currentColor !important;
  stroke: currentColor !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-modal .modal-dialog .modal-body {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guide-top {
  position: relative !important;
  inset: auto !important;
  z-index: 2 !important;
  flex: 0 0 auto !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: var(--cl-surface) !important;
  border-bottom: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guide-top .guidetitle {
  display: flex !important;
  align-items: center !important;
  height: 58px !important;
  margin: 0 !important;
  padding: 0 64px 0 24px !important;
  border-bottom: 1px solid var(--cl-bg-3, #f1f2f5) !important;
  color: var(--cl-text) !important;
  font-size: 16px !important;
  font-weight: 800 !important;
  line-height: 26px !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guide-top .guide-menu {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guide-menu ul {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 28px !important;
  counter-reset: cl-social-guide-step !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 16px 24px !important;
  overflow: visible !important;
  background: var(--cl-surface) !important;
  border: 0 !important;
  border-bottom: 1px solid var(--cl-border) !important;
  border-radius: 0 !important;
  list-style: none !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guide-menu ul li {
  position: relative !important;
  left: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0 !important;
  flex: 1 1 0 !important;
  width: auto !important;
  min-width: 0 !important;
  height: 70px !important;
  margin: 0 !important;
  padding: 3px 8px 0 !important;
  background: var(--cl-surface) !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 14px !important;
  color: var(--cl-text-sub) !important;
  counter-increment: cl-social-guide-step !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guide-menu ul li::before {
  content: none !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guide-menu ul li:hover {
  background: var(--cl-surface) !important;
  border-color: var(--cl-text-muted) !important;
  color: var(--cl-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guide-menu ul li.active {
  background: var(--cl-surface) !important;
  border: 2px solid var(--cl-green) !important;
  color: var(--cl-green-text) !important;
  box-shadow: 0 0 0 4px rgba(3, 199, 90, .14) !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guide-menu ul li.active::before {
  content: none !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guide-menu ul li.active::after {
  content: none !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guide-menu ul li p,
body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guide-menu ul li.active p {
  position: static !important;
  display: block !important;
  max-width: 100% !important;
  margin: 0 !important;
  overflow: hidden !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1.5 !important;
  text-align: center !important;
  text-overflow: clip !important;
  white-space: normal !important;
  word-break: keep-all !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guide-menu ul li.active p {
  color: var(--cl-green-text) !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guide-menu ul li .line {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guide-wrap {
  position: relative !important;
  inset: auto !important;
  z-index: 1 !important;
  flex: 1 1 auto !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  background: var(--cl-surface) !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guide-wrap .step {
  display: block !important;
  counter-reset: cl-social-guide-section !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 34px 28px 90px !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guide-wrap .step > [id^="step"] {
  counter-increment: cl-social-guide-section !important;
  width: 100% !important;
  max-width: 900px !important;
  margin: 0 auto !important;
  padding: 6px 0 34px !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guide-wrap .step > [id^="step"] + [id^="step"] {
  padding-top: 36px !important;
  border-top: 1px solid var(--cl-border) !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guide-wrap .step h3 {
  display: flex !important;
  align-items: center !important;
  margin: 0 0 22px !important;
  color: var(--cl-text) !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  line-height: 24px !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guide-wrap .step > [id^="step"] > h3::before {
  content: counter(cl-social-guide-section) !important;
  display: inline-flex !important;
  flex: 0 0 22px !important;
  align-items: center !important;
  justify-content: center !important;
  width: 22px !important;
  height: 22px !important;
  margin-right: 8px !important;
  background: var(--cl-green) !important;
  border-radius: 50% !important;
  color: #fff !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guide-wrap .step p,
body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guide-wrap .step #step2 p {
  margin: 14px 0 20px !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 1.65 !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guide-wrap .step img {
  display: block !important;
  max-width: 100% !important;
  height: auto !important;
  margin: 0 auto 18px !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-modal .socialLoginSmallStep {
  display: block !important;
  margin: 0 0 20px !important;
  padding: 14px 16px 14px 34px !important;
  background: #fafbfc !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  line-height: 1.6 !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-modal .socialLoginSmallStep li {
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-modal .socialLoginSmallStep li + li {
  margin-top: 6px !important;
}

/* 채널 연동 설정 팝업 위에 중첩되는 가이드의 부모 레이어도 함께 올린다. */
body.cl-dashboard-redesign-page .flat-modal.cl-source-kakao-notice-guide-root {
  position: fixed;
  inset: 0;
  z-index: 1000005;
}

body.cl-dashboard-redesign-page .cl-source-kakao-notice-guide-root + .modal-backdrop {
  display: none !important;
  opacity: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-modal.cl-source-kakao-notice-guide-modal {
  z-index: 1000005 !important;
  --cl-source-notification-guide-content-width: 540px;
}

body.cl-dashboard-redesign-page .cl-source-kakao-notice-guide-modal .guide-menu ul {
  counter-reset: cl-kakao-notice-guide-step !important;
  gap: 30px !important;
  min-height: 104px !important;
  padding: 16px 24px !important;
}

body.cl-dashboard-redesign-page .cl-source-kakao-notice-guide-modal .guide-menu ul li {
  flex: 0 0 150px !important;
  gap: 4px !important;
  counter-increment: cl-kakao-notice-guide-step !important;
  width: 150px !important;
  height: 70px !important;
  padding: 0 14px !important;
  border-radius: 12px !important;
}

body.cl-dashboard-redesign-page .cl-source-kakao-notice-guide-modal .guide-menu ul li::before,
body.cl-dashboard-redesign-page .cl-source-kakao-notice-guide-modal .guide-menu ul li.active::before {
  content: counter(cl-kakao-notice-guide-step) "." !important;
  display: inline !important;
  flex: none !important;
  width: auto !important;
  height: auto !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: inherit !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}

body.cl-dashboard-redesign-page .cl-source-kakao-notice-guide-modal .guide-menu ul li::after,
body.cl-dashboard-redesign-page .cl-source-kakao-notice-guide-modal .guide-menu ul li.active::after {
  content: "" !important;
  position: absolute !important;
  top: 50% !important;
  right: -19px !important;
  bottom: auto !important;
  left: auto !important;
  display: block !important;
  width: 7px !important;
  height: 7px !important;
  background: transparent !important;
  border-top: 1px solid var(--cl-green-line) !important;
  border-right: 1px solid var(--cl-green-line) !important;
  transform: translateY(-50%) rotate(45deg) !important;
}

body.cl-dashboard-redesign-page .cl-source-kakao-notice-guide-modal .guide-menu ul li:last-child::after {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-kakao-notice-guide-modal .guide-wrap.kakaoguide .step {
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-kakao-notice-guide-modal .guide-wrap .step > [id^="step"],
body.cl-dashboard-redesign-page .cl-source-kakao-notice-guide-modal.guidePopup .guide-wrap.kakaoguide .step #step1,
body.cl-dashboard-redesign-page .cl-source-kakao-notice-guide-modal.guidePopup .guide-wrap.kakaoguide .step #step2,
body.cl-dashboard-redesign-page .cl-source-kakao-notice-guide-modal.guidePopup .guide-wrap.kakaoguide .step #step3 {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: var(--cl-source-notification-guide-content-width) !important;
  margin: 0 auto !important;
  padding: 0 0 28px !important;
  overflow: visible !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-kakao-notice-guide-modal .guideClose,
body.cl-dashboard-redesign-page .cl-source-kakao-notice-guide-modal .modal-footer.guideClose {
  box-sizing: border-box !important;
  width: min(var(--cl-source-notification-guide-content-width), calc(100% - 60px)) !important;
  max-width: var(--cl-source-notification-guide-content-width) !important;
  margin: 0 auto !important;
  padding-right: 0 !important;
  padding-left: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-kakao-notice-guide-modal .guide-wrap .step > [id^="step"] + [id^="step"] {
  padding-top: 28px !important;
  border-top: 1px solid var(--cl-border) !important;
}

body.cl-dashboard-redesign-page .cl-source-kakao-notice-guide-modal .guide-wrap.kakaoguide .step h3 {
  margin: 0 0 18px !important;
  color: var(--cl-text) !important;
  font-size: 17px !important;
  font-weight: 800 !important;
  line-height: 24px !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-kakao-notice-guide-modal .guide-wrap.kakaoguide .step p,
body.cl-dashboard-redesign-page .cl-source-kakao-notice-guide-modal .guide-wrap.kakaoguide .step p.star,
body.cl-dashboard-redesign-page .cl-source-kakao-notice-guide-modal .guide-wrap.kakaoguide .step p.kakaoguide-review-result,
body.cl-dashboard-redesign-page .cl-source-kakao-notice-guide-modal .guide-wrap.kakaoguide .step p.kakaoguide-channel-info {
  display: block !important;
  float: none !important;
  clear: both !important;
  box-sizing: border-box !important;
  width: 100% !important;
  margin: 12px 0 14px !important;
  padding: 13px 14px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 10px !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.65 !important;
  letter-spacing: 0 !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-kakao-notice-guide-modal .guide-wrap.kakaoguide .step p .guide_bold,
body.cl-dashboard-redesign-page .cl-source-kakao-notice-guide-modal .guide-wrap.kakaoguide .step p .kakaoguide-step-line,
body.cl-dashboard-redesign-page .cl-source-kakao-notice-guide-modal .guide-wrap.kakaoguide .step p .kakaoguide-star-line {
  color: inherit !important;
  letter-spacing: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-kakao-notice-guide-modal .guide-wrap.kakaoguide .step p .guide_bold {
  color: var(--cl-text) !important;
  font-weight: 800 !important;
}

body.cl-dashboard-redesign-page .cl-source-kakao-notice-guide-modal .guide-wrap.kakaoguide .step p.star .kakaoguide-star-line + .kakaoguide-star-line,
body.cl-dashboard-redesign-page .cl-source-kakao-notice-guide-modal .guide-wrap.kakaoguide .step p .kakaoguide-step-line + .kakaoguide-step-line {
  margin-top: 8px !important;
}

body.cl-dashboard-redesign-page .cl-source-kakao-notice-guide-modal .guide-wrap.kakaoguide .step p.star svg,
body.cl-dashboard-redesign-page .cl-source-kakao-notice-guide-modal .guide-wrap.kakaoguide .step .kakaoguide-document-note svg {
  flex: 0 0 12px !important;
  width: 12px !important;
  height: 12px !important;
  margin-right: 4px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .cl-source-kakao-notice-guide-modal .guide-wrap.kakaoguide .step img {
  display: block !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  margin: 0 0 18px !important;
  background: #fafbfc !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
}

body.cl-dashboard-redesign-page .cl-source-kakao-notice-guide-modal .guide-wrap.kakaoguide .step .kakaoguide-document-box,
body.cl-dashboard-redesign-page .cl-source-kakao-notice-guide-modal .guide-wrap.kakaoguide .step .kakaoguide-info-box {
  display: block !important;
  float: none !important;
  clear: both !important;
  box-sizing: border-box !important;
  width: 100% !important;
  margin: 12px 0 18px !important;
  padding: 13px 14px !important;
  overflow: visible !important;
  background: #fafbfc !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 10px !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  line-height: 1.65 !important;
  letter-spacing: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-kakao-notice-guide-modal .guide-wrap.kakaoguide .step .kakaoguide-info-box > div {
  width: 100% !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-kakao-notice-guide-modal .guide-wrap.kakaoguide .step .kakaoguide-document-title {
  display: block !important;
  margin: 12px 0 0 !important;
  color: var(--cl-text) !important;
  font-weight: 800 !important;
}

body.cl-dashboard-redesign-page .cl-source-kakao-notice-guide-modal .guide-wrap.kakaoguide .step .kakaoguide-document-title:first-child {
  margin-top: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-kakao-notice-guide-modal .guide-wrap.kakaoguide .step .kakaoguide-document-line,
body.cl-dashboard-redesign-page .cl-source-kakao-notice-guide-modal .guide-wrap.kakaoguide .step .kakaoguide-document-note {
  display: block !important;
  margin-top: 6px !important;
}

body.cl-dashboard-redesign-page .cl-source-kakaosync-guide-modal .guide-wrap .sub-title {
  margin: 26px 0 12px !important;
  color: var(--cl-text) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 22px !important;
}

body.cl-dashboard-redesign-page .cl-source-kakaosync-guide-modal .guide-wrap .guide-alert {
  margin: 16px 0 22px !important;
  padding: 11px 13px !important;
  background: #fdf2f4 !important;
  border: 1px solid #f4dce0 !important;
  border-radius: 8px !important;
  color: #97565f !important;
}

body.cl-dashboard-redesign-page .cl-source-kakaosync-guide-modal .guide-wrap .guide-lead {
  margin-top: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-kakaosync-guide-modal .guide-wrap .step > [id^="step"] {
  clear: both !important;
  display: flow-root !important;
}

body.cl-dashboard-redesign-page .cl-source-kakaosync-guide-modal .guide-wrap .step > .devide-line {
  clear: both !important;
}

body.cl-dashboard-redesign-page .cl-source-kakaosync-guide-modal .guide-wrap .step > [id^="step"] > h3 {
  box-sizing: border-box !important;
  clear: both !important;
  float: none !important;
  justify-content: flex-start !important;
  width: 100% !important;
  min-width: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-kakaosync-guide-modal .guide-wrap .guide-emphasis {
  margin: 22px 0 10px !important;
  color: var(--cl-text) !important;
  font-weight: 600 !important;
}

body.cl-dashboard-redesign-page .cl-source-kakaosync-guide-modal .guide-wrap .guide-emphasis .kakaosync-qa {
  display: grid !important;
  gap: 4px !important;
  box-sizing: border-box !important;
  padding-left: 35px !important;
}

body.cl-dashboard-redesign-page .cl-source-kakaosync-guide-modal .guide-wrap .guide-emphasis .kakaosync-qa-row {
  display: grid !important;
  grid-template-columns: 20px minmax(0, 1fr) !important;
  align-items: start !important;
  column-gap: 4px !important;
}

body.cl-dashboard-redesign-page .cl-source-kakaosync-guide-modal .guide-wrap .guide-emphasis :is(.kakaosync-qa-label, .kakaosync-qa-copy) {
  display: block !important;
  min-width: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-kakaosync-guide-modal .guide-wrap .indent-row {
  display: grid !important;
  grid-template-columns: max-content minmax(0, 1fr) !important;
  align-items: start !important;
  column-gap: 8px !important;
  word-break: keep-all !important;
  overflow-wrap: break-word !important;
}

body.cl-dashboard-redesign-page .cl-source-kakaosync-guide-modal .guide-wrap .indent-row > span {
  display: inline !important;
  float: none !important;
  width: auto !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-kakaosync-guide-modal .guide-wrap .indent-row > .step-point {
  display: block !important;
  margin: 0 !important;
  color: var(--cl-green-text) !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page .cl-source-kakaosync-guide-modal .guide-wrap .indent-row > .step-copy {
  display: block !important;
  min-width: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-kakaosync-guide-modal .guide-wrap .sub-title:has(+ .naverpaySmallStep.etcStep) {
  padding-left: 35px !important;
}

body.cl-dashboard-redesign-page .cl-source-kakaosync-guide-modal .kakaosyncSmallStep,
body.cl-dashboard-redesign-page .cl-source-kakaosync-guide-modal .naverpaySmallStep {
  display: block !important;
  margin: 0 0 20px !important;
  padding: 14px 16px 14px 34px !important;
  background: #fafbfc !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  line-height: 1.6 !important;
}

body.cl-dashboard-redesign-page .cl-source-kakaosync-guide-modal :is(.kakaosyncSmallStep, .naverpaySmallStep) li {
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-kakaosync-guide-modal :is(.kakaosyncSmallStep, .naverpaySmallStep) li + li {
  margin-top: 6px !important;
}

body.cl-dashboard-redesign-page .cl-source-kakaosync-guide-modal .devide-line {
  width: min(540px, calc(100% - 60px)) !important;
  height: 1px !important;
  margin: 0 auto 36px !important;
  background: var(--cl-border) !important;
}

body.cl-dashboard-redesign-page .cl-source-naverpay-guide-modal .guide-wrap .sub-title,
body.cl-dashboard-redesign-page .cl-source-naverpay-guide-modal .guide-wrap .step-sub-title {
  margin: 26px 0 12px !important;
  color: var(--cl-text) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 22px !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-naverpay-guide-modal .guide-wrap .step-sub-title-item {
  margin: 14px 0 8px !important;
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  line-height: 20px !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-naverpay-guide-modal .guide-wrap .guide_bold {
  color: var(--cl-text) !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page .cl-source-naverpay-guide-modal .guide-wrap .step-point {
  flex: 0 0 auto !important;
  color: var(--cl-green-text) !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page .cl-source-naverpay-guide-modal .guide-wrap .indent-row,
body.cl-dashboard-redesign-page .cl-source-naverpay-guide-modal .guide-wrap .indent-row-num {
  display: flex !important;
  align-items: flex-start !important;
  gap: 8px !important;
  margin: 14px 0 16px !important;
}

body.cl-dashboard-redesign-page .cl-source-naverpay-guide-modal .guide-wrap .indent-row > span,
body.cl-dashboard-redesign-page .cl-source-naverpay-guide-modal .guide-wrap .indent-row-num > span {
  display: block !important;
  float: none !important;
  width: auto !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-naverpay-guide-modal .guide-wrap .indent-row > span:first-child {
  flex: 0 0 62px !important;
}

body.cl-dashboard-redesign-page .cl-source-naverpay-guide-modal .guide-wrap .indent-row-num > span:first-child {
  flex: 0 0 28px !important;
}

body.cl-dashboard-redesign-page .cl-source-naverpay-guide-modal .guide-wrap .guide-note-row {
  margin-top: -8px !important;
  color: var(--cl-text-muted) !important;
}

body.cl-dashboard-redesign-page .cl-source-naverpay-guide-modal .guide-wrap .guide-link-row {
  margin-top: -4px !important;
  margin-bottom: 8px !important;
}

body.cl-dashboard-redesign-page .cl-source-naverpay-guide-modal .guide-wrap a,
body.cl-dashboard-redesign-page .cl-source-naverpay-guide-modal .guide-wrap a.c-blue,
body.cl-dashboard-redesign-page .cl-source-naverpay-guide-modal .guide-wrap a.text_d_un {
  color: var(--cl-green-text) !important;
  font-weight: 700 !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
}

body.cl-dashboard-redesign-page .cl-source-naverpay-guide-modal .guide-wrap a svg {
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .cl-source-naverpay-guide-modal .naverpaySmallStep {
  display: block !important;
  margin: 0 0 20px !important;
  padding: 14px 16px 14px 34px !important;
  background: #fafbfc !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  line-height: 1.6 !important;
}

body.cl-dashboard-redesign-page .cl-source-naverpay-guide-modal .naverpaySmallStep li {
  position: relative !important;
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  color: inherit !important;
  line-height: inherit !important;
}

body.cl-dashboard-redesign-page .cl-source-naverpay-guide-modal .naverpaySmallStep li + li {
  margin-top: 6px !important;
}

body.cl-dashboard-redesign-page .cl-source-naverpay-guide-modal .naverpaySmallStep li:not(.except)::before {
  content: "·" !important;
  position: absolute !important;
  left: -12px !important;
  color: var(--cl-text-muted) !important;
}

body.cl-dashboard-redesign-page .cl-source-naverpay-guide-modal .naverpaySmallStep li.except {
  margin-top: 8px !important;
}

body.cl-dashboard-redesign-page .cl-source-naverpay-guide-modal .naverpay-fee-table {
  float: none !important;
  width: 100% !important;
  margin: 12px 0 22px !important;
  overflow: hidden !important;
  border: 1px solid var(--cl-border) !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  border-radius: 8px !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
}

body.cl-dashboard-redesign-page .cl-source-naverpay-guide-modal .naverpay-fee-table th,
body.cl-dashboard-redesign-page .cl-source-naverpay-guide-modal .naverpay-fee-table td {
  height: 36px !important;
  padding: 8px 12px !important;
  background: #fff !important;
  border: 0 !important;
  border-top: 1px solid var(--cl-border) !important;
  border-left: 1px solid var(--cl-border) !important;
  color: inherit !important;
  font-weight: 500 !important;
  line-height: 20px !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .cl-source-naverpay-guide-modal .naverpay-fee-table th:first-child,
body.cl-dashboard-redesign-page .cl-source-naverpay-guide-modal .naverpay-fee-table td:first-child {
  border-left: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-naverpay-guide-modal .naverpay-fee-table thead th {
  border-top: 0 !important;
  background: #fafbfc !important;
  color: var(--cl-text) !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page .cl-source-naverpay-guide-modal .naverpay-fee-table .c-blue {
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-naverpay-guide-modal .desc-area {
  display: block !important;
  width: 100% !important;
  margin: 16px 0 24px !important;
  padding: 16px !important;
  background: #fafbfc !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  color: var(--cl-text-sub) !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-navershopping-guide-modal .guide-wrap .step > [id^="step"] {
  clear: both !important;
  display: flow-root !important;
}

body.cl-dashboard-redesign-page .cl-source-navershopping-guide-modal .guide-wrap .step > .devide-line {
  clear: both !important;
}

body.cl-dashboard-redesign-page .cl-source-navershopping-guide-modal .guide-wrap .step > [id^="step"] > h3 {
  box-sizing: border-box;
  clear: both !important;
  width: 100% !important;
  min-width: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-navershopping-guide-modal .guide-wrap .step p,
body.cl-dashboard-redesign-page .cl-source-navershopping-guide-modal .guide-wrap .step .naverpaySmallStep {
  float: none !important;
}

body.cl-dashboard-redesign-page .cl-source-navershopping-guide-modal .desc-area .desc-title {
  float: none !important;
  width: 100% !important;
  margin: 0 0 10px !important;
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  line-height: 20px !important;
}

body.cl-dashboard-redesign-page .cl-source-navershopping-guide-modal .desc-area ul {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 6px 14px !important;
  margin: 0 !important;
  padding: 0 0 0 16px !important;
}

body.cl-dashboard-redesign-page .cl-source-navershopping-guide-modal .desc-area li {
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  line-height: 1.6 !important;
}

body.cl-dashboard-redesign-page .cl-source-navershopping-guide-modal .naverpaySmallStep li.danger {
  color: var(--cl-danger) !important;
  font-weight: 600 !important;
}

body.cl-dashboard-redesign-page .cl-source-navershopping-guide-modal .naverpaySmallStep li.note {
  color: var(--cl-text-muted) !important;
}

body.cl-dashboard-redesign-page .cl-source-naverpay-guide-modal .devide-line {
  width: min(540px, calc(100% - 60px)) !important;
  height: 1px !important;
  margin: 0 auto 36px !important;
  background: var(--cl-border) !important;
}


/* KCP guide: scoped v2 layout, isolated from legacy guidePopup rules. */
body.cl-dashboard-redesign-page #kcpGuideOverlay {
  --brand-blue: #03c75a;
  --text-primary: #222428;
  --text-secondary: #8a8f98;
  --text-muted: #b4b8bf;
  font-family: var(--cl-font, 'CreatorlinkSansKR', 'Apple SD Gothic Neo', 'Malgun Gothic', sans-serif);
  font-size: 13px;
  line-height: normal;
  text-align: left;
}
body.cl-dashboard-redesign-page #kcpGuideOverlay,
body.cl-dashboard-redesign-page #kcpGuideOverlay * {
  box-sizing: border-box;
  letter-spacing: 0;
}
body.cl-dashboard-redesign-page #kcpGuideOverlay button { font-family: inherit; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-dtab,
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-dback,
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-mode,
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-step,
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-close { -webkit-tap-highlight-color: transparent; }
body.cl-dashboard-redesign-page #kcpGuideOverlay { display: none; position: fixed; inset: 0px; background: rgba(14, 18, 25, 0.62); z-index: 160; }
body.cl-dashboard-redesign-page #kcpGuideOverlay.open { display: block; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-panel { position: absolute; top: 2.6vh; bottom: 2.6vh; left: 50%; transform: translateX(-50%); width: min(94vw, 1280px); background: rgb(255, 255, 255); border-radius: 16px; overflow: hidden; display: flex; flex-direction: column; box-shadow: rgba(0, 0, 0, 0.35) 0px 30px 80px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-head { flex: 0 0 auto; height: 58px; padding: 0px 14px 0px 24px; display: flex; align-items: center; gap: 10px; border-bottom: 1px solid rgb(237, 239, 242); }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-head h3 { font-size: 16px; font-weight: 800; margin: 0px; color: var(--text-primary); }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-head .kg-sub { font-size: 12.5px; color: var(--text-muted); }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-close { margin-left: auto; width: 30px; height: 30px; padding: 0px; border-width: medium; border-style: none; border-color: currentcolor; border-image: none; background: none; border-radius: 8px; cursor: pointer; color: var(--text-secondary); display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; transition: color 0.15s, background 0.15s, transform 0.18s cubic-bezier(0.34, 1.56, 0.64, 1); }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-close svg { width: 15px; height: 15px; display: block; }
@media (hover: hover) and (pointer: fine) {
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-close:hover { color: var(--text-primary); background: rgb(241, 242, 245); transform: rotate(90deg); }
}
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-body { flex: 1 1 0%; overflow: auto; background: rgb(255, 255, 255); scroll-behavior: smooth; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-steps { position: sticky; top: 0px; z-index: 6; background: rgba(255, 255, 255, 0.96); backdrop-filter: blur(8px); border-bottom: 1px solid rgb(237, 239, 242); padding: 16px 24px; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 0px 2px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-step { width: 106px; height: 106px; border-radius: 50%; border: 1px solid rgb(227, 230, 234); background: rgb(255, 255, 255); cursor: pointer; flex: 0 0 auto; display: flex; align-items: center; justify-content: center; text-align: center; padding: 3px 8px 0px; word-break: keep-all; font-size: 12.5px; font-weight: 700; line-height: 1.5; color: var(--text-secondary); font-family: inherit; transition: border-color 0.15s, color 0.15s, box-shadow 0.15s, background 0.15s; }
@media (hover: hover) and (pointer: fine) {
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-step:hover { border-color: rgb(185, 194, 204); color: var(--text-primary); }
}
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-step:active:not(.on) { border-color: rgb(185, 194, 204); }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-step.on { border: 2px solid var(--brand-blue); color: var(--cl-green-text); font-weight: 800; box-shadow: rgba(3, 199, 90, 0.14) 0px 0px 0px 4px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-arrow { flex: 0 0 auto; width: 26px; display: flex; align-items: center; justify-content: center; color: rgb(127, 217, 166); }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-arrow svg { width: 13px; height: 13px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-inner { max-width: 900px; margin: 0px auto; padding: 34px 28px 90px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-sec { padding-top: 26px; margin-bottom: 34px; border-top: 1px solid rgb(241, 243, 245); }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-sec:first-child { border-top-width: medium; border-top-style: none; border-top-color: currentcolor; padding-top: 6px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-sec-no { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 50%; background: var(--brand-blue); color: rgb(255, 255, 255); font-size: 11.5px; font-weight: 800; margin-right: 8px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-sec h4 { font-size: 18px; font-weight: 800; color: var(--text-primary); margin: 0px 0px 10px; display: flex; align-items: center; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-lead { font-size: 13.5px; line-height: 1.85; color: var(--text-secondary); margin: 0px 0px 20px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-lead b { color: var(--text-primary); font-weight: 700; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-subtitle { font-size: 14.5px; font-weight: 800; color: var(--text-primary); margin: 30px 0px 10px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-sec > .kg-subtitle:first-of-type { margin-top: 2px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-body-text { font-size: 13.5px; line-height: 1.85; color: var(--text-secondary); margin: 0px 0px 6px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-body-text b { color: var(--text-primary); font-weight: 700; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-qa { font-size: 13px; line-height: 1.8; color: var(--text-primary); background: rgb(250, 251, 252); border: 1px solid rgb(237, 239, 242); border-radius: 10px; padding: 13px 15px; margin: 22px 0px 10px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-qa b { font-weight: 800; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-ul { list-style: none; margin: 0px 0px 20px; padding: 0px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-ul li { font-size: 12.5px; line-height: 1.85; color: var(--text-secondary); margin: 0px 0px 6px; padding-left: 11px; text-indent: -11px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-ul li:last-child { margin-bottom: 0px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-ul li b { color: var(--text-primary); font-weight: 700; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-ul li a.kg-lk { font-weight: 700; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-shot + .kg-body-text,
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-shot + .kg-ul { margin: 10px 0px 28px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-subtitle + .kg-shot { margin-top: 4px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-note + .kg-shot { margin-top: 18px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-note { display: flex; gap: 8px; font-size: 12.5px; line-height: 1.8; color: var(--text-secondary); background: rgb(250, 251, 252); border: 1px solid rgb(237, 239, 242); border-radius: 10px; padding: 13px 15px; margin: 22px 0px 20px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-note i { font-style: normal; color: var(--brand-blue); font-weight: 800; flex: 0 0 auto; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-note.warn { background: rgb(253, 242, 244); border-color: rgb(246, 221, 226); color: rgb(151, 86, 95); }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-note.warn .ico { flex: 0 0 auto; margin-top: 4px; color: rgb(238, 68, 95); }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-note.warn b { color: rgb(126, 63, 74); font-weight: 800; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-stepline { font-size: 13px; font-weight: 700; color: var(--text-primary); margin: 22px 0px 10px; display: flex; align-items: center; gap: 7px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-stepline em { font-style: normal; font-size: 11px; font-weight: 800; color: rgb(255, 255, 255); background: rgb(91, 98, 108); border-radius: 5px; padding: 3px 7px; letter-spacing: 0px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-table { width: 100%; border-collapse: collapse; font-size: 12.5px; border: 1px solid rgb(227, 230, 234); margin-bottom: 12px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-table th,
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-table td { border: 1px solid rgb(227, 230, 234); padding: 9px 8px; text-align: center; color: var(--text-primary); }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-table thead th { background: rgb(244, 246, 248); font-weight: 700; color: var(--text-secondary); }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-table td:first-child { font-weight: 700; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-cap { font-size: 11.5px; color: var(--text-muted); line-height: 1.75; margin: 0px 0px 8px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-shot { background: rgb(242, 244, 246); border: 1px solid rgb(231, 233, 237); border-radius: 12px; padding: 22px; display: flex; flex-wrap: wrap; gap: 20px; justify-content: center; align-items: flex-start; margin-bottom: 8px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-shot + .kg-figcap { font-size: 11.5px; color: var(--text-muted); text-align: center; margin: 0px 0px 22px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-win { background: rgb(255, 255, 255); border-radius: 8px; box-shadow: rgba(20, 24, 32, 0.08) 0px 2px 10px; overflow: hidden; position: relative; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-w-admin { width: 430px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-w-phone { width: 250px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-w-page { width: 300px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-mark { position: relative; border: 2px solid rgb(255, 59, 119); border-radius: 8px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-shot.kg-neutral .kg-abtn.primary { background: rgb(91, 98, 108); color: rgb(255, 255, 255); }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-shot.kg-neutral .kg-radio i.on { border-color: rgb(138, 144, 153); box-shadow: rgb(255, 255, 255) 0px 0px 0px 2px inset, rgb(91, 98, 108) 0px 0px 0px 5px inset; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-badge { position: absolute; left: -11px; top: 50%; transform: translateY(-50%); width: 20px; height: 20px; border-radius: 50%; background: rgb(255, 59, 119); color: rgb(255, 255, 255); font-size: 11px; font-weight: 800; display: flex; align-items: center; justify-content: center; z-index: 2; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-tabs { display: flex; gap: 14px; padding: 9px 12px; border-bottom: 1px solid rgb(237, 239, 242); font-size: 9.5px; color: rgb(154, 163, 175); font-weight: 600; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-tabs .on { color: var(--text-primary); font-weight: 800; border-bottom: 2px solid var(--text-primary); padding-bottom: 5px; margin-bottom: -7px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-abody { padding: 14px 14px 16px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-atitle { font-size: 11px; font-weight: 800; color: var(--text-primary); margin-bottom: 7px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-atext { font-size: 9px; line-height: 1.75; color: rgb(124, 133, 146); }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-arow { display: flex; gap: 7px; margin-top: 12px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-abtn { height: 26px; padding: 0px 12px; border-radius: 5px; font-size: 9.5px; font-weight: 700; display: flex; align-items: center; justify-content: center; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-abtn.primary { background: var(--brand-blue); color: rgb(255, 255, 255); }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-abtn.outline { background: rgb(255, 255, 255); color: rgb(91, 98, 108); border: 1px solid rgb(221, 225, 230); }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-abtn.save { background: var(--brand-blue); color: rgb(255, 255, 255); position: absolute; right: 12px; top: 9px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-afield { margin-top: 9px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-afield label { display: block; font-size: 8.5px; color: rgb(138, 144, 153); margin-bottom: 4px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-afield .box { height: 22px; border: 1px solid rgb(227, 230, 234); border-radius: 4px; background: rgb(255, 255, 255); }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-afield .box.filled { background: rgb(238, 240, 243); }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-radio { display: flex; gap: 14px; align-items: center; font-size: 9px; color: rgb(91, 98, 108); margin-top: 6px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-radio span { display: flex; align-items: center; gap: 4px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-radio i { width: 9px; height: 9px; border-radius: 50%; border: 1.5px solid rgb(198, 203, 210); display: block; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-radio i.on { border-color: var(--brand-blue); box-shadow: inset 0 0 0 2px #fff, inset 0 0 0 5px var(--brand-blue); }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-hr { height: 1px; background: rgb(239, 240, 243); margin: 13px 0px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-p { padding: 26px 22px; background: rgb(247, 248, 250); }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-p h5 { font-size: 15px; font-weight: 800; text-align: center; margin: 0px 0px 18px; color: rgb(43, 47, 54); letter-spacing: 0px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-p .desc { font-size: 9.5px; color: rgb(138, 144, 153); text-align: center; line-height: 1.7; margin: -10px 0px 16px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-in { height: 30px; border: 1px solid rgb(227, 230, 234); border-radius: 4px; background: rgb(255, 255, 255); display: flex; align-items: center; padding: 0px 10px; font-size: 9.5px; color: rgb(170, 176, 184); margin-bottom: 7px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-btn { height: 32px; border-radius: 4px; display: flex; align-items: center; justify-content: center; font-size: 10px; font-weight: 700; margin-bottom: 7px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-btn.dark { background: rgb(59, 67, 81); color: rgb(255, 255, 255); }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-btn.line { background: rgb(255, 255, 255); color: rgb(59, 67, 81); border: 1px solid rgb(221, 225, 230); }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-btn.gray { background: rgb(199, 203, 209); color: rgb(255, 255, 255); }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-link { font-size: 9px; color: rgb(138, 144, 153); text-align: right; text-decoration: underline; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-19 { width: 52px; height: 52px; border-radius: 50%; border: 2.5px solid rgb(232, 56, 79); color: rgb(43, 47, 54); font-size: 17px; font-weight: 800; display: flex; align-items: center; justify-content: center; margin: 0px auto 12px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-19 sup { font-size: 10px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-pass-head { background: rgb(244, 245, 247); text-align: center; padding: 10px 0px; border-bottom: 1px solid rgb(231, 233, 237); }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-pass-head span { display: inline-block; border: 1.5px solid rgb(232, 56, 79); color: rgb(232, 56, 79); font-size: 9px; font-weight: 800; letter-spacing: 0px; padding: 2px 6px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-pass-body { padding: 16px 18px 18px; background: rgb(255, 255, 255); }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-pass-body .t { font-size: 10.5px; font-weight: 800; text-align: center; margin-bottom: 14px; color: rgb(43, 47, 54); }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-telco { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 14px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-telco span { aspect-ratio: 1 / 1; border: 1px solid rgb(231, 233, 237); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 10px; font-weight: 800; color: rgb(91, 98, 108); }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-agree { font-size: 8.5px; color: rgb(138, 144, 153); line-height: 1.9; margin-bottom: 12px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-agree .all { font-size: 10px; font-weight: 800; color: rgb(43, 47, 54); display: flex; align-items: center; gap: 6px; margin-bottom: 6px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-agree .all i,
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-agree .g i { width: 10px; height: 10px; border: 1.2px solid rgb(185, 191, 199); border-radius: 2px; display: inline-block; flex: 0 0 auto; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-agree .g { display: grid; grid-template-columns: 1fr 1fr; gap: 4px 10px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-agree .g span { display: flex; align-items: center; gap: 5px; text-decoration: underline; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-passbtn { height: 28px; background: rgb(242, 244, 246); border: 1px solid rgb(231, 233, 237); border-radius: 3px; display: flex; align-items: center; justify-content: center; font-size: 9.5px; color: rgb(91, 98, 108); margin-bottom: 6px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-info { background: rgb(255, 255, 255); border: 1px solid rgb(237, 239, 242); border-radius: 6px; padding: 10px 12px; margin-bottom: 12px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-info .h { font-size: 9px; font-weight: 800; color: rgb(91, 98, 108); margin-bottom: 8px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-info .r { display: flex; font-size: 9.5px; margin-bottom: 6px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-info .r b { width: 60px; color: rgb(138, 144, 153); font-weight: 600; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-info .r span { color: rgb(43, 47, 54); font-weight: 600; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-tab2 { display: flex; margin-bottom: 16px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-tab2 span { flex: 1 1 0%; text-align: center; font-size: 10px; font-weight: 700; color: rgb(170, 176, 184); padding-bottom: 8px; border-bottom: 1px solid rgb(227, 230, 234); }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-tab2 span.on { color: rgb(43, 47, 54); font-weight: 800; border-bottom: 2px solid rgb(43, 47, 54); }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-found { background: rgb(255, 255, 255); border: 1px solid rgb(227, 230, 234); border-radius: 4px; height: 32px; display: flex; align-items: center; justify-content: center; font-size: 10px; color: rgb(43, 47, 54); margin-bottom: 8px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-modes { margin-left: auto; display: flex; gap: 2px; padding: 3px; background: rgb(241, 243, 245); border-radius: 9px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-mode { height: 26px; padding: 0px 13px; border-width: medium; border-style: none; border-color: currentcolor; border-image: none; background: none; border-radius: 7px; cursor: pointer; font-family: inherit; font-size: 12.5px; font-weight: 700; color: var(--text-secondary); letter-spacing: 0px; transition: background 0.15s, color 0.15s, box-shadow 0.15s; }
@media (hover: hover) and (pointer: fine) {
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-mode:hover { color: var(--text-primary); }
}
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-mode.on { background: rgb(255, 255, 255); color: var(--text-primary); box-shadow: rgba(20, 24, 32, 0.12) 0px 1px 3px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-head .kg-close { margin-left: 6px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-dnav { position: sticky; top: 0px; z-index: 6; background: rgba(255, 255, 255, 0.96); backdrop-filter: blur(8px); border-bottom: 1px solid rgb(237, 239, 242); padding: 12px 24px; display: flex; align-items: center; justify-content: center; gap: 14px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-dback { position: absolute; left: 24px; top: 50%; transform: translateY(-50%); flex: 0 0 auto; display: flex; align-items: center; gap: 4px; height: 32px; padding: 0px 12px 0px 8px; border: 1px solid rgb(227, 230, 234); background: rgb(255, 255, 255); border-radius: 8px; cursor: pointer; font-family: inherit; font-size: 12.5px; font-weight: 700; color: var(--text-secondary); transition: border-color 0.15s, color 0.15s, background 0.15s; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-dback svg { width: 14px; height: 14px; }
@media (hover: hover) and (pointer: fine) {
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-dback:hover { border-color: rgb(185, 194, 204); color: var(--text-primary); background: rgb(250, 251, 252); }
}
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-dback:active { border-color: rgb(185, 194, 204); background: rgb(250, 251, 252); }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-dtabs { display: flex; gap: 6px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-dtab { height: 32px; padding: 0px 16px; border: 1px solid rgb(227, 230, 234); background: rgb(255, 255, 255); border-radius: 999px; cursor: pointer; font-family: inherit; font-size: 13px; font-weight: 700; color: var(--text-secondary); letter-spacing: 0px; transition: border-color 0.15s, color 0.15s, box-shadow 0.15s, background 0.15s; }
@media (hover: hover) and (pointer: fine) {
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-dtab:hover { border-color: rgb(185, 194, 204); color: var(--text-primary); }
}
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-dtab:active:not(.on) { border-color: rgb(185, 194, 204); }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-dtab.on { border-color: var(--brand-blue); color: var(--cl-green-text); background: rgba(3, 199, 90, 0.07); box-shadow: rgba(3, 199, 90, 0.12) 0px 0px 0px 3px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-demo { max-width: 1240px; margin: 0px auto; padding: 26px 22px 90px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-dintro { font-size: 12.5px; line-height: 1.8; color: var(--text-secondary); background: rgb(250, 251, 252); border: 1px solid rgb(237, 239, 242); border-radius: 10px; padding: 11px 14px; margin-bottom: 22px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-dpane { display: block; padding-top: 30px; margin-bottom: 38px; border-top: 1px solid rgb(241, 243, 245); }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-dpane:first-of-type { padding-top: 4px; border-top-width: medium; border-top-style: none; border-top-color: currentcolor; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-dpane:last-of-type { margin-bottom: 0px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-dhead { margin-bottom: 14px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-dhead h4 { font-size: 17px; font-weight: 800; color: var(--text-primary); margin: 0px 0px 6px; display: flex; align-items: center; gap: 8px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-dhead h4 em { font-style: normal; font-size: 11px; font-weight: 800; color: rgb(255, 255, 255); background: rgb(91, 98, 108); border-radius: 5px; padding: 4px 8px; letter-spacing: 0px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-dhead p { font-size: 13px; line-height: 1.75; color: var(--text-secondary); margin: 0px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-flow { display: flex; flex-wrap: nowrap; align-items: flex-start; justify-content: safe center; gap: 10px; overflow: auto hidden; background: rgb(236, 239, 243); border: 1px solid rgb(225, 229, 234); border-radius: 12px; padding: 24px 20px; scroll-behavior: smooth; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-flow::-webkit-scrollbar { height: 9px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-flow::-webkit-scrollbar-thumb { background: rgb(194, 201, 209); border-radius: 99px; border: 2px solid rgb(236, 239, 243); }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-flow::-webkit-scrollbar-track { background: transparent; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-fitem { flex: 0 0 auto; width: 268px; position: relative; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-fitem.phone { width: 224px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-fitem .kg-win { width: 100%; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-fno { width: 20px; height: 20px; border-radius: 50%; background: rgb(91, 98, 108); color: rgb(255, 255, 255); font-size: 11px; font-weight: 800; display: flex; align-items: center; justify-content: center; margin: 0px auto 9px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-fcap { margin-top: 10px; font-size: 11.5px; line-height: 1.65; color: var(--text-secondary); text-align: center; word-break: keep-all; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-fcap b { color: var(--text-primary); font-weight: 700; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-farrow { flex: 0 0 auto; width: 18px; margin-top: 92px; display: flex; align-items: center; justify-content: center; color: rgb(154, 163, 175); }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-farrow svg { width: 15px; height: 15px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-democta { display: flex; justify-content: flex-end; margin-top: 26px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-democta .go { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 5px; height: 40px; padding: 0px 22px; border: 1px solid var(--brand-blue); background: var(--brand-blue); color: rgb(255, 255, 255); border-radius: 9px; cursor: pointer; font-family: inherit; font-size: 13.5px; font-weight: 700; transition: filter 0.15s; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-democta .go svg { width: 14px; height: 14px; }
@media (hover: hover) and (pointer: fine) {
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-democta .go:hover { filter: brightness(0.95); }
}
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-democta .go:active { filter: brightness(0.95); }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-lk { color: rgb(47, 107, 255); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 1180px) {
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-panel { top: 1.8vh; bottom: 1.8vh; width: 96vw; border-radius: 14px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-head { height: auto; min-height: 54px; padding: 9px 10px 9px 18px; gap: 8px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-head h3 { font-size: 15px; line-height: 1.35; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-head .kg-sub { display: none; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-modes { padding: 2px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-mode { height: 28px; padding: 0px 11px; font-size: 12px; white-space: nowrap; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-steps { flex-wrap: nowrap; justify-content: flex-start; overflow: auto hidden; padding: 13px 16px; scrollbar-width: none; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-steps::-webkit-scrollbar { display: none; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-step { width: 88px; height: 88px; font-size: 11.5px; line-height: 1.45; padding: 2px 6px 0px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-step.on { box-shadow: rgba(3, 199, 90, 0.14) 0px 0px 0px 3px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-arrow { width: 20px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-arrow svg { width: 11px; height: 11px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-inner { padding: 24px 18px 72px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-sec { padding-top: 22px; margin-bottom: 28px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-sec h4 { font-size: 16px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-lead { font-size: 13px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-shot { padding: 16px 12px; gap: 14px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-dnav { padding: 10px 14px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 10px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-dnav::after { content: ""; display: block; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-dback { position: static; transform: none; height: 30px; padding: 0px 10px 0px 6px; font-size: 12px; justify-self: start; white-space: nowrap; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-dtabs { justify-self: center; min-width: 0px; max-width: 100%; overflow-x: auto; padding: 5px 0px; margin: -5px 0px; scrollbar-width: none; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-dtabs::-webkit-scrollbar { display: none; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-dtab { height: 30px; padding: 0px 13px; font-size: 12.5px; flex: 0 0 auto; white-space: nowrap; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-demo { padding: 20px 16px 72px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-dhead h4 { font-size: 15.5px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-dhead p,
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-dintro { font-size: 12.5px; }
}
@media (max-width: 760px) {
body.cl-dashboard-redesign-page #kcpGuideOverlay { background: rgba(14, 18, 25, 0.72); }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-panel { top: 0px; bottom: 0px; width: 100vw; border-radius: 0px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-head { min-height: 50px; padding: 8px 8px 8px 14px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-head h3 { font-size: 14px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-mode { height: 26px; padding: 0px 9px; font-size: 11.5px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-close { width: 28px; height: 28px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-steps { padding: 11px 12px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-step { width: 76px; height: 76px; font-size: 10.5px; line-height: 1.4; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-arrow { width: 16px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-arrow svg { width: 10px; height: 10px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-inner { padding: 20px 14px 64px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-sec h4 { font-size: 15px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-sec-no { width: 20px; height: 20px; font-size: 11px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-lead,
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-note { font-size: 12px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-stepline { font-size: 12.5px; align-items: flex-start; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-stepline em { flex: 0 0 auto; white-space: nowrap; margin-top: 1px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-shot { padding: 14px 10px; gap: 12px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-w-admin { width: 100%; max-width: 430px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-w-page { width: 100%; max-width: 300px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-w-phone { width: 100%; max-width: 260px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-table { font-size: 11px; min-width: 560px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-abody > div { min-width: 0px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-abody > div > div { min-width: 0px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-arow { flex-wrap: wrap; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-abtn { padding: 0px 10px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-dnav { padding: 9px 12px; gap: 8px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-dtabs { gap: 5px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-dtab { height: 28px; padding: 0px 11px; font-size: 12px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-demo { padding: 18px 12px 64px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-flow { padding: 18px 12px; gap: 8px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-fitem { width: 240px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-fitem.phone { width: 206px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-fitem .kg-win { width: 100%; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-farrow { width: 14px; margin-top: 74px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-democta { justify-content: stretch; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-democta .go { width: 100%; justify-content: center; }
}
@media (max-width: 460px) {
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-dback-t { display: none; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-dback { width: 32px; padding: 0px; justify-content: center; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-dback svg { margin: 0px; }
}
@media (max-width: 480px) {
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-head h3 { font-size: 13.5px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-step { width: 68px; height: 68px; font-size: 10px; padding: 2px 4px 0px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-arrow { width: 13px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-fitem { width: 216px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-fitem.phone { width: 190px; }
}
body.cl-dashboard-redesign-page #kcpGuideOverlay {
  z-index: 1000010;
  background: rgba(0,0,0,.45);
}
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-body { min-height: 0; min-width: 0; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-head h3 { min-width: 0; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-modes { flex: none; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-close { width: 30px; height: 30px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-close svg { width: 15px; height: 15px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay button:focus-visible { outline: 2px solid var(--brand-blue); outline-offset: 2px; }
body.cl-dashboard-redesign-page #kcpGuideOverlay .cl-kcp-table-scroll { max-width: 100%; overflow-x: auto; }
@media (max-width: 760px) {
  body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-panel { width: 100%; }
}
@media (max-width: 480px) {
  body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-head { flex-wrap: wrap; }
  body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-head h3 { flex: 1 1 calc(100% - 50px); }
  body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-close { order: 1; margin-left: auto; }
  body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-modes { order: 2; margin: 0 auto; }
}
@media (prefers-reduced-motion: reduce) {
  body.cl-dashboard-redesign-page #kcpGuideOverlay *,
  body.cl-dashboard-redesign-page #kcpGuideOverlay .kg-body { scroll-behavior: auto; transition: none; }
}


body.cl-dashboard-redesign-page .cl-source-cert-guide-modal .guide-wrap .step h4 {
  margin: 26px 0 12px !important;
  color: var(--cl-text) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 22px !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-cert-guide-modal .guide-wrap .step .step2-step,
body.cl-dashboard-redesign-page .cl-source-cert-guide-modal .guide-wrap .step .step3-step {
  display: grid !important;
  grid-template-columns: max-content minmax(0, 1fr) !important;
  align-items: start !important;
  column-gap: 8px !important;
  width: 100% !important;
  margin: 16px 0 14px !important;
  padding: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 1.65 !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-cert-guide-modal .guide-wrap .step .step2-step span,
body.cl-dashboard-redesign-page .cl-source-cert-guide-modal .guide-wrap .step .step3-step span {
  display: inline-block !important;
  grid-column: 1 !important;
  margin-right: 0 !important;
  color: var(--cl-green-text) !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  line-height: inherit !important;
}

body.cl-dashboard-redesign-page .cl-source-cert-guide-modal .guide-wrap .step .step2-step p,
body.cl-dashboard-redesign-page .cl-source-cert-guide-modal .guide-wrap .step .step3-step p {
  grid-column: 2 !important;
  margin: 8px 0 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-cert-guide-modal .guide-wrap hr.line {
  display: block !important;
  width: min(540px, calc(100% - 60px)) !important;
  height: 1px !important;
  margin: 0 auto 36px !important;
  background: var(--cl-border) !important;
  border: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guideClose {
  display: none !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 4px 30px 28px !important;
  background: var(--cl-surface) !important;
  border: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-naverpay-guide-modal .guideClose,
body.cl-dashboard-redesign-page .guidePopup.naverpay-guide-modal .modal-footer.guideClose {
  box-sizing: border-box !important;
  width: min(540px, calc(100% - 60px)) !important;
  max-width: 540px !important;
  margin: 0 auto !important;
  padding: 4px 0 50px !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guideClose .close-button-dialog,
body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guideClose .close-button-dialog:hover,
body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guideClose .close-button-dialog:focus {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: none !important;
  height: 46px !important;
  min-height: 46px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 9px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guideClose .close-button-dialog:hover,
body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guideClose .close-button-dialog:focus {
  background: #eaf9f1 !important;
  color: var(--cl-green-text) !important;
}

/* Notification SMS sender number guide modal */
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.sms-number-guide-modal),
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root {
  position: fixed !important;
  inset: 0 !important;
  z-index: 999999 !important;
  width: 100vw !important;
  height: 100vh !important;
  overflow: hidden !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.sms-number-guide-modal) + .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root + .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root + .modal-backdrop.fade,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root + .modal-backdrop.in {
  display: none !important;
  opacity: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default:has(.modal-dialog.sms-number-guide-modal),
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default,
body.cl-dashboard-redesign-page .cl-source-sms-number-guide-modal-wrap {
  position: fixed !important;
  inset: 0 !important;
  z-index: 999999 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100vw !important;
  height: 100vh !important;
  margin: 0 !important;
  padding: 32px !important;
  overflow: hidden !important;
  background: rgba(0, 0, 0, .45) !important;
  border: 0 !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default:has(.modal-dialog.sms-number-guide-modal) > .cl-mobile-btn.close,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default > .cl-mobile-btn.close {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  --cl-source-notification-guide-content-width: 540px;
  width: 700px !important;
  max-width: calc(100vw - 64px) !important;
  height: min(820px, calc(100vh - 64px)) !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .modal-content,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .modal-content {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: #fff !important;
  border: 0 !important;
  border-radius: 16px !important;
  box-shadow: 0 24px 64px rgba(20, 24, 32, .24) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .modal-body,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .modal-body {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .modal-content > .close.close-button-dialog,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .modal-content > .close.close-button-dialog {
  position: absolute !important;
  top: 16px !important;
  right: 16px !important;
  z-index: 40 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub) !important;
  opacity: 1 !important;
  cursor: pointer !important;
  transition: background-color .12s, color .15s, transform .18s cubic-bezier(.34, 1.56, .64, 1) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .modal-content > .close.close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .modal-content > .close.close-button-dialog:focus,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .modal-content > .close.close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .modal-content > .close.close-button-dialog:focus {
  background: #f1f2f5 !important;
  color: var(--cl-text) !important;
  outline: 0 !important;
  transform: rotate(90deg) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .modal-content > .close.close-button-dialog svg,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .modal-content > .close.close-button-dialog svg {
  display: block !important;
  width: 9px !important;
  height: 9px !important;
  fill: currentColor !important;
  stroke: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .guide-top,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .guide-top {
  position: relative !important;
  top: auto !important;
  right: auto !important;
  left: auto !important;
  z-index: 2 !important;
  flex: 0 0 auto !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 24px 0 0 !important;
  background: #fff !important;
  border: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .guide-top .guidetitle,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .guide-top .guidetitle {
  margin: 0 72px 16px !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-size: 20px !important;
  font-weight: 800 !important;
  line-height: 28px !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .guide-menu,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .guide-menu {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .guide-menu ul,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .guide-menu ul {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  counter-reset: cl-sms-guide-step !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: #fff !important;
  border: 0 !important;
  border-bottom: 1px solid var(--cl-border) !important;
  border-radius: 0 !important;
  list-style: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .guide-menu li,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .guide-menu li {
  position: relative !important;
  left: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  box-sizing: border-box !important;
  width: auto !important;
  max-width: none !important;
  min-width: 0 !important;
  height: 68px !important;
  margin: 0 !important;
  padding: 0 12px !important;
  background: #fff !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: var(--cl-text-sub) !important;
  counter-increment: cl-sms-guide-step !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .guide-menu li::before,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .guide-menu li::before {
  content: counter(cl-sms-guide-step) !important;
  display: inline-flex !important;
  flex: 0 0 26px !important;
  align-items: center !important;
  justify-content: center !important;
  width: 26px !important;
  height: 26px !important;
  background: #fff !important;
  border: 1px solid #dfe3e8 !important;
  border-radius: 50% !important;
  color: var(--cl-text-muted) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .guide-menu li.active,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .guide-menu li.active {
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .guide-menu li.active::before,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .guide-menu li.active::before {
  background: var(--cl-green) !important;
  border-color: var(--cl-green) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .guide-menu li.active::after,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .guide-menu li.active::after {
  content: "" !important;
  position: absolute !important;
  right: 0 !important;
  bottom: -1px !important;
  left: 0 !important;
  height: 2px !important;
  background: var(--cl-green) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .guide-menu li p,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .guide-menu li p {
  position: static !important;
  display: block !important;
  max-width: 100% !important;
  margin: 0 !important;
  overflow: hidden !important;
  color: inherit !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  text-align: center !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .guide-menu li.active p,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .guide-menu li.active p {
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .guide-menu li .line,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .guide-menu li .line {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-wrap,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-wrap {
  position: relative !important;
  top: auto;
  flex: 1 1 auto !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  background: #fff !important;
  scrollbar-width: thin !important;
  scrollbar-color: #d1d3d5 transparent !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-wrap::-webkit-scrollbar,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-wrap::-webkit-scrollbar {
  width: 9px !important;
  height: 9px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-wrap::-webkit-scrollbar-thumb,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-wrap::-webkit-scrollbar-thumb {
  background: #d1d3d5 !important;
  border: 2px solid transparent !important;
  border-radius: 6px !important;
  background-clip: padding-box !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-wrap::-webkit-scrollbar-track,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-wrap::-webkit-scrollbar-track {
  background: transparent !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-wrap::-webkit-scrollbar-button,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-wrap::-webkit-scrollbar-button {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-wrap .step,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-wrap .step {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 28px 30px 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-step,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-step {
  width: 100% !important;
  max-width: var(--cl-source-notification-guide-content-width) !important;
  margin: 0 auto !important;
  padding: 0 0 28px !important;
  clear: both !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-wrap .step #step1,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-wrap .step #step2,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-wrap .step #step3,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-wrap .step #step1,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-wrap .step #step2,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-wrap .step #step3 {
  width: 100% !important;
  max-width: var(--cl-source-notification-guide-content-width) !important;
  margin: 0 auto !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-step::after,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-step::after {
  content: "" !important;
  display: block !important;
  clear: both !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-step + .sms-number-guide-step,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-step + .sms-number-guide-step {
  margin-top: 0 !important;
  padding-top: 28px !important;
  border-top: 1px solid var(--cl-border) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal #step2,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal #step3,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal #step2,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal #step3 {
  margin-top: 0 !important;
  padding-top: 28px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-step h3,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-step h3 {
  display: block !important;
  float: none !important;
  clear: both !important;
  box-sizing: border-box !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 0 18px !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  color: var(--cl-text) !important;
  font-size: 17px !important;
  font-weight: 800 !important;
  line-height: 24px !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-image,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-image {
  float: none !important;
  clear: both !important;
  box-sizing: content-box !important;
  width: 520px !important;
  max-width: calc(100% - 2px) !important;
  margin: 0 auto 18px !important;
  overflow: hidden !important;
  background: #fafbfc !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-image img,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-image img {
  display: block !important;
  width: 520px !important;
  max-width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-step p,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-step p {
  display: block !important;
  float: none !important;
  clear: both !important;
  box-sizing: border-box !important;
  width: 100% !important;
  margin: 12px 0 0 !important;
  padding: 13px 14px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 10px !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.65 !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-step p strong,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-step p strong {
  display: block !important;
  margin: 0 0 6px !important;
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  font-weight: 800 !important;
  line-height: 20px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-step p span,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-step p span {
  display: block !important;
  margin: 4px 0 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-bold,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-bold {
  color: var(--cl-text) !important;
  font-weight: 800 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal :is(.sms-number-guide-note, .sms-number-guide-bold-note, .sms-number-guide-danger),
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal :is(.sms-number-guide-note, .sms-number-guide-bold-note, .sms-number-guide-danger) {
  display: flex !important;
  align-items: flex-start !important;
  gap: 6px !important;
  margin-top: 8px !important;
  padding: 8px 10px !important;
  border-radius: 8px !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  line-height: 18px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal :is(.sms-number-guide-note, .sms-number-guide-bold-note),
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal :is(.sms-number-guide-note, .sms-number-guide-bold-note) {
  background: var(--cl-green-soft) !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-danger,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-danger {
  background: #fff2f4 !important;
  color: var(--cl-danger) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-step em,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-step em {
  color: var(--cl-danger) !important;
  font-style: normal !important;
  font-weight: 800 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-required-icon,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-required-icon {
  flex: 0 0 12px !important;
  width: 12px !important;
  height: 12px !important;
  margin-top: 3px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .guideClose,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .guideClose {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  width: min(var(--cl-source-notification-guide-content-width), calc(100% - 60px)) !important;
  max-width: var(--cl-source-notification-guide-content-width) !important;
  margin: 0 auto !important;
  padding: 4px 0 50px !important;
  background: #fff !important;
  border: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .guideClose .close-button-dialog,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .guideClose .close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .guideClose .close-button-dialog:focus,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .guideClose .close-button-dialog,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .guideClose .close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .guideClose .close-button-dialog:focus {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: none !important;
  height: 46px !important;
  min-height: 46px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 9px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .guideClose .close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .guideClose .close-button-dialog:focus,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .guideClose .close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .guideClose .close-button-dialog:focus {
  background: var(--cl-green-soft) !important;
  color: var(--cl-green-text) !important;
  outline: 0 !important;
}

@media (max-width: 640px) {
  body.cl-dashboard-redesign-page :is(.flat-modal.cl-common-modal:has(.modal-dialog.sms-number-guide-modal), .flat-modal.cl-source-sms-number-guide-root) .modal-default {
    align-items: stretch !important;
    padding: 12px !important;
  }

  body.cl-dashboard-redesign-page :is(.flat-modal.cl-common-modal:has(.modal-dialog.sms-number-guide-modal), .flat-modal.cl-source-sms-number-guide-root) .modal-dialog.sms-number-guide-modal {
    width: 100% !important;
    max-width: none !important;
    height: calc(100vh - 24px) !important;
  }

  body.cl-dashboard-redesign-page :is(.flat-modal.cl-common-modal:has(.modal-dialog.sms-number-guide-modal), .flat-modal.cl-source-sms-number-guide-root) .modal-dialog.sms-number-guide-modal .guide-top {
    padding-top: 22px !important;
  }

  body.cl-dashboard-redesign-page :is(.flat-modal.cl-common-modal:has(.modal-dialog.sms-number-guide-modal), .flat-modal.cl-source-sms-number-guide-root) .modal-dialog.sms-number-guide-modal .guide-top .guidetitle {
    margin-right: 38px !important;
    margin-left: 38px !important;
    font-size: 18px !important;
    line-height: 25px !important;
  }

  body.cl-dashboard-redesign-page :is(.flat-modal.cl-common-modal:has(.modal-dialog.sms-number-guide-modal), .flat-modal.cl-source-sms-number-guide-root) .modal-dialog.sms-number-guide-modal .guide-menu li {
    gap: 5px !important;
    height: 60px !important;
    padding-right: 6px !important;
    padding-left: 6px !important;
  }

  body.cl-dashboard-redesign-page :is(.flat-modal.cl-common-modal:has(.modal-dialog.sms-number-guide-modal), .flat-modal.cl-source-sms-number-guide-root) .modal-dialog.sms-number-guide-modal .guide-menu li::before {
    flex-basis: 22px !important;
    width: 22px !important;
    height: 22px !important;
    font-size: 12px !important;
  }

  body.cl-dashboard-redesign-page :is(.flat-modal.cl-common-modal:has(.modal-dialog.sms-number-guide-modal), .flat-modal.cl-source-sms-number-guide-root) .modal-dialog.sms-number-guide-modal .guide-menu li p {
    font-size: 11.5px !important;
  }

  body.cl-dashboard-redesign-page :is(.flat-modal.cl-common-modal:has(.modal-dialog.sms-number-guide-modal), .flat-modal.cl-source-sms-number-guide-root) .modal-dialog.sms-number-guide-modal .sms-number-guide-wrap .step {
    padding: 22px 16px 0 !important;
  }

  body.cl-dashboard-redesign-page :is(.flat-modal.cl-common-modal:has(.modal-dialog.sms-number-guide-modal), .flat-modal.cl-source-sms-number-guide-root) .modal-dialog.sms-number-guide-modal .guideClose {
    width: calc(100% - 32px) !important;
    max-width: none !important;
    padding: 4px 0 24px !important;
  }
}

@media (max-width: 640px) {
  body.cl-dashboard-redesign-page .cl-source-social-guide-modal {
    align-items: stretch !important;
    padding: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-social-guide-modal > .modal-dialog {
    width: 100vw !important;
    max-width: none !important;
    height: 100vh !important;
  }

  body.cl-dashboard-redesign-page .cl-source-social-guide-modal .modal-dialog > .modal-content {
    border-radius: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guide-top {
    padding: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guide-top .guidetitle {
    height: 50px !important;
    margin: 0 !important;
    padding: 0 48px 0 14px !important;
    font-size: 14px !important;
    line-height: 20px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guide-top .guide-menu {
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: none !important;
  }

  body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guide-top .guide-menu::-webkit-scrollbar {
    display: none !important;
  }

  body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guide-menu ul {
    justify-content: flex-start !important;
    gap: 10px !important;
    width: max-content !important;
    min-width: 100% !important;
    padding: 11px 12px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guide-menu ul li {
    flex: 0 0 104px !important;
    width: 104px !important;
    height: 54px !important;
    padding: 2px 6px 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guide-menu ul li p,
  body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guide-menu ul li.active p {
    font-size: 11.5px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-kakao-notice-guide-modal .guide-menu ul li::before {
    font-size: 11.5px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-kakao-notice-guide-modal .guide-menu ul li::after,
  body.cl-dashboard-redesign-page .cl-source-kakao-notice-guide-modal .guide-menu ul li.active::after {
    right: -8px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guide-wrap .step {
    padding: 20px 14px 64px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guideClose {
    padding: 4px 16px 20px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-kakao-notice-guide-modal .guideClose,
  body.cl-dashboard-redesign-page .cl-source-kakao-notice-guide-modal .modal-footer.guideClose {
    width: calc(100% - 32px) !important;
    max-width: none !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-naverpay-guide-modal .guideClose,
  body.cl-dashboard-redesign-page .guidePopup.naverpay-guide-modal .modal-footer.guideClose {
    width: calc(100% - 32px) !important;
    max-width: none !important;
    padding: 4px 0 50px !important;
  }
}

/* ===== Member sub-administrator ===== */
#cl-member-uadmin-page {
  width: auto;
  max-width: none;
  margin-top: 0;
  margin-right: var(--cl-source-app-gutter);
  margin-left: calc(var(--cl-source-app-gutter) + var(--cl-source-sidebar-w));
  padding: 28px 32px 60px;
  background: transparent;
  color: var(--cl-text);
}

#cl-member-uadmin-page,
#cl-member-uadmin-page *,
#cl-member-uadmin-page *::before,
#cl-member-uadmin-page *::after {
  box-sizing: border-box;
}

#cl-member-uadmin-page > .dashbottom-container,
#cl-member-uadmin-page .cl-source-uadmin-content,
#cl-member-uadmin-page .cl-source-uadmin-settings,
#cl-member-uadmin-page .cl-source-uadmin-panel,
#cl-member-uadmin-page .cl-source-uadmin-sections,
#cl-member-uadmin-page .cl-source-uadmin-list {
  float: none;
  width: 100%;
  max-width: none;
  min-height: 0;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}

#cl-member-uadmin-page > .dashbottom-container,
#cl-member-uadmin-page .row {
  margin-right: 0;
  margin-left: 0;
}

#cl-member-uadmin-page #section-top-menu,
#cl-member-uadmin-page .mobile-title,
#cl-member-uadmin-page .submenu_navWrap {
  display: none !important;
}

#cl-member-uadmin-page .cl-source-member-breadcrumb {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 760px;
  max-width: 100%;
  margin: 0 0 18px;
  padding: 0;
  color: var(--cl-text);
  font-size: 20px;
  font-weight: 700;
  line-height: 28px;
}

#cl-member-uadmin-page .cl-source-member-breadcrumb .bc-link,
#cl-member-uadmin-page .cl-source-member-breadcrumb .current {
  display: inline;
  margin: 0;
  padding: 0;
  border: 0;
  color: var(--cl-text);
  font-size: inherit;
  font-weight: 700;
  line-height: inherit;
}

#cl-member-uadmin-page .cl-source-member-breadcrumb .current {
  color: var(--cl-text-sub);
}

#cl-member-uadmin-page .cl-source-member-breadcrumb .sep {
  color: var(--cl-text-muted);
  font-size: 23px;
  font-weight: 400;
  line-height: 1;
}

#cl-member-uadmin-page .cl-source-uadmin-content,
#cl-member-uadmin-page .cl-source-uadmin-settings,
#cl-member-uadmin-page .cl-source-uadmin-panel {
  width: 760px;
  max-width: 100%;
}

#cl-member-uadmin-page .cl-source-uadmin-panel {
  padding: 22px 24px 24px;
  overflow: visible;
  background: var(--cl-surface);
  border: 1px solid var(--cl-border);
  border-radius: var(--cl-radius-lg);
  box-shadow: var(--cl-shadow-panel);
}

#cl-member-uadmin-page .cl-source-uadmin-url-row,
#cl-member-uadmin-page .mng-uadmin .cl-source-uadmin-url-row {
  position: relative;
  display: block;
  width: 100%;
  height: auto;
  margin: 0 0 28px;
  padding: 0;
  overflow: visible;
  background: transparent;
  border: 0;
  color: var(--cl-text-sub);
}

#cl-member-uadmin-page .cl-source-uadmin-url-row .uadmin-login-url {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 48px;
  margin: 0;
  padding: 12px 18px;
  overflow: visible;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: var(--cl-radius-md);
  color: var(--cl-text-sub);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 20px;
}

#cl-member-uadmin-page .cl-source-uadmin-url-row .uadmin-login-url .title {
  flex: 0 0 auto;
  margin: 0;
  color: var(--cl-text-sub);
  font-size: 13.5px;
  font-weight: 600;
  line-height: 20px;
  white-space: nowrap;
}

#cl-member-uadmin-page .cl-source-uadmin-url-row .uadmin-login-url i.line {
  display: block;
  flex: 0 0 1px;
  width: 1px;
  height: 16px;
  margin: 0;
  background: var(--cl-border);
}

#cl-member-uadmin-page .cl-source-uadmin-url-row .uadmin-login-url .url,
#cl-member-uadmin-page .cl-source-uadmin-url-row .uadmin-login-url .url:hover,
#cl-member-uadmin-page .cl-source-uadmin-url-row .uadmin-login-url .url:focus {
  display: block;
  flex: 0 1 auto;
  min-width: 0;
  margin: 0;
  overflow: hidden;
  color: var(--cl-green-text);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 20px;
  text-decoration: none;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#cl-member-uadmin-page .cl-source-uadmin-copy-icon,
#cl-member-uadmin-page .cl-source-uadmin-url-row .uadmin-login-url .url + svg {
  display: block;
  flex: 0 0 15px;
  width: 15px;
  height: 15px;
  margin: 0;
  color: var(--cl-green);
  fill: none;
  cursor: pointer;
}

#cl-member-uadmin-page .cl-source-uadmin-copy-button,
#cl-member-uadmin-page .cl-source-uadmin-copy-button:hover,
#cl-member-uadmin-page .cl-source-uadmin-copy-button:focus,
#cl-member-uadmin-page .cl-source-uadmin-copy-button:active {
  position: relative;
  display: inline-flex;
  flex: 0 0 20px;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 4px;
  box-shadow: none;
  color: var(--cl-green);
  outline: 0;
  cursor: pointer;
}

#cl-member-uadmin-page .cl-source-uadmin-copy-button:focus-visible {
  box-shadow: 0 0 0 2px rgba(3, 199, 90, .18);
}

#cl-member-uadmin-page .cl-source-uadmin-copy-button .cl-source-uadmin-copy-icon {
  display: block;
  flex: 0 0 15px;
  width: 15px;
  height: 15px;
  margin: 0;
  fill: none;
  color: currentColor;
  pointer-events: none;
}

#cl-member-uadmin-page .cl-source-uadmin-copy-tooltip {
  position: absolute;
  right: -8px;
  bottom: calc(100% + 8px);
  z-index: 20;
  display: block;
  width: max-content;
  max-width: 220px;
  padding: 6px 9px;
  visibility: hidden;
  background: #2d343e;
  border-radius: 4px;
  box-shadow: 0 4px 12px rgba(20, 24, 32, .16);
  color: #fff;
  font-size: 12px;
  font-weight: 400;
  line-height: 17px;
  text-align: center;
  white-space: nowrap;
  opacity: 0;
  transform: translateY(3px);
  transition: opacity .14s ease, transform .14s ease, visibility .14s ease;
  pointer-events: none;
}

#cl-member-uadmin-page .cl-source-uadmin-copy-tooltip::after {
  position: absolute;
  top: 100%;
  right: 13px;
  width: 0;
  height: 0;
  border-top: 5px solid #2d343e;
  border-right: 5px solid transparent;
  border-left: 5px solid transparent;
  content: '';
}

#cl-member-uadmin-page .cl-source-uadmin-copy-button.is-copied .cl-source-uadmin-copy-tooltip {
  visibility: visible;
  opacity: 1;
  transform: translateY(0);
}

#cl-member-uadmin-page .cl-source-uadmin-section-head,
#cl-member-uadmin-page .mng-settings[data-type="uadmin-list"] .cl-source-uadmin-section-head {
  display: flex;
  float: none;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: auto;
  margin: 0 0 10px;
  padding: 0;
  color: var(--cl-text);
}

#cl-member-uadmin-page .mng-settings[data-type="uadmin-list"] .cl-source-uadmin-list + .cl-source-uadmin-section-head {
  margin-top: 32px;
}

#cl-member-uadmin-page .cl-source-uadmin-section-head .uadminTitle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 0;
  padding: 0;
  color: var(--cl-text);
  font-size: 15px;
  font-weight: 700;
  line-height: 20px;
}

#cl-member-uadmin-page .cl-source-uadmin-section-head .cm-popover-info {
  display: block;
  flex: 0 0 14px;
  align-self: center;
  width: 14px;
  height: 14px;
  margin: 0;
  fill: var(--cl-accent-blue);
  transform: none !important;
  vertical-align: middle;
}

body.cl-dashboard-redesign-page #cl-member-uadmin-page .popover {
  z-index: 1300 !important;
}

#cl-member-uadmin-page .cl-source-uadmin-section-head > .addUAdmin,
#cl-member-uadmin-page .cl-source-uadmin-section-head > .addUAdmin:hover,
#cl-member-uadmin-page .cl-source-uadmin-section-head > .addUAdmin:focus,
#cl-member-uadmin-page .cl-source-uadmin-section-head > .addUAdmin:active {
  display: inline-flex;
  float: none !important;
  align-items: center;
  justify-content: center;
  gap: 5px;
  width: auto;
  max-width: none;
  height: 35px;
  margin: 0;
  padding: 0 16px;
  background: var(--cl-green);
  border: 1px solid var(--cl-green);
  border-radius: var(--cl-radius-sm);
  box-shadow: none;
  color: #fff;
  font-size: 13px;
  font-weight: 600;
  line-height: 18px;
  text-decoration: none;
}

#cl-member-uadmin-page .cl-source-uadmin-section-head > .addUAdmin:hover,
#cl-member-uadmin-page .cl-source-uadmin-section-head > .addUAdmin:focus,
#cl-member-uadmin-page .cl-source-uadmin-section-head > .addUAdmin:active {
  background: var(--cl-green-hover);
  border-color: var(--cl-green-hover);
}

#cl-member-uadmin-page .cl-source-uadmin-section-head > .addUAdmin svg {
  flex: 0 0 11px;
  width: 11px;
  height: 11px;
  margin: 0;
  fill: currentColor;
  transform: none;
}

#cl-member-uadmin-page .cl-source-uadmin-section-head > .addUAdmin.member_disabled {
  background: #c9cdd3;
  border-color: #c9cdd3;
  cursor: default;
}

body.cl-dashboard-redesign-page #cl-member-uadmin-page .cl-source-uadmin-section-head > .addUAdmin.member_disabled,
body.cl-dashboard-redesign-page #cl-member-uadmin-page .cl-source-uadmin-section-head > .addUAdmin.ss_user_noActive,
body.cl-dashboard-redesign-page #cl-member-uadmin-page .cl-source-uadmin-section-head > .addUAdmin.member_disabled:hover,
body.cl-dashboard-redesign-page #cl-member-uadmin-page .cl-source-uadmin-section-head > .addUAdmin.ss_user_noActive:hover,
body.cl-dashboard-redesign-page #cl-member-uadmin-page .cl-source-uadmin-section-head > .addUAdmin.member_disabled:focus,
body.cl-dashboard-redesign-page #cl-member-uadmin-page .cl-source-uadmin-section-head > .addUAdmin.ss_user_noActive:focus,
body.cl-dashboard-redesign-page #cl-member-uadmin-page .cl-source-uadmin-section-head > .addUAdmin.member_disabled:active,
body.cl-dashboard-redesign-page #cl-member-uadmin-page .cl-source-uadmin-section-head > .addUAdmin.ss_user_noActive:active {
  background: #fff !important;
  border: 1px solid var(--cl-disabled-button-border, #aeb5bf) !important;
  box-shadow: none !important;
  color: var(--cl-text-muted) !important;
  opacity: 1 !important;
  cursor: default !important;
  pointer-events: auto !important;
}

body.cl-dashboard-redesign-page #cl-member-uadmin-page .cl-source-uadmin-section-head > .addUAdmin:is(.member_disabled, .ss_user_noActive) svg {
  fill: currentColor !important;
}

#cl-member-uadmin-page .cl-source-uadmin-list,
#cl-member-uadmin-page .cl-source-uadmin-list .table-wrap {
  width: 100%;
  margin: 0;
  padding: 0;
  overflow: visible;
  border: 0;
}

#cl-member-uadmin-page .mng-settings[data-type="uadmin-list"] .cl-source-uadmin-table {
  table-layout: fixed;
  width: 100%;
  min-width: 0;
  margin: 0;
  border-collapse: collapse;
  border-spacing: 0;
  color: var(--cl-text);
  font-size: 13.5px;
}

#cl-member-uadmin-page .cl-source-uadmin-table > thead > tr > th,
#cl-member-uadmin-page .mng-settings[data-type="uadmin-list"] .cl-source-uadmin-table > thead > tr > th {
  height: 42px;
  padding: 10px;
  background: #fafbfc;
  border-top: 1px solid var(--cl-border);
  border-right: 0;
  border-bottom: 1px solid var(--cl-border);
  border-left: 0;
  color: var(--cl-text-sub);
  font-size: 12.5px;
  font-weight: 600;
  line-height: 20px;
  text-align: center;
  vertical-align: middle;
}

#cl-member-uadmin-page .cl-source-uadmin-table > tbody > tr > td,
#cl-member-uadmin-page .mng-settings[data-type="uadmin-list"] .cl-source-uadmin-table > tbody > tr > td {
  height: 48px;
  padding: 12px 10px;
  background: #fff;
  border-right: 0;
  border-bottom: 1px solid var(--cl-border);
  border-left: 0;
  color: var(--cl-text);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 20px;
  text-align: center;
  vertical-align: middle;
}

#cl-member-uadmin-page .cl-source-uadmin-table > tbody > tr:not(.listZero):hover > td {
  background: var(--cl-green-tint);
}

#cl-member-uadmin-page .cl-source-uadmin-table > tbody > tr.listZero:hover > td {
  background: #fff;
}

#cl-member-uadmin-page .cl-source-uadmin-table > tbody > tr.listZero > td,
#cl-member-uadmin-page .mng-settings[data-type="uadmin-list"] .cl-source-uadmin-table > tbody > tr.listZero > td {
  width: 100%;
  height: 140px;
  padding: 60px 10px;
  color: var(--cl-text-muted);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 20px;
  text-align: center;
}

#cl-member-uadmin-page .cl-source-uadmin-table .uadm-memo-str {
  display: inline-block;
  max-width: calc(100% - 40px);
  overflow: hidden;
  line-height: 20px;
  text-overflow: ellipsis;
  vertical-align: middle;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page #cl-member-uadmin-page .cl-source-uadmin-table :is(.uadm-memo-edit, .uadm-delete),
body.cl-dashboard-redesign-page #cl-member-leavelist-page .cl-source-leave-delete {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: 28px;
  height: 28px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: var(--cl-text-sub);
  font-size: 0;
  line-height: 1;
  vertical-align: middle;
  cursor: pointer;
  transition: background .12s, color .12s;
}

body.cl-dashboard-redesign-page #cl-member-uadmin-page .cl-source-uadmin-table .uadm-memo-edit {
  display: none;
  margin-left: 6px;
}

body.cl-dashboard-redesign-page #cl-member-uadmin-page .cl-source-uadmin-table .uadm-memo-str:not(:empty) ~ .uadm-memo-edit.edit,
body.cl-dashboard-redesign-page #cl-member-uadmin-page .cl-source-uadmin-table .uadm-memo-str:empty ~ .uadm-memo-edit.new {
  display: inline-flex;
}

body.cl-dashboard-redesign-page #cl-member-uadmin-page .cl-source-uadmin-table .uadm-memo-edit:is(:hover, :focus-visible) {
  background: var(--cl-green-soft);
  color: var(--cl-green);
}

body.cl-dashboard-redesign-page #cl-member-uadmin-page .cl-source-uadmin-table .uadm-delete:is(:hover, :focus-visible) {
  background: rgba(238, 68, 95, .1);
  color: var(--cl-danger);
}

body.cl-dashboard-redesign-page #cl-member-uadmin-page .cl-source-uadmin-table :is(.uadm-memo-edit, .uadm-delete):focus-visible,
body.cl-dashboard-redesign-page #cl-member-leavelist-page .cl-source-leave-delete:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 2px;
}

body.cl-dashboard-redesign-page #cl-member-uadmin-page .cl-source-uadmin-table :is(.uadm-memo-edit, .uadm-delete) svg,
body.cl-dashboard-redesign-page #cl-member-leavelist-page .cl-source-leave-delete svg {
  display: block;
  width: 15px;
  height: 15px;
  fill: currentColor;
}

body.cl-dashboard-redesign-page #cl-member-leavelist-page .cl-source-leave-delete svg {
  fill: none;
  stroke: currentColor;
}

@media (max-width: 900px) {
  #cl-member-uadmin-page {
    margin-right: 0;
    margin-left: 0;
  }
}

@media (max-width: 640px) {
  #cl-member-uadmin-page {
    padding: 20px 14px 40px;
  }

  #cl-member-uadmin-page .cl-source-uadmin-panel {
    padding: 18px 16px;
  }

  #cl-member-uadmin-page .cl-source-uadmin-url-row .uadmin-login-url {
    flex-wrap: wrap;
    gap: 6px 9px;
    padding: 12px 14px;
  }

  #cl-member-uadmin-page .cl-source-uadmin-url-row .uadmin-login-url .title {
    flex-basis: calc(100% - 24px);
  }

  #cl-member-uadmin-page .cl-source-uadmin-url-row .uadmin-login-url i.line {
    display: none;
  }

  #cl-member-uadmin-page .cl-source-uadmin-list .table-wrap {
    overflow-x: auto;
  }

  #cl-member-uadmin-page .mng-settings[data-type="uadmin-list"] .cl-source-uadmin-table {
    min-width: 640px;
  }
}

/* v2 account setup fields shown after checking an administrator email. */
body.cl-dashboard-redesign-page .flat-modal > .modal.cl-source-uadmin-admin-setup-modal {
  align-items: flex-start !important;
  padding: 40px 20px !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-admin-setup-modal > .modal-dialog.join-modal {
  max-width: 100% !important;
  flex: 0 1 560px;
}

body.cl-dashboard-redesign-page .flat-modal > .modal.cl-source-uadmin-admin-setup-modal > .modal-dialog._admin.join-modal.cl-p130,
body.cl-dashboard-redesign-page .flat-modal > .modal.cl-source-uadmin-admin-setup-modal > .modal-dialog._admin.join-modal.cl-p130 > .modal-content {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .flat-modal > .modal.cl-source-uadmin-admin-setup-modal > .modal-dialog._admin.join-modal.cl-p130 > .modal-content {
  padding: 44px 44px 34px !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-admin-setup-modal .modal-dialog.join-modal .modal-title {
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-admin-setup-modal .modal-dialog.join-modal .uadmin-txt {
  margin: 0 0 30px !important;
  overflow-wrap: anywhere;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-admin-setup-modal .modal-dialog.join-modal .point {
  font-weight: 600 !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-admin-setup-modal .modal-dialog.join-modal .input-group {
  float: none !important;
  margin: 22px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-admin-setup-modal .modal-dialog.join-modal .cl-common-form-group {
  position: relative !important;
  float: none !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-admin-setup-modal .modal-dialog.join-modal input.form-control {
  height: 46px !important;
  padding: 13px 14px !important;
  font-size: 14px !important;
  line-height: 20px !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-admin-setup-modal .modal-dialog.join-modal .cl-common-control-label {
  top: 0 !important;
  left: 12px !important;
  padding: 0 5px !important;
  background: #fff !important;
  font-size: 11.5px !important;
  line-height: 16px !important;
  transform: translateY(-50%) !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-admin-setup-modal .modal-dialog.join-modal .uadmin-txt + .input-group {
  margin: 0 0 24px !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-admin-setup-modal .modal-dialog.join-modal .input-group-addon {
  min-width: 0 !important;
  margin: 0 0 8px !important;
  padding: 0 !important;
  color: var(--cl-text-muted) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-admin-setup-modal .modal-dialog.join-modal input.form-control[readonly] {
  height: 54px !important;
  padding: 15px !important;
  background: #f5f6f8 !important;
  color: var(--cl-text) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-admin-setup-modal .modal-dialog.join-modal :is(.mng-error, .mng-textinfo) {
  margin: 8px 0 0 !important;
  padding: 0 0 0 2px !important;
  font-size: 12.5px !important;
  line-height: 18px !important;
  overflow-wrap: anywhere;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-admin-setup-modal .modal-dialog.join-modal .mng-error {
  color: #e5566e !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-admin-setup-modal .modal-dialog.join-modal .mng-error + .mng-textinfo {
  margin-top: 3px !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-admin-setup-modal .modal-dialog.join-modal .hide,
body.cl-dashboard-redesign-page .cl-source-uadmin-admin-setup-modal .modal-dialog.join-modal .mng-textinfo:empty {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal > .modal.cl-source-uadmin-admin-setup-modal > .modal-dialog._admin.join-modal.cl-p130 .modal-footer {
  position: static !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 0 !important;
  width: 100% !important;
  max-width: none !important;
  margin: 26px 0 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal > .modal.cl-source-uadmin-admin-setup-modal > .modal-dialog._admin.join-modal.cl-p130 .modal-footer .btn {
  width: 100% !important;
  max-width: none !important;
  flex: none !important;
  border: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal > .modal.cl-source-uadmin-admin-setup-modal > .modal-dialog._admin.join-modal.cl-p130 .modal-footer .ok-button-dialog {
  height: 48px !important;
  border-radius: 9px !important;
  font-size: 15px !important;
  color: #fff !important;
  background: var(--cl-green) !important;
}

body.cl-dashboard-redesign-page .flat-modal > .modal.cl-source-uadmin-admin-setup-modal > .modal-dialog._admin.join-modal.cl-p130 .modal-footer .ok-button-dialog:is(:hover, :focus) {
  background: var(--cl-green-hover) !important;
}

body.cl-dashboard-redesign-page .flat-modal > .modal.cl-source-uadmin-admin-setup-modal > .modal-dialog._admin.join-modal.cl-p130 .modal-footer .close-button-dialog {
  height: 42px !important;
  min-height: 42px !important;
  font-size: 14px !important;
  background: transparent !important;
  color: var(--cl-text-sub) !important;
}

body.cl-dashboard-redesign-page .flat-modal > .modal.cl-source-uadmin-admin-setup-modal > .modal-dialog._admin.join-modal.cl-p130 .modal-footer .close-button-dialog:is(:hover, :focus) {
  background: var(--cl-green-soft) !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-modal-root + .modal-backdrop {
  display: none !important;
  opacity: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-modal {
  position: fixed !important;
  inset: 0 !important;
  z-index: 1200 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100vw !important;
  height: 100vh !important;
  padding: 20px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  background: rgba(0, 0, 0, .45) !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-modal > .cl-mobile-btn {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-modal > .modal-dialog {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  width: 460px !important;
  max-width: 94vw !important;
  margin: 0 auto !important;
  padding: 0 !important;
  overflow: visible !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-admin-modal > .modal-dialog {
  width: 560px !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-dialog.cl-source-uadmin-admin-dialog {
  width: 560px !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-admin-setup-modal {
  align-items: flex-start !important;
  padding: 40px 20px !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-modal > .modal-dialog > .modal-content {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  min-height: 0 !important;
  padding: 28px 30px 26px !important;
  overflow: visible !important;
  background: #fff !important;
  border: 0 !important;
  border-radius: 16px !important;
  box-shadow: 0 20px 50px rgba(20, 24, 32, .25) !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-admin-modal > .modal-dialog > .modal-content {
  padding: 44px 44px 34px !important;
  border-radius: 18px !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-admin-dialog > .modal-content {
  padding: 44px 44px 34px !important;
  border: 0 !important;
  border-radius: 18px !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-modal .modal-content > .close {
  position: absolute !important;
  top: 16px !important;
  right: 16px !important;
  z-index: 4 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub) !important;
  opacity: 1 !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-modal .modal-content > .close:hover,
body.cl-dashboard-redesign-page .cl-source-uadmin-modal .modal-content > .close:focus {
  background: #f1f2f5 !important;
  color: var(--cl-text) !important;
  outline: 0 !important;
  transform: rotate(90deg) !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-modal .modal-content > .close svg {
  display: block !important;
  width: 9px !important;
  height: 9px !important;
  fill: currentColor !important;
  stroke: currentColor !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-modal .modal-body {
  width: 100% !important;
  max-width: none !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-modal .modal-title {
  margin: 0 36px 24px !important;
  color: var(--cl-text) !important;
  font-size: 19px !important;
  font-weight: 800 !important;
  line-height: 26px !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-admin-modal .modal-title {
  margin-bottom: 22px !important;
  font-size: 21px !important;
  line-height: 29px !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-admin-dialog .modal-title {
  margin-bottom: 22px !important;
  font-size: 21px !important;
  line-height: 29px !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-modal .uadmin-wrap,
body.cl-dashboard-redesign-page .cl-source-uadmin-modal .form-group {
  width: 100% !important;
  max-width: none !important;
  margin-right: 0 !important;
  margin-left: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-modal .uadmin-txt {
  margin: 0 0 24px !important;
  color: var(--cl-text-sub) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.65 !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-admin-modal .uadmin-txt {
  margin-bottom: 26px !important;
  font-size: 15px !important;
  line-height: 1.6 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-admin-dialog .uadmin-txt {
  margin-bottom: 26px !important;
  font-size: 15px !important;
  line-height: 1.6 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-add-dialog .uadmin-wrap {
  min-height: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-add-dialog .uadmin-wrap .input-group.cl-common-form-wrap {
  display: block !important;
  width: 100% !important;
  height: 46px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-add-dialog .uadmin-wrap .cl-common-form-group {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  height: 46px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-add-dialog .uadmin-wrap .cl-common-form-group:focus-within {
  border-color: var(--cl-green) !important;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .1) !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-add-dialog .uadmin-wrap input.add-uadmin-input,
body.cl-dashboard-redesign-page .cl-source-uadmin-add-dialog .uadmin-wrap input.add-uadmin-input:hover,
body.cl-dashboard-redesign-page .cl-source-uadmin-add-dialog .uadmin-wrap input.add-uadmin-input:focus {
  display: block !important;
  width: 100% !important;
  height: 44px !important;
  margin: 0 !important;
  padding: 17px 16px 5px !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-modal .uadmin-txt .point,
body.cl-dashboard-redesign-page .cl-source-uadmin-modal .point2 {
  color: var(--cl-text) !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-modal .input-group,
body.cl-dashboard-redesign-page .cl-source-uadmin-modal .cl-common-form-wrap,
body.cl-dashboard-redesign-page .cl-source-uadmin-modal .cl-common-form-group {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  margin-right: 0 !important;
  margin-left: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-modal :is(input.form-control, input.add-uadmin-input, textarea.form-control),
body.cl-dashboard-redesign-page .cl-source-uadmin-modal :is(input.form-control, input.add-uadmin-input, textarea.form-control):hover,
body.cl-dashboard-redesign-page .cl-source-uadmin-modal :is(input.form-control, input.add-uadmin-input, textarea.form-control):focus {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  height: 44px !important;
  margin: 0 !important;
  padding: 17px 13px 5px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-modal :is(input.form-control, input.add-uadmin-input, textarea.form-control):focus {
  border-color: var(--cl-green) !important;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .1) !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-modal textarea#uadm-memo,
body.cl-dashboard-redesign-page .cl-source-uadmin-modal textarea#uadm-memo:hover,
body.cl-dashboard-redesign-page .cl-source-uadmin-modal textarea#uadm-memo:focus {
  min-height: 130px !important;
  padding: 12px !important;
  resize: vertical !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-modal .cl-common-control-label {
  position: absolute !important;
  top: 7px !important;
  left: 13px !important;
  z-index: 1 !important;
  margin: 0 !important;
  color: var(--cl-text-muted) !important;
  font-size: 10.5px !important;
  font-weight: 400 !important;
  line-height: 12px !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-modal .input-group-addon {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 0 6px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  line-height: 18px !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-modal input.form-control[readonly] {
  padding: 0 13px !important;
  background: #fafbfc !important;
  color: var(--cl-text-sub) !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-modal .mng-error,
body.cl-dashboard-redesign-page .cl-source-uadmin-modal .mng-textinfo {
  display: block !important;
  margin: 6px 0 12px !important;
  font-size: 11.5px !important;
  font-weight: 400 !important;
  line-height: 17px !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-modal .mng-error {
  color: var(--cl-danger) !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-modal .mng-textinfo {
  color: var(--cl-text-muted) !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-modal .modal-footer {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  width: 100% !important;
  margin: 24px 0 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-admin-modal .modal-footer {
  flex-direction: column !important;
  gap: 0 !important;
  margin-top: 30px !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-add-dialog > .modal-content > .modal-footer {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  gap: 0 !important;
  width: 100% !important;
  margin: 30px 0 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-modal .modal-footer .btn,
body.cl-dashboard-redesign-page .cl-source-uadmin-modal .modal-footer .btn:hover,
body.cl-dashboard-redesign-page .cl-source-uadmin-modal .modal-footer .btn:focus {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 74px !important;
  height: 40px !important;
  margin: 0 !important;
  padding: 0 20px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: var(--cl-radius-sm) !important;
  box-shadow: none !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  line-height: 18px !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-modal .modal-footer .ok-button-dialog,
body.cl-dashboard-redesign-page .cl-source-uadmin-modal .modal-footer .ok-button-dialog:hover,
body.cl-dashboard-redesign-page .cl-source-uadmin-modal .modal-footer .ok-button-dialog:focus {
  background: var(--cl-green) !important;
  border-color: var(--cl-green) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-modal .modal-footer .ok-button-dialog:hover {
  background: var(--cl-green-hover) !important;
  border-color: var(--cl-green-hover) !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-admin-modal .modal-footer .btn,
body.cl-dashboard-redesign-page .cl-source-uadmin-admin-modal .modal-footer .btn:hover,
body.cl-dashboard-redesign-page .cl-source-uadmin-admin-modal .modal-footer .btn:focus {
  width: 100% !important;
  height: 45px !important;
  padding: 0 16px !important;
  border: 0 !important;
  border-radius: 9px !important;
  font-size: 13.5px !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-admin-modal .modal-footer .ok-button-dialog,
body.cl-dashboard-redesign-page .cl-source-uadmin-admin-modal .modal-footer .ok-button-dialog:hover,
body.cl-dashboard-redesign-page .cl-source-uadmin-admin-modal .modal-footer .ok-button-dialog:focus {
  height: 46px !important;
  border-radius: 10px !important;
  color: #fff !important;
  font-size: 16px !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-admin-modal .modal-footer .close-button-dialog,
body.cl-dashboard-redesign-page .cl-source-uadmin-admin-modal .modal-footer .close-button-dialog:hover,
body.cl-dashboard-redesign-page .cl-source-uadmin-admin-modal .modal-footer .close-button-dialog:focus {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: none !important;
  height: 46px !important;
  min-height: 46px !important;
  margin: 14px 0 0 !important;
  padding: 0 16px !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 9px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
}

body.cl-dashboard-redesign-page .cl-source-uadmin-admin-modal .modal-footer .close-button-dialog:hover,
body.cl-dashboard-redesign-page .cl-source-uadmin-admin-modal .modal-footer .close-button-dialog:focus {
  background: #eaf9f1 !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .flat-modal > .cl-source-uadmin-modal > .modal-dialog._admin.add-modal.cl-source-uadmin-add-dialog > .modal-content > .modal-footer .btn,
body.cl-dashboard-redesign-page .flat-modal > .cl-source-uadmin-modal > .modal-dialog._admin.add-modal.cl-source-uadmin-add-dialog > .modal-content > .modal-footer .btn:hover,
body.cl-dashboard-redesign-page .flat-modal > .cl-source-uadmin-modal > .modal-dialog._admin.add-modal.cl-source-uadmin-add-dialog > .modal-content > .modal-footer .btn:focus {
  float: none !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin-right: 0 !important;
  margin-left: 0 !important;
  padding-right: 16px !important;
  padding-left: 16px !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .flat-modal > .cl-source-uadmin-modal > .modal-dialog._admin.add-modal.cl-source-uadmin-add-dialog > .modal-content > .modal-footer .ok-button-dialog,
body.cl-dashboard-redesign-page .flat-modal > .cl-source-uadmin-modal > .modal-dialog._admin.add-modal.cl-source-uadmin-add-dialog > .modal-content > .modal-footer .ok-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal > .cl-source-uadmin-modal > .modal-dialog._admin.add-modal.cl-source-uadmin-add-dialog > .modal-content > .modal-footer .ok-button-dialog:focus {
  height: 50px !important;
  background: var(--cl-green) !important;
  border: 0 !important;
  border-radius: 10px !important;
  color: #fff !important;
  font-size: 16px !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page .flat-modal > .cl-source-uadmin-modal > .modal-dialog._admin.add-modal.cl-source-uadmin-add-dialog > .modal-content > .modal-footer .close-button-dialog,
body.cl-dashboard-redesign-page .flat-modal > .cl-source-uadmin-modal > .modal-dialog._admin.add-modal.cl-source-uadmin-add-dialog > .modal-content > .modal-footer .close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal > .cl-source-uadmin-modal > .modal-dialog._admin.add-modal.cl-source-uadmin-add-dialog > .modal-content > .modal-footer .close-button-dialog:focus {
  height: 46px !important;
  min-height: 46px !important;
  margin: 14px 0 0 !important;
  padding: 0 16px !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 9px !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
}

body.cl-dashboard-redesign-page .flat-modal > .cl-source-uadmin-modal > .modal-dialog._admin.add-modal.cl-source-uadmin-add-dialog > .modal-content > .modal-footer .close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal > .cl-source-uadmin-modal > .modal-dialog._admin.add-modal.cl-source-uadmin-add-dialog > .modal-content > .modal-footer .close-button-dialog:focus {
  background: #eaf9f1 !important;
  color: var(--cl-green-text) !important;
}

/* Sub-admin add modal: stable legacy DOM override */
body.cl-dashboard-redesign-page.cl-member-uadmin-page-active .flat-modal > .modal.modal-default > .modal-dialog._admin.add-modal.cl-p130 {
  width: 560px !important;
  max-width: 92vw !important;
  margin-right: auto !important;
  margin-left: auto !important;
}

body.cl-dashboard-redesign-page.cl-member-uadmin-page-active .flat-modal > .modal.modal-default > .modal-dialog._admin.add-modal.cl-p130 > .modal-content {
  width: 100% !important;
  min-height: 0 !important;
  padding: 44px 44px 34px !important;
  background: #fff !important;
  border: 0 !important;
  border-radius: 18px !important;
  box-shadow: 0 20px 50px rgba(20, 24, 32, .25) !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page.cl-member-uadmin-page-active .flat-modal > .modal.modal-default > .modal-dialog._admin.add-modal.cl-p130 .modal-body {
  width: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page.cl-member-uadmin-page-active .flat-modal > .modal.modal-default > .modal-dialog._admin.add-modal.cl-p130 .modal-title {
  margin: 0 36px 22px !important;
  color: var(--cl-text) !important;
  font-size: 21px !important;
  font-weight: 800 !important;
  line-height: 29px !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page.cl-member-uadmin-page-active .flat-modal > .modal.modal-default > .modal-dialog._admin.add-modal.cl-p130 .uadmin-wrap {
  width: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page.cl-member-uadmin-page-active .flat-modal > .modal.modal-default > .modal-dialog._admin.add-modal.cl-p130 .uadmin-txt {
  width: 320px !important;
  max-width: 100% !important;
  margin: 0 auto 26px !important;
  color: var(--cl-text-sub) !important;
  font-size: 15px !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
  text-align: center !important;
  word-break: keep-all !important;
}

body.cl-dashboard-redesign-page.cl-member-uadmin-page-active .flat-modal > .modal.modal-default > .modal-dialog._admin.add-modal.cl-p130 .uadmin-txt .point {
  color: var(--cl-text) !important;
  font-size: inherit !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page.cl-member-uadmin-page-active .flat-modal > .modal.modal-default > .modal-dialog._admin.add-modal.cl-p130 .uadmin-wrap .input-group.cl-common-form-wrap {
  display: block !important;
  float: none !important;
  clear: both !important;
  width: 100% !important;
  height: 44px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page.cl-member-uadmin-page-active .flat-modal > .modal.modal-default > .modal-dialog._admin.add-modal.cl-p130 .uadmin-wrap .cl-common-form-group {
  position: relative !important;
  display: block !important;
  float: none !important;
  width: 100% !important;
  height: 44px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page.cl-member-uadmin-page-active .cl-source-uadmin-error-slot {
  display: block !important;
  clear: both !important;
  width: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page.cl-member-uadmin-page-active .cl-source-uadmin-error-slot:not(:empty) {
  margin-top: 5px !important;
}

body.cl-dashboard-redesign-page.cl-member-uadmin-page-active .cl-source-uadmin-error-slot > .mng-error {
  display: block !important;
  margin: 0 !important;
  padding: 0 0 0 5px !important;
}

body.cl-dashboard-redesign-page.cl-member-uadmin-page-active .flat-modal > .modal.modal-default > .modal-dialog._admin.add-modal.cl-p130 .uadmin-wrap input.add-uadmin-input,
body.cl-dashboard-redesign-page.cl-member-uadmin-page-active .flat-modal > .modal.modal-default > .modal-dialog._admin.add-modal.cl-p130 .uadmin-wrap input.add-uadmin-input:hover,
body.cl-dashboard-redesign-page.cl-member-uadmin-page-active .flat-modal > .modal.modal-default > .modal-dialog._admin.add-modal.cl-p130 .uadmin-wrap input.add-uadmin-input:focus {
  display: block !important;
  width: 100% !important;
  height: 44px !important;
  margin: 0 !important;
  padding: 13px 14px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page.cl-member-uadmin-page-active .flat-modal > .modal.modal-default > .modal-dialog._admin.add-modal.cl-p130 .uadmin-wrap input.add-uadmin-input:focus {
  border-color: var(--cl-green) !important;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .12) !important;
}

body.cl-dashboard-redesign-page.cl-member-uadmin-page-active .cl-source-uadmin-email-label {
  position: absolute !important;
  top: 0 !important;
  left: 12px !important;
  z-index: 2 !important;
  display: block !important;
  margin: 0 !important;
  padding: 0 5px !important;
  background: #fff !important;
  color: var(--cl-text-muted) !important;
  font-size: 11.5px !important;
  font-weight: 400 !important;
  line-height: 16px !important;
  transform: translateY(-50%) !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page.cl-member-uadmin-page-active .flat-modal > .modal.modal-default > .modal-dialog._admin.add-modal.cl-p130 > .modal-content > .modal-footer {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  gap: 0 !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 26px 0 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

body.cl-dashboard-redesign-page.cl-member-uadmin-page-active .flat-modal > .modal.modal-default > .modal-dialog._admin.add-modal.cl-p130 > .modal-content > .modal-footer .btn,
body.cl-dashboard-redesign-page.cl-member-uadmin-page-active .flat-modal > .modal.modal-default > .modal-dialog._admin.add-modal.cl-p130 > .modal-content > .modal-footer .btn:hover,
body.cl-dashboard-redesign-page.cl-member-uadmin-page-active .flat-modal > .modal.modal-default > .modal-dialog._admin.add-modal.cl-p130 > .modal-content > .modal-footer .btn:focus {
  float: none !important;
  display: flex !important;
  flex: 0 0 auto !important;
  align-self: stretch !important;
  box-sizing: border-box !important;
  width: 100% !important;
  inline-size: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  max-inline-size: none !important;
  margin-right: 0 !important;
  margin-left: 0 !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page.cl-member-uadmin-page-active .flat-modal > .modal.modal-default > .modal-dialog._admin.add-modal.cl-p130 > .modal-content > .modal-footer .ok-button-dialog,
body.cl-dashboard-redesign-page.cl-member-uadmin-page-active .flat-modal > .modal.modal-default > .modal-dialog._admin.add-modal.cl-p130 > .modal-content > .modal-footer .ok-button-dialog:hover,
body.cl-dashboard-redesign-page.cl-member-uadmin-page-active .flat-modal > .modal.modal-default > .modal-dialog._admin.add-modal.cl-p130 > .modal-content > .modal-footer .ok-button-dialog:focus {
  height: 50px !important;
  padding: 0 16px !important;
  background: var(--cl-green) !important;
  border: 0 !important;
  border-radius: 9px !important;
  color: #fff !important;
  font-size: 15px !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page.cl-member-uadmin-page-active .flat-modal > .modal.modal-default > .modal-dialog._admin.add-modal.cl-p130 > .modal-content > .modal-footer .close-button-dialog {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: none !important;
  height: 46px !important;
  min-height: 46px !important;
  margin: 14px 0 0 !important;
  padding: 0 16px !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 9px !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page.cl-member-uadmin-page-active .flat-modal > .modal.modal-default > .modal-dialog._admin.add-modal.cl-p130 > .modal-content > .modal-footer .close-button-dialog:hover,
body.cl-dashboard-redesign-page.cl-member-uadmin-page-active .flat-modal > .modal.modal-default > .modal-dialog._admin.add-modal.cl-p130 > .modal-content > .modal-footer .close-button-dialog:focus {
  background: #eaf9f1 !important;
  color: var(--cl-green-text) !important;
  outline: 0 !important;
}

/* 레거시 모바일 모달의 height: 100%를 해제해 내용이 짧은 팝업의 하단 공백을 방지한다. */
@media (max-width: 767px) {
  body.cl-dashboard-redesign-page .cl-source-uadmin-modal > .modal-dialog,
  body.cl-dashboard-redesign-page.cl-member-uadmin-page-active .flat-modal > .modal.modal-default > .modal-dialog._admin.cl-cmmodal {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
  }

  body.cl-dashboard-redesign-page .cl-source-uadmin-modal > .modal-dialog > .modal-content,
  body.cl-dashboard-redesign-page.cl-member-uadmin-page-active .flat-modal > .modal.modal-default > .modal-dialog._admin.cl-cmmodal > .modal-content {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
  }
}

@media (max-width: 520px) {
  body.cl-dashboard-redesign-page .cl-source-uadmin-modal {
    padding: 12px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-uadmin-modal > .modal-dialog {
    width: 100% !important;
    max-width: none !important;
  }

  body.cl-dashboard-redesign-page .cl-source-uadmin-modal > .modal-dialog > .modal-content {
    padding: 24px 18px 20px !important;
  }
}

/* ===== Shopping product manager ===== */
#cl-shopping-product-page {
  width: auto;
  max-width: none;
  margin-top: 0;
  margin-right: var(--cl-source-app-gutter);
  margin-left: calc(var(--cl-source-app-gutter) + var(--cl-source-sidebar-w));
  padding: 28px 32px 60px;
  background: transparent;
  color: var(--cl-text);
}

#cl-shopping-product-page,
#cl-shopping-product-page * {
  box-sizing: border-box;
}

#cl-shopping-product-page > .cl-source-shopping-product-shell,
#cl-shopping-product-page .cl-source-shopping-product-content {
  float: none;
  width: 100%;
  max-width: none;
  min-height: 0;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}

#cl-shopping-product-page > .cl-source-shopping-product-shell {
  margin-right: 0;
  margin-left: 0;
}

#cl-shopping-product-page #section-top-menu,
#cl-shopping-product-page .mobile-title,
#cl-shopping-product-page .submenu_navWrap {
  display: none !important;
}

#cl-shopping-product-page .cl-source-product-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
  margin: 0 0 18px;
}

#cl-shopping-product-page .cl-source-product-title {
  min-width: 0;
}

#cl-shopping-product-page .cl-source-product-breadcrumb {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  color: var(--cl-text);
  font-size: 20px;
  font-weight: 700;
  line-height: 1.35;
}

#cl-shopping-product-page .cl-source-product-breadcrumb .sep {
  color: var(--cl-text-muted);
  font-size: 23px;
  font-weight: 400;
  line-height: 1;
}

#cl-shopping-product-page .cl-source-product-breadcrumb .current {
  color: var(--cl-text-sub);
  font-weight: 700;
}

#cl-shopping-product-page .cl-source-product-description {
  margin: 10px 0 0;
  color: var(--cl-text-sub);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 20px;
}

#cl-shopping-product-page .cl-source-product-actions {
  display: flex;
  flex: none;
  align-items: center;
  gap: 10px;
}

#cl-shopping-product-page .cl-source-product-actions button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 124px;
  height: 42px;
  gap: 7px;
  margin: 0;
  padding: 0 12px;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
  transition: background-color .13s, border-color .13s, color .13s;
}

#cl-shopping-product-page .cl-source-product-publish {
  background: #fff;
  border: 1px solid var(--cl-border);
  color: var(--cl-text-sub);
  font-weight: 600;
}

#cl-shopping-product-page .cl-source-product-publish:hover,
#cl-shopping-product-page .cl-source-product-publish:focus {
  background: #f1fbf5;
  border-color: #b7e7c9;
  color: var(--cl-green-text);
  outline: 0;
}

#cl-shopping-product-page .cl-source-product-add {
  background: var(--cl-green-action);
  border: 1px solid var(--cl-green-action);
  color: #fff;
}

#cl-shopping-product-page .cl-source-product-add:hover,
#cl-shopping-product-page .cl-source-product-add:focus {
  background: var(--cl-green-hover);
  border-color: var(--cl-green-hover);
  color: #fff;
  outline: 0;
}

#cl-shopping-product-page .cl-source-product-add svg {
  width: 16px;
  height: 16px;
  flex: none;
}

body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-add.disabled {
  background: #f4f5f9;
  border-color: #e5e7eb;
  color: #8a8f98;
  cursor: not-allowed;
}

body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-add:focus-visible {
  outline: 2px solid var(--cl-green-action);
  outline-offset: 2px;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-gallery-notice-wrap {
  position: fixed !important;
  inset: 0 !important;
  z-index: 1000003 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-gallery-notice-wrap > .modal-default {
  position: fixed !important;
  inset: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 16px !important;
  overflow-y: auto !important;
  background: rgba(0, 0, 0, .45) !important;
  z-index: 1000003 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-gallery-notice-wrap + .modal-backdrop {
  opacity: 0 !important;
  z-index: 1000002 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-gallery-notice-wrap .modal-default > .modal-dialog {
  width: 430px !important;
  max-width: calc(100vw - 32px) !important;
  margin: auto !important;
  padding: 0 !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-gallery-notice-wrap .modal-dialog .modal-content {
  position: relative !important;
  padding: 32px 34px 28px !important;
  border: 1px solid #e5e7eb !important;
  border-radius: var(--r-xl, 14px) !important;
  background: #fff !important;
  box-shadow: var(--shadow-modal, 0 20px 50px rgba(20, 24, 32, .25)) !important;
  font-family: var(--cl-font) !important;
  letter-spacing: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-gallery-notice-wrap .modal-dialog .modal-body {
  min-height: 0 !important;
  padding: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
  line-height: 1.6 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-gallery-notice-wrap .modal-dialog .modal-title {
  margin: 0 30px 16px !important;
  color: var(--cl-text) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-gallery-notice-wrap .modal-body p {
  margin: 0 !important;
  word-break: keep-all;
  overflow-wrap: break-word;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-gallery-notice-wrap .modal-dialog .modal-footer {
  display: flex !important;
  align-items: stretch !important;
  width: 100% !important;
  margin: 24px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-gallery-notice-wrap .modal-dialog.cl-source-product-gallery-notice .modal-footer .btn {
  flex: none !important;
  min-width: 0 !important;
  min-height: 0 !important;
  float: none !important;
  width: 100% !important;
  height: 46px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  border: 1px solid var(--cl-green-action) !important;
  border-radius: var(--r-md, 8px) !important;
  background: var(--cl-green-action) !important;
  color: #fff !important;
  font-size: 15px !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-gallery-notice-wrap .modal-dialog.cl-source-product-gallery-notice .modal-footer .btn:hover {
  background: #02b351 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-gallery-notice-wrap .modal-dialog .modal-footer .btn:focus-visible {
  outline: 2px solid var(--cl-green-action) !important;
  outline-offset: 3px;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-gallery-notice-wrap > .modal-default > .cl-mobile-btn {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-gallery-notice-wrap .modal-dialog.cl-source-product-gallery-notice .modal-content > .close.close-button-dialog {
  position: absolute !important;
  top: 16px !important;
  right: 16px !important;
  z-index: 2 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub) !important;
  font-size: 0 !important;
  line-height: 1 !important;
  opacity: 1 !important;
  text-shadow: none !important;
  transition: color .15s, background .15s, transform .18s cubic-bezier(.34, 1.56, .64, 1) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-gallery-notice-wrap .modal-dialog.cl-source-product-gallery-notice .modal-content > .close.close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-gallery-notice-wrap .modal-dialog.cl-source-product-gallery-notice .modal-content > .close.close-button-dialog:focus {
  background: var(--cl-bg-3, #f1f2f5) !important;
  color: var(--cl-text) !important;
  outline: 0 !important;
  transform: rotate(90deg) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-gallery-notice-wrap .modal-dialog.cl-source-product-gallery-notice .modal-content > .close.close-button-dialog svg {
  display: block !important;
  width: 9px !important;
  height: 9px !important;
  fill: currentColor !important;
  stroke: currentColor !important;
}

/* 상품관리 가격 일괄 변경 모달 */
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap {
  position: fixed !important;
  inset: 0 !important;
  z-index: 1000003 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap > .modal-default {
  position: fixed !important;
  inset: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100vw !important;
  height: 100vh !important;
  padding: 24px !important;
  overflow: hidden !important;
  background: rgba(20, 24, 32, .45) !important;
  z-index: 1000003 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap + .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-backdrop {
  opacity: 0 !important;
  z-index: 1000002 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal {
  position: relative !important;
  inset: auto !important;
  display: block !important;
  width: 900px !important;
  max-width: calc(100vw - 48px) !important;
  height: auto !important;
  max-height: calc(100vh - 48px) !important;
  margin: auto !important;
  padding: 0 !important;
  overflow: visible !important;
  transform: none !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal > .modal-content {
  float: none !important;
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  min-height: 0 !important;
  max-height: calc(100vh - 48px) !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  box-shadow: 0 20px 50px rgba(20, 24, 32, .24) !important;
  color: var(--cl-text) !important;
  font-family: var(--cl-font) !important;
  letter-spacing: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal .modal-body {
  display: flex !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 0 !important;
  height: auto !important;
  padding: 0 !important;
  overflow: hidden !important;
  color: var(--cl-text) !important;
  font-family: var(--cl-font) !important;
  letter-spacing: 0 !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal .modal-top {
  display: flex !important;
  flex: none !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100% !important;
  min-height: 72px !important;
  margin: 0 !important;
  padding: 16px 24px !important;
  border-bottom: 1px solid var(--cl-border) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal .modal-title {
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  line-height: 26px !important;
  letter-spacing: 0 !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal .modal-title-button {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal .modal-title-button .btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: 88px !important;
  max-width: none !important;
  height: 40px !important;
  margin: 0 !important;
  padding: 0 18px !important;
  border-radius: 7px !important;
  box-shadow: none !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal .modal-title-button .close-button-dialog {
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  color: var(--cl-text-sub) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal .modal-title-button .close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal .modal-title-button .close-button-dialog:focus {
  background: #f1f2f5 !important;
  border-color: #d5d9e0 !important;
  color: var(--cl-text) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal .modal-title-button .ok-button-dialog,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal .modal-title-button .ok-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal .modal-title-button .ok-button-dialog:focus {
  background: var(--cl-green) !important;
  border: 1px solid var(--cl-green) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal .modal-title-button .ok-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal .modal-title-button .ok-button-dialog:focus {
  background: var(--cl-green-hover) !important;
  border-color: var(--cl-green-hover) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal .price_setting_box.modal-contents-box {
  display: flex !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
  width: 100% !important;
  min-height: 0 !important;
  height: auto !important;
  padding: 24px !important;
  overflow: hidden !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal .price_setting_input_box {
  position: relative;
  z-index: 20;
  display: flex !important;
  flex: none !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 0 24px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal .price_setting_popup_title {
  margin-right: 12px !important;
  color: var(--cl-text) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal .prod-price-input-wrap {
  height: 40px !important;
  padding: 0 16px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 7px 0 0 7px !important;
  color: var(--cl-text) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal .prod-price-input-wrap:focus-within {
  position: relative;
  z-index: 2;
  border-color: var(--cl-green) !important;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .12) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal .prod-price-input-val {
  height: 38px !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal .price_setting_mark_select.price_setting_select,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal .price_setting_unit.price_setting_select {
  height: 40px !important;
  padding: 11px 28px 11px 12px !important;
  background: #fff !important;
  border-color: var(--cl-border) !important;
  color: var(--cl-text) !important;
  font-size: 13px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal .price_setting_mark_select.price_setting_select {
  border-radius: 0 7px 7px 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal .price_selectbox {
  margin-top: 6px !important;
  overflow: hidden !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 7px !important;
  box-shadow: 0 8px 24px rgba(20, 24, 32, .14) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal .price_selectbox .price_selected {
  color: var(--cl-text) !important;
  font-size: 13px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal .price_selectbox .price_selected:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal .price_selectbox .price_selected.active {
  background: #eaf9f1 !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal .setting_product_list {
  display: flex !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
  width: 100% !important;
  min-height: 180px !important;
  height: auto !important;
  max-height: calc(100vh - 220px) !important;
  margin: 0 !important;
  overflow: hidden !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 7px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal .setting_product_list::after {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal .setting_product_list .head_row {
  display: flex !important;
  flex: none !important;
  min-width: 720px;
  background: #f7f8fa !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal .setting_product_list .head_row > .pr_detail {
  min-height: 42px !important;
  padding: 11px 12px !important;
  background: #f7f8fa !important;
  border-color: var(--cl-border) !important;
  color: var(--cl-text-sub) !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  line-height: 18px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal .setting_product_list .product_contents {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  height: auto !important;
  overflow: auto !important;
  background: #fff !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal .setting_product_list .product_contents ul {
  min-width: 720px;
  min-height: 44px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #fff !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal .setting_product_list .product_contents li {
  min-height: 44px !important;
  padding: 11px 12px !important;
  border-color: var(--cl-border) !important;
  color: var(--cl-text) !important;
  font-size: 13px !important;
  line-height: 20px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal .setting_product_list .head_row > .pr_detail.active::after,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal .setting_product_list .product_contents li.active::after {
  border-color: var(--cl-green) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap > .modal-default > .cl-mobile-btn,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal > .modal-content > .close.close-button-dialog {
  display: none !important;
}

@media (max-width: 640px) {
  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap > .modal-default {
    padding: 12px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal {
    width: 100% !important;
    max-width: none !important;
    max-height: calc(100vh - 24px) !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal > .modal-content {
    max-height: calc(100vh - 24px) !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal .modal-top {
    min-height: 64px !important;
    padding: 12px 16px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal .modal-title {
    font-size: 16px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal .modal-title-button .btn {
    min-width: 68px !important;
    height: 38px !important;
    padding: 0 12px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal .price_setting_box.modal-contents-box {
    padding: 18px 16px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal .price_setting_input_box {
    justify-content: flex-start !important;
    overflow-x: auto !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal .setting_product_list {
    max-height: calc(100vh - 196px) !important;
    overflow-x: auto !important;
  }
}

/* Product toolbar dialogs also open without the editor's config.css. */
@layer cl-product-modal-chrome {
  body.cl-dashboard-redesign-page .cl-source-product-workflow-modal > .modal-content > .close-button-dialog::before,
  body.cl-dashboard-redesign-page .cl-source-product-workflow-modal > .modal-content > .close-button-dialog::after {
    content: none !important;
    display: none !important;
  }

  body.cl-dashboard-redesign-page .cl-source-product-workflow-modal > .modal-content > .close-button-dialog > span,
  body.cl-dashboard-redesign-page .cl-source-product-workflow-modal > .modal-content > .close-button-dialog svg {
    display: block !important;
    width: 15px !important;
    height: 15px !important;
  }
}

body.cl-dashboard-redesign-page .cl-product-publish-confirm .publish-site-link {
  margin: 12px 0;
  color: var(--cl-text);
  font-weight: 600;
  overflow-wrap: anywhere;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-workflow-wrap,
body.cl-dashboard-redesign-page .flat-modal.cl-source-product-workflow-wrap > .modal-default {
  z-index: var(--cl-product-modal-z, 1000003) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-product-notice-wrap,
body.cl-dashboard-redesign-page .flat-modal.cl-product-notice-wrap .modal-content {
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-product-notice-wrap > .modal-default {
  box-sizing: border-box !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-wrap + .modal-backdrop {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-workflow-wrap:not(.cl-source-product-price-modal-wrap) {
  position: fixed !important;
  inset: 0 !important;
  padding: 24px 16px !important;
  overflow: auto !important;
  overscroll-behavior: contain;
  background: rgba(0, 0, 0, .45) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-workflow-wrap:not(.cl-source-product-price-modal-wrap) > .modal-default {
  position: static !important;
  display: flex !important;
  inset: auto !important;
  width: 100% !important;
  height: auto !important;
  min-height: 100%;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-workflow-wrap > .modal-default > .cl-mobile-btn {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-workflow-wrap:not(.cl-source-product-price-modal-wrap) .modal-dialog.cl-source-product-workflow-modal {
  position: relative !important;
  inset: auto !important;
  width: 100% !important;
  max-width: 560px !important;
  height: auto !important;
  min-height: 0 !important;
  margin: auto !important;
  padding: 0 !important;
  transform: none !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-workflow-wrap:not(.cl-source-product-price-modal-wrap) .modal-dialog.cl-source-product-workflow-modal > .modal-content {
  float: none !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 32px !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 14px !important;
  background: #fff !important;
  box-shadow: 0 24px 64px rgba(20, 24, 32, .24) !important;
  color: var(--cl-text);
  font-family: var(--cl-font);
  letter-spacing: 0;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-workflow-wrap:not(.cl-source-product-price-modal-wrap) .modal-dialog.cl-source-product-workflow-modal .modal-body {
  display: flow-root;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  color: var(--cl-text-sub);
  font-size: 13px;
  line-height: 1.6;
  overflow-wrap: anywhere;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-workflow-wrap:not(.cl-source-product-price-modal-wrap) .modal-dialog.cl-source-product-workflow-modal .modal-title {
  margin: 0 24px 24px !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-size: 20px !important;
  font-weight: 800 !important;
  line-height: 28px !important;
  text-align: center;
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .modal-title:empty {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-workflow-wrap:not(.cl-source-product-price-modal-wrap) .modal-dialog.cl-source-product-workflow-modal > .modal-content > .close-button-dialog {
  position: absolute !important;
  top: 16px !important;
  right: 16px !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 30px !important;
  height: 30px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 8px;
  background: transparent !important;
  color: var(--cl-text-sub) !important;
  opacity: 1 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal > .modal-content > .close-button-dialog svg {
  display: block;
  width: 15px !important;
  height: 15px !important;
  fill: currentColor !important;
  transition: transform .18s ease;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-workflow-wrap:not(.cl-source-product-price-modal-wrap) .modal-dialog.cl-source-product-workflow-modal > .modal-content > .close-button-dialog:is(:hover, :focus-visible) {
  background: #f1f2f5 !important;
  color: var(--cl-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal > .modal-content > .close-button-dialog:hover svg {
  transform: rotate(90deg);
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-workflow-wrap .modal-dialog.cl-source-product-workflow-modal .modal-footer {
  display: flex;
  flex-direction: column;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  margin: 24px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .modal-footer::before,
body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .modal-footer::after {
  display: none;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-workflow-wrap .modal-dialog.cl-source-product-workflow-modal .modal-footer > .btn {
  float: none !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 46px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: var(--cl-green) !important;
  color: #fff !important;
  font-size: 15px !important;
  font-weight: 700;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-workflow-wrap .modal-dialog.cl-source-product-workflow-modal .modal-footer > .btn:hover {
  background: var(--cl-green-hover) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-workflow-wrap .modal-dialog.cl-source-product-workflow-modal .modal-footer > .close-button-dialog:not(.btn-primary) {
  order: 1;
  background: transparent !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-workflow-wrap .modal-dialog.cl-source-product-workflow-modal .modal-footer > .close-button-dialog:not(.btn-primary):hover {
  background: #eaf9f1 !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal :is(button, .btn):disabled {
  opacity: .45;
  cursor: not-allowed;
}

body.cl-dashboard-redesign-page .cl-source-product-price-modal .prod-price-input-wrap {
  position: relative;
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 0 1 154px;
  min-width: 80px;
  width: 154px;
}

body.cl-dashboard-redesign-page .cl-source-product-price-modal .prod-price-input-val {
  min-width: 0;
  width: 100%;
  padding: 0 !important;
  text-align: right;
}

body.cl-dashboard-redesign-page .cl-source-product-price-modal .price_unit_text {
  flex: none;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .cl-source-product-price-modal .price_setting_select {
  position: relative;
  display: flex;
  align-items: center;
  flex: 0 0 104px;
  width: 104px;
  border: 1px solid var(--cl-border);
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .cl-source-product-price-modal .price_setting_unit {
  border-radius: 7px 0 0 7px;
}

body.cl-dashboard-redesign-page .cl-source-product-price-modal .operation-selectbox .bootstrap-select {
  width: 110px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-price-modal .operation-selectbox .bootstrap-select > .dropdown-toggle {
  padding-right: 34px;
  border-color: var(--cl-border) !important;
  border-radius: 0 7px 7px 0 !important;
  color: var(--cl-text) !important;
  background: #fff !important;
}

body.cl-dashboard-redesign-page .cl-source-product-price-modal .operation-selectbox .common-selectbox > svg,
body.cl-dashboard-redesign-page .cl-source-product-price-modal .operation-selectbox .dropdown-toggle .caret {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-price-modal .operation-selectbox .dropdown-toggle::after {
  content: '';
  position: absolute;
  right: 12px;
  top: 50%;
  width: 14px;
  height: 14px;
  margin-top: -7px;
  border: 0;
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23B4B8BF' stroke-width='2'><path d='M6 9l6 6 6-6'/></svg>") center / 14px 14px no-repeat;
  pointer-events: none;
}

body.cl-dashboard-redesign-page .cl-source-product-price-modal .operation-selectbox .bootstrap-select > .dropdown-menu {
  border: 1px solid var(--cl-border) !important;
  border-radius: 7px !important;
  box-shadow: 0 8px 24px rgba(20, 24, 32, .14);
}

body.cl-dashboard-redesign-page .cl-source-product-price-modal .operation-selectbox .dropdown-menu li:is(.active, :hover) > a {
  background: #eaf9f1 !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-price-modal .price_setting_select_click {
  position: absolute;
  inset: 0;
  z-index: 1;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .cl-source-product-price-modal .price_setting_select > svg {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-price-modal .price_setting_select::after {
  content: '';
  position: absolute;
  right: 12px;
  top: 50%;
  width: 14px;
  height: 14px;
  margin-top: -7px;
  border: 0;
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23B4B8BF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M6 9l6 6 6-6'/></svg>") center / 14px 14px no-repeat;
  pointer-events: none;
}

body.cl-dashboard-redesign-page .cl-source-product-price-modal .price_selectbox {
  position: absolute;
  flex-direction: column;
  top: 100%;
  left: -1px;
  right: -1px;
  z-index: 5;
  width: auto !important;
}

body.cl-dashboard-redesign-page .cl-source-product-price-modal .price_selectbox .price_selected {
  width: 100%;
  padding: 10px 12px;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal .setting_product_list {
  display: block !important;
  min-height: 0 !important;
  overflow: auto !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal .setting_product_list :is(.head_row, .product_contents ul) {
  display: grid !important;
  grid-template-columns: minmax(240px, 2fr) repeat(3, minmax(160px, 1fr));
  width: 100%;
  min-width: 720px;
  list-style: none;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal .setting_product_list .head_row {
  position: sticky;
  top: 0;
  z-index: 2;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal .setting_product_list .product_contents {
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .cl-source-product-price-modal .setting_product_list :is(.head_row > div, .product_contents li) {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-width: 0;
  width: auto !important;
  float: none;
  margin: 0;
  padding: 11px 12px;
  border: 0;
  border-bottom: 1px solid var(--cl-border);
  font-size: 13px;
  line-height: 20px;
  overflow-wrap: anywhere;
}

body.cl-dashboard-redesign-page .cl-source-product-price-modal .setting_product_list :is(.head_row > div, .product_contents li):first-child {
  justify-content: flex-start;
}

body.cl-dashboard-redesign-page .cl-source-product-price-modal .setting_product_list .head_row > div {
  color: var(--cl-text-sub);
  font-size: 12.5px;
  font-weight: 600;
}

body.cl-dashboard-redesign-page .cl-source-product-price-modal .setting_product_list .pr_detail.active {
  background: #f3fcf7 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-price-modal .setting_product_list .pr_detail.active::after {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-price-modal .pr_detail_fix_wrap {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 3px;
  height: 24px;
  padding: 0 5px;
  border: 1px solid var(--cl-border);
  border-radius: 4px;
  background: #fff;
  color: var(--cl-text-sub);
  cursor: pointer;
}

body.cl-dashboard-redesign-page .cl-source-product-price-modal .pr_detail_fix_wrap:is(.active, :hover) {
  border-color: var(--cl-green);
  color: var(--cl-green-text);
  background: #eaf9f1;
}

body.cl-dashboard-redesign-page .cl-source-product-price-modal .pr_detail_svg_wrap {
  width: 12px;
  height: 12px;
}

body.cl-dashboard-redesign-page .cl-source-product-price-modal .pr_detail_svg_wrap svg {
  display: block;
  width: 12px;
  height: 12px;
  fill: currentColor;
}

body.cl-dashboard-redesign-page .cl-source-product-price-modal .pr_detail_fix_wrap:not(.active) svg.active,
body.cl-dashboard-redesign-page .cl-source-product-price-modal .pr_detail_fix_wrap.active svg:not(.active) {
  display: none;
}

body.cl-dashboard-redesign-page .cl-source-product-price-modal .pr_detail_fixtext {
  font-size: 11px;
}

body.cl-dashboard-redesign-page .cl-source-product-price-modal .discount_wrap {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: center;
  gap: 4px;
}

body.cl-dashboard-redesign-page .cl-source-product-price-modal .price_arrow {
  width: 12px;
  height: 12px;
  fill: var(--cl-text-sub);
}

body.cl-dashboard-redesign-page .cl-source-product-price-modal .error_text {
  margin: 0 0 16px;
  color: var(--cl-danger);
}

body.cl-dashboard-redesign-page .cl-source-product-price-modal .error_text p {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 0;
  color: var(--cl-danger);
}

body.cl-dashboard-redesign-page .cl-source-product-price-modal .error_text svg {
  flex: none;
  width: 16px;
  height: 16px;
  fill: currentColor;
}

body.cl-dashboard-redesign-page .cl-source-product-price-modal .btn-batch-change {
  display: flex;
  align-items: center;
  justify-content: center;
  border-color: var(--cl-border) !important;
  border-radius: 7px;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .cl-source-product-price-modal .btn-batch-change:hover {
  background: #eaf9f1;
  color: var(--cl-green-text);
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-workflow-wrap.cl-source-product-badge-wrap .modal-dialog.cl-source-product-workflow-modal {
  max-width: 960px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-workflow-wrap.cl-source-product-badge-wrap .modal-dialog.cl-source-product-workflow-modal > .modal-content > .close-button-dialog {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-badge-wrap :is(.badge-setting-header, .badge-setting-top, .badge-setting-button) {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

body.cl-dashboard-redesign-page #info-process .cl-badge-save-count {
  margin-left: 8px;
  color: var(--cl-text-sub);
  font-size: 12px;
  font-weight: 400;
}

body.cl-dashboard-redesign-page .cl-source-product-badge-wrap .badge-setting-header {
  height: auto;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--cl-border);
}

body.cl-dashboard-redesign-page .cl-source-product-badge-wrap .badge-setting-header h2 {
  margin: 0;
  color: var(--cl-text);
  font-size: 18px;
  font-weight: 700;
  line-height: 26px;
}

body.cl-dashboard-redesign-page .cl-source-product-badge-wrap .badge-setting-top {
  padding: 16px 0;
}

body.cl-dashboard-redesign-page .cl-source-product-badge-wrap .badge-setting-top :is(button, .return-default-design),
body.cl-dashboard-redesign-page .cl-source-product-badge-wrap .badge-setting-button > li {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-width: 64px;
  height: 38px;
  margin: 0;
  padding: 0 12px;
  border: 1px solid var(--cl-border);
  border-radius: 7px;
  background: #fff;
  color: var(--cl-text);
  font-size: 13px;
  font-weight: 600;
  white-space: nowrap;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .cl-source-product-badge-wrap .badge-setting-top :is(button, .return-default-design):hover,
body.cl-dashboard-redesign-page .cl-source-product-badge-wrap .badge-setting-button > li:hover {
  background: #eaf9f1;
  color: var(--cl-green-text);
}

body.cl-dashboard-redesign-page .cl-source-product-badge-wrap .badge-setting-button > .modal-save {
  background: var(--cl-green) !important;
  border-color: var(--cl-green);
  color: #fff;
}

body.cl-dashboard-redesign-page .cl-source-product-badge-wrap .badge-setting-button > .modal-save:hover {
  background: var(--cl-green-hover) !important;
  color: #fff;
}

body.cl-dashboard-redesign-page .cl-source-product-badge-wrap .badge-setting-table,
body.cl-dashboard-redesign-page .cl-source-product-badge-wrap .cl-change-badge-design .divTable {
  max-height: calc(100dvh - 200px);
  overflow: auto;
}

body.cl-dashboard-redesign-page .cl-source-product-badge-wrap .cl-change-badge-design .divTable + .text-right {
  margin-top: 5px;
}

body.cl-dashboard-redesign-page .cl-source-product-badge-wrap .divTable {
  display: block;
  width: 100%;
}

body.cl-dashboard-redesign-page .cl-source-product-badge-wrap .divTableBody {
  display: block;
}

body.cl-dashboard-redesign-page .cl-source-product-badge-wrap :is(.divTableHeading, .divTableRow) {
  display: grid;
  height: auto !important;
  grid-template-columns: 48px minmax(200px, 1fr) repeat(5, 100px);
  align-items: stretch;
  min-width: 748px;
  border-bottom: 1px solid var(--cl-border);
}

body.cl-dashboard-redesign-page .cl-source-product-badge-wrap .cl-change-badge-design :is(.divTableHeading, .divTableRow) {
  grid-template-columns: 120px 150px minmax(160px, 1fr) repeat(3, 80px);
  min-width: 670px;
}

body.cl-dashboard-redesign-page .cl-source-product-badge-wrap .divTableHeading {
  background: #f7f8fa;
  color: var(--cl-text-sub);
  font-size: 12.5px;
  font-weight: 600;
}

body.cl-dashboard-redesign-page .cl-source-product-badge-wrap :is(.divTableCell, .divTableHead) {
  display: flex;
  width: auto !important;
  height: auto;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 8px;
  min-width: 0;
  padding: 12px;
  color: inherit;
}

body.cl-dashboard-redesign-page .cl-source-product-badge-wrap .product-title {
  align-items: flex-start;
  color: var(--cl-text);
}

body.cl-dashboard-redesign-page .cl-source-product-badge-wrap .product-badge img {
  max-width: 80px;
  max-height: 32px;
  object-fit: contain;
}

body.cl-dashboard-redesign-page .cl-source-product-badge-wrap :is(.newcheckbox, .newcheckbox label) {
  position: static;
  display: flex;
  align-items: center;
  margin: 0;
  padding: 0;
  transform: none;
}

body.cl-dashboard-redesign-page .cl-source-product-badge-wrap :is(.select-style-btn, input[name="badge_text"]) {
  width: 100% !important;
  height: 34px !important;
  padding: 0 8px;
  border: 1px solid var(--cl-border) !important;
  border-radius: 6px !important;
  background: #fff;
  color: var(--cl-text);
}

body.cl-dashboard-redesign-page .cl-source-product-badge-wrap .color-picker .bc-color,
body.cl-dashboard-redesign-page .cl-source-product-badge-wrap .color-picker-badge {
  display: block;
  width: 24px;
  height: 24px;
  border: 1px solid var(--cl-border);
  border-radius: 50%;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .cl-source-product-badge-wrap .color-picker-badge.disabled {
  opacity: .4;
  pointer-events: none;
}

body.cl-dashboard-redesign-page .cl-source-product-badge-wrap .badge-style-header .modal-close {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 8px;
  color: var(--cl-text-sub);
}

body.cl-dashboard-redesign-page .cl-source-product-badge-wrap .badge-style-header .modal-close:hover {
  background: #f1f2f5;
}

body.cl-dashboard-redesign-page .cl-source-product-badge-wrap .badge-style-header .modal-close svg {
  width: 15px;
  height: 15px;
  fill: currentColor;
}

body.cl-dashboard-redesign-page .cl-source-product-badge-wrap .badge-style-popup {
  position: fixed !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%);
  width: 410px;
  max-width: calc(100vw - 48px);
  max-height: calc(100dvh - 48px);
  overflow: auto;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 20px 50px rgba(20, 24, 32, .24);
  z-index: 10;
}

body.cl-dashboard-redesign-page .cl-source-product-badge-wrap :is(.badge-style-header, .badge-style-footer, .badge-size-tab) {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 12px;
  border-bottom: 1px solid var(--cl-border);
}

body.cl-dashboard-redesign-page .cl-source-product-badge-wrap .badge-type-tab {
  display: flex;
  margin: 0;
  padding: 0;
  list-style: none;
}

body.cl-dashboard-redesign-page .cl-source-product-badge-wrap .badge-type-tab > li {
  flex: 1;
  padding: 10px 4px !important;
  height: auto !important;
  line-height: 20px !important;
  border-bottom: 2px solid transparent;
  text-align: center;
}

body.cl-dashboard-redesign-page .cl-source-product-badge-wrap .badge-type-tab > li.active {
  border-color: var(--cl-green) !important;
  color: var(--cl-green-text);
}

body.cl-dashboard-redesign-page .cl-source-product-badge-wrap .select-badge-table {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  max-height: 240px;
  overflow: auto;
}

body.cl-dashboard-redesign-page .cl-source-product-badge-wrap .select-badge {
  position: relative;
  display: flex !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 8px 4px;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  border: 1px solid var(--cl-border);
}

body.cl-dashboard-redesign-page .cl-source-product-badge-wrap .select-badge:is(.selected, :hover) {
  border-color: var(--cl-green) !important;
  background: #eaf9f1;
}

body.cl-dashboard-redesign-page .cl-source-product-badge-wrap .delete-badge {
  position: absolute;
  top: 0;
  right: 0;
}

body.cl-dashboard-redesign-page .cl-source-product-badge-wrap .badge-style-footer :is(.modal-save, .modal-close) {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  height: 34px !important;
  padding: 6px 12px !important;
  line-height: 20px !important;
  border-radius: 8px !important;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .cl-source-product-badge-wrap .badge-style-footer .modal-save {
  background: var(--cl-green) !important;
  color: #fff;
}

body.cl-dashboard-redesign-page .cl-source-product-badge-wrap .badge-style-footer .modal-save:hover {
  background: var(--cl-green-hover) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-badge-wrap .badge-style-footer .modal-close:hover {
  background: #eaf9f1;
  color: var(--cl-green-text);
}

/* 뱃지 미리보기는 실제 갤러리의 모양/색/크기를 유지한다. */
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge {display: inline-block; text-align: center; font-weight: normal; font-size: 9px; vertical-align: middle; white-space: nowrap;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.small {min-width: 30px; height: 16px; padding: 0 7px; line-height: 14px; font-size: 9px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.medium {min-width: 38px; height: 18px; padding: 0 7px; line-height: 16px; font-size: 10px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.large {min-width: 43px; height: 20px; padding: 0 7px; line-height: 18px; font-size: 11px;}

body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.small.default-1 {color: #000; background-color: #fff; border: 1px solid #bebebe;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.small.default-2 {color: #000; background-color: #fff; border: 1px solid #bebebe; min-width: 34px; border-radius: 20px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.small.default-3 {color: #000; background-color: #fff; border: 1px solid #bebebe; min-width: 34px; border-radius: 5px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.small.default-4 {color: #000; background-color: #efefef; border: 1px solid #efefef;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.small.default-5 {color: #000; background-color: #efefef; border: 1px solid #efefef; min-width: 34px; border-radius: 20px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.small.default-6 {color: #000; background-color: #efefef; border: 1px solid #efefef; min-width: 34px; border-radius: 5px;}

body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.small.red-1 {color: #ee445f; background-color: #fff; border: 1px solid #ee445f;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.small.red-2 {color: #ee445f; background-color: #fff; border: 1px solid #ee445f; min-width: 34px; border-radius: 20px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.small.red-3 {color: #ee445f; background-color: #fff; border: 1px solid #ee445f; min-width: 34px; border-radius: 5px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.small.red-4 {color: #ee445f; background-color: #ffe9ed; border: 1px solid #ffe9ed;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.small.red-5 {color: #ee445f; background-color: #ffe9ed; border: 1px solid #ffe9ed; min-width: 34px; border-radius: 20px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.small.red-6 {color: #ee445f; background-color: #ffe9ed; border: 1px solid #ffe9ed; min-width: 34px; border-radius: 5px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.small.red-7 {color: #fff; background-color: #ee445f; border: 1px solid #ee445f;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.small.red-8 {color: #fff; background-color: #ee445f; border: 1px solid #ee445f; min-width: 34px; border-radius: 20px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.small.red-9 {color: #fff; background-color: #ee445f; border: 1px solid #ee445f; min-width: 34px; border-radius: 5px;}

body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.small.blue-1 {color: #4789e7; background-color: #fff; border: 1px solid #4789e7;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.small.blue-2 {color: #4789e7; background-color: #fff; border: 1px solid #4789e7; min-width: 34px; border-radius: 20px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.small.blue-3 {color: #4789e7; background-color: #fff; border: 1px solid #4789e7; min-width: 34px; border-radius: 5px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.small.blue-4 {color: #4789e7; background-color: #e9f3ff; border: 1px solid #e9f3ff;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.small.blue-5 {color: #4789e7; background-color: #e9f3ff; border: 1px solid #e9f3ff; min-width: 34px; border-radius: 20px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.small.blue-6 {color: #4789e7; background-color: #e9f3ff; border: 1px solid #e9f3ff; min-width: 34px; border-radius: 5px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.small.blue-7 {color: #fff; background-color: #4789e7; border: 1px solid #4789e7;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.small.blue-8 {color: #fff; background-color: #4789e7; border: 1px solid #4789e7; min-width: 34px; border-radius: 20px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.small.blue-9 {color: #fff; background-color: #4789e7; border: 1px solid #4789e7; min-width: 34px; border-radius: 5px;}

body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.small.black-1 {color: #5a5a5a; background-color: #fff; border: 1px solid #5a5a5a;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.small.black-2 {color: #5a5a5a; background-color: #fff; border: 1px solid #5a5a5a; min-width: 34px; border-radius: 20px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.small.black-3 {color: #5a5a5a; background-color: #fff; border: 1px solid #5a5a5a; min-width: 34px; border-radius: 5px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.small.black-4 {color: #fff; background-color: #5a5a5a; border: 1px solid #5a5a5a;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.small.black-5 {color: #fff; background-color: #5a5a5a; border: 1px solid #5a5a5a; min-width: 34px; border-radius: 20px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.small.black-6 {color: #fff; background-color: #5a5a5a; border: 1px solid #5a5a5a; min-width: 34px; border-radius: 5px;}

body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.medium.default-1 {color: #000; background-color: #fff; border: 1px solid #bebebe;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.medium.default-2 {color: #000; background-color: #fff; border: 1px solid #bebebe; min-width: 34px; border-radius: 20px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.medium.default-3 {color: #000; background-color: #fff; border: 1px solid #bebebe; min-width: 34px; border-radius: 5px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.medium.default-4 {color: #000; background-color: #efefef; border: 1px solid #bebebe;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.medium.default-5 {color: #000; background-color: #efefef; border: 1px solid #bebebe; min-width: 38px; border-radius: 20px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.medium.default-6 {color: #000; background-color: #efefef; border: 1px solid #bebebe; min-width: 38px; border-radius: 5px;}

body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.medium.red-1 {color: #ee445f; background-color: #fff; border: 1px solid #ee445f;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.medium.red-2 {color: #ee445f; background-color: #fff; border: 1px solid #ee445f; min-width: 38px; border-radius: 20px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.medium.red-3 {color: #ee445f; background-color: #fff; border: 1px solid #ee445f; min-width: 38px; border-radius: 5px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.medium.red-4 {color: #ee445f; background-color: #ffe9ed; border: 1px solid #ffe9ed; }
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.medium.red-5 {color: #ee445f; background-color: #ffe9ed; border: 1px solid #ffe9ed; min-width: 38px; border-radius: 20px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.medium.red-6 {color: #ee445f; background-color: #ffe9ed; border: 1px solid #ffe9ed; min-width: 38px; border-radius: 5px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.medium.red-7 {color: #fff; background-color: #ee445f; border: 1px solid #ee445f;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.medium.red-8 {color: #fff; background-color: #ee445f; border: 1px solid #ee445f; min-width: 38px; border-radius: 20px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.medium.red-9 {color: #fff; background-color: #ee445f; border: 1px solid #ee445f; min-width: 38px; border-radius: 5px;}

body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.medium.blue-1 {color: #4789e7; background-color: #fff; border: 1px solid #4789e7;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.medium.blue-2 {color: #4789e7; background-color: #fff; border: 1px solid #4789e7; min-width: 38px; border-radius: 20px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.medium.blue-3 {color: #4789e7; background-color: #fff; border: 1px solid #4789e7; min-width: 38px; border-radius: 5px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.medium.blue-4 {color: #4789e7; background-color: #e9f3ff; border: 1px solid #e9f3ff;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.medium.blue-5 {color: #4789e7; background-color: #e9f3ff; border: 1px solid #e9f3ff; min-width: 38px; border-radius: 20px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.medium.blue-6 {color: #4789e7; background-color: #e9f3ff; border: 1px solid #e9f3ff; min-width: 38px; border-radius: 5px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.medium.blue-7 {color: #fff; background-color: #4789e7; border: 1px solid #4789e7;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.medium.blue-8 {color: #fff; background-color: #4789e7; border: 1px solid #4789e7; min-width: 38px; border-radius: 20px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.medium.blue-9 {color: #fff; background-color: #4789e7; border: 1px solid #4789e7; min-width: 38px; border-radius: 5px;}

body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.medium.black-1 {color: #5a5a5a; background-color: #fff; border: 1px solid #5a5a5a;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.medium.black-2 {color: #5a5a5a; background-color: #fff; border: 1px solid #5a5a5a; min-width: 38px; border-radius: 20px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.medium.black-3 {color: #5a5a5a; background-color: #fff; border: 1px solid #5a5a5a; min-width: 38px; border-radius: 5px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.medium.black-4 {color: #fff; background-color: #5a5a5a; border: 1px solid #5a5a5a;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.medium.black-5 {color: #fff; background-color: #5a5a5a; border: 1px solid #5a5a5a; min-width: 38px; border-radius: 20px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.medium.black-6 {color: #fff; background-color: #5a5a5a; border: 1px solid #5a5a5a; min-width: 38px; border-radius: 5px;}

body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.large.default-1 {color: #000; background-color: #fff; border: 1px solid #bebebe;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.large.default-2 {color: #000; background-color: #fff; border: 1px solid #bebebe; min-width: 40px; border-radius: 20px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.large.default-3 {color: #000; background-color: #fff; border: 1px solid #bebebe; min-width: 40px; border-radius: 5px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.large.default-4 {color: #000; background-color: #efefef; border: 1px solid #efefef;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.large.default-5 {color: #000; background-color: #efefef; border: 1px solid #efefef; min-width: 40px; border-radius: 20px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.large.default-6 {color: #000; background-color: #efefef; border: 1px solid #efefef; min-width: 40px; border-radius: 5px;}

body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.large.red-1 {color: #ee445f; background-color: #fff; border: 1px solid #ee445f;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.large.red-2 {color: #ee445f; background-color: #fff; border: 1px solid #ee445f; min-width: 43px; border-radius: 20px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.large.red-3 {color: #ee445f; background-color: #fff; border: 1px solid #ee445f; min-width: 43px; border-radius: 5px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.large.red-4 {color: #ee445f; background-color: #ffe9ed; border: 1px solid #ffe9ed; }
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.large.red-5 {color: #ee445f; background-color: #ffe9ed; border: 1px solid #ffe9ed; min-width: 43px; border-radius: 20px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.large.red-6 {color: #ee445f; background-color: #ffe9ed; border: 1px solid #ffe9ed; min-width: 43px; border-radius: 5px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.large.red-7 {color: #fff; background-color: #ee445f; border: 1px solid #ee445f;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.large.red-8 {color: #fff; background-color: #ee445f; border: 1px solid #ee445f; min-width: 43px; border-radius: 20px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.large.red-9 {color: #fff; background-color: #ee445f; border: 1px solid #ee445f; min-width: 43px; border-radius: 5px;}

body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.large.blue-1 {color: #4789e7; background-color: #fff; border: 1px solid #4789e7;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.large.blue-2 {color: #4789e7; background-color: #fff; border: 1px solid #4789e7; min-width: 43px; border-radius: 20px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.large.blue-3 {color: #4789e7; background-color: #fff; border: 1px solid #4789e7; min-width: 43px; border-radius: 5px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.large.blue-4 {color: #4789e7; background-color: #e9f3ff; border: 1px solid #e9f3ff;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.large.blue-5 {color: #4789e7; background-color: #e9f3ff; border: 1px solid #e9f3ff; min-width: 43px; border-radius: 20px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.large.blue-6 {color: #4789e7; background-color: #e9f3ff; border: 1px solid #e9f3ff; min-width: 43px; border-radius: 5px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.large.blue-7 {color: #fff; background-color: #4789e7; border: 1px solid #4789e7;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.large.blue-8 {color: #fff; background-color: #4789e7; border: 1px solid #4789e7; min-width: 43px; border-radius: 20px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.large.blue-9 {color: #fff; background-color: #4789e7; border: 1px solid #4789e7; min-width: 43px; border-radius: 5px;}

body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.large.black-1 {color: #5a5a5a; background-color: #fff; border: 1px solid #5a5a5a;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.large.black-2 {color: #5a5a5a; background-color: #fff; border: 1px solid #5a5a5a; min-width: 43px; border-radius: 20px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.large.black-3 {color: #5a5a5a; background-color: #fff; border: 1px solid #5a5a5a; min-width: 43px; border-radius: 5px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.large.black-4 {color: #fff; background-color: #5a5a5a; border: 1px solid #5a5a5a;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.large.black-5 {color: #fff; background-color: #5a5a5a; border: 1px solid #5a5a5a; min-width: 43px; border-radius: 20px;}
body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge.large.black-6 {color: #fff; background-color: #5a5a5a; border: 1px solid #5a5a5a; min-width: 43px; border-radius: 5px;}

body.cl-dashboard-redesign-page :is(.cl-source-product-badge-wrap, .cl-source-product-badges) span.product-badge > img {max-height: 36px;}


body.cl-dashboard-redesign-page .cl-source-product-badge-wrap .select-style-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  line-height: 20px;
  font: inherit;
  cursor: pointer;
}
body.cl-dashboard-redesign-page .cl-source-product-badge-wrap .select-style-btn:is(:hover, :focus-visible, .active) {
  border-color: var(--cl-green) !important;
  background: #eaf9f1;
  color: var(--cl-green-text);
}
body.cl-dashboard-redesign-page .cl-source-badge-style-overlay {
  position: fixed;
  inset: 0;
  z-index: 1000001;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: rgba(0, 0, 0, .4);
}
body.cl-dashboard-redesign-page .cl-source-badge-style-overlay .badge-style-popup {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  transform: none;
  display: flex;
  flex-direction: column;
  width: 520px;
  max-width: 100%;
  max-height: calc(100dvh - 48px);
  overflow: hidden;
  border-radius: 16px;
  box-shadow: 0 24px 64px rgba(20, 24, 32, .24);
  font-family: var(--cl-font, 'CreatorlinkSansKR', sans-serif);
  color: var(--cl-text);
}
body.cl-dashboard-redesign-page .cl-source-badge-style-overlay .badge-style-header {
  flex: 0 0 auto;
  padding: 20px 24px 16px;
}
body.cl-dashboard-redesign-page .cl-source-badge-style-overlay .badge-style-title {
  color: var(--cl-text);
  font-size: 18px;
  font-weight: 700;
}
body.cl-dashboard-redesign-page .cl-source-badge-style-overlay .badge-style-header .modal-close {
  padding: 0;
  cursor: pointer;
  transition: transform .18s, background .12s;
}
body.cl-dashboard-redesign-page .cl-source-badge-style-overlay .badge-style-header .modal-close:is(:hover, :focus-visible) {
  background: #f1f2f5;
  color: var(--cl-text);
  transform: rotate(90deg);
}
body.cl-dashboard-redesign-page .cl-source-badge-style-overlay .badge-type-tab {
  flex: 0 0 auto;
  gap: 4px;
  margin: 16px 24px 0;
  padding: 4px;
  border-radius: 10px;
  background: #f4f5f9;
}
body.cl-dashboard-redesign-page .cl-source-badge-style-overlay .badge-type-tab > li {
  border: 0 !important;
  border-radius: 8px;
  cursor: pointer;
}
body.cl-dashboard-redesign-page .cl-source-badge-style-overlay .badge-type-tab > li.active {
  background: #fff;
  box-shadow: 0 1px 3px rgba(20,24,32,.08);
  font-weight: 700;
}
body.cl-dashboard-redesign-page .cl-source-badge-style-overlay .badge-type-tab-content {
  min-height: 0;
  overflow-y: auto;
  padding: 0 24px;
}
body.cl-dashboard-redesign-page .cl-source-badge-style-overlay .badge-size-tab {
  justify-content: flex-start;
  padding: 16px 0;
  border: 0;
}
body.cl-dashboard-redesign-page .cl-source-badge-style-overlay .badge-size-tab > span:not([data-size]) { display: none; }
body.cl-dashboard-redesign-page .cl-source-badge-style-overlay .select-badge-size {
  padding: 6px 14px;
  border-radius: 8px;
  cursor: pointer;
}
body.cl-dashboard-redesign-page .cl-source-badge-style-overlay .select-badge-size.active {
  background: #eaf9f1;
  color: var(--cl-green-text);
  font-weight: 700;
}
body.cl-dashboard-redesign-page .cl-source-badge-style-overlay .select-badge-table {
  gap: 8px;
  max-height: none;
  overflow: visible;
  padding: 2px 2px 16px;
}
body.cl-dashboard-redesign-page .cl-source-badge-style-overlay .badge-tab-image .select-badge-table { padding-top: 16px; }
body.cl-dashboard-redesign-page .cl-source-badge-style-overlay .upload-badge-image {
  display: inline-flex;
  box-sizing: border-box;
  width: 100%;
  align-items: center;
  justify-content: center;
  gap: 6px;
  margin: 0;
  padding: 9px 15px;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
  background: #fff;
  color: var(--cl-text-sub);
  font-family: inherit;
  font-size: 13px;
  font-weight: 600;
  line-height: 18px;
  cursor: pointer;
  transition: background .12s, border-color .12s, color .12s;
}
body.cl-dashboard-redesign-page .cl-source-badge-style-overlay .badge-upload-help {
  display: block;
  margin: 8px 0 16px;
  color: var(--cl-text-sub);
  font-size: 12px;
  line-height: 18px;
  text-align: center;
}
body.cl-dashboard-redesign-page .cl-source-badge-style-overlay .upload-badge-image:is(:hover, :focus-visible) {
  background: #fafbfc;
  color: var(--cl-text);
}
body.cl-dashboard-redesign-page .cl-source-badge-style-overlay .upload-badge-image > svg {
  display: block;
  flex: 0 0 15px;
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
body.cl-dashboard-redesign-page .cl-source-badge-style-overlay .select-badge {
  min-height: 54px;
  border-radius: 8px;
  cursor: pointer;
}
body.cl-dashboard-redesign-page .cl-source-badge-style-overlay .select-badge.selected {
  box-shadow: inset 0 0 0 1px var(--cl-green);
}
body.cl-dashboard-redesign-page .cl-source-badge-style-overlay .badge-style-footer {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  padding: 20px 24px;
  border-top: 1px solid var(--cl-border);
  border-bottom: 0;
}
body.cl-dashboard-redesign-page .cl-source-badge-style-overlay .badge-style-footer > ul {
  display: flex;
  flex-direction: column;
  gap: 14px;
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
}
body.cl-dashboard-redesign-page .cl-source-badge-style-overlay .badge-style-footer li { width: 100%; }
body.cl-dashboard-redesign-page .cl-source-badge-style-overlay .badge-style-footer :is(.modal-save, .modal-close) {
  width: 100%;
  height: 46px !important;
  margin: 0 !important;
  border: 0;
  font: inherit;
  font-size: 15px;
  font-weight: 700;
}
body.cl-dashboard-redesign-page .cl-source-badge-style-overlay .badge-style-footer .modal-close {
  background: transparent;
  color: var(--cl-text-sub);
  font-size: 13.5px;
  font-weight: 600;
}
body.cl-dashboard-redesign-page .cl-source-badge-style-overlay [role="button"]:focus-visible,
body.cl-dashboard-redesign-page .cl-source-badge-style-overlay button:focus-visible {
  outline: 2px solid var(--cl-green);
  outline-offset: 2px;
}
@media (max-width: 480px) {
  body.cl-dashboard-redesign-page .cl-source-badge-style-overlay { padding: 12px; }
  body.cl-dashboard-redesign-page .cl-source-badge-style-overlay .badge-style-popup { max-height: calc(100dvh - 24px); }
  body.cl-dashboard-redesign-page .cl-source-badge-style-overlay .select-badge-table { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal input[type="checkbox"] {
  position: static !important;
  display: inline-block !important;
  flex: none;
  width: 16px !important;
  height: 16px !important;
  margin: 0 !important;
  padding: 0 !important;
  appearance: none;
  opacity: 1 !important;
  border: 1px solid #c9cdd4 !important;
  border-radius: 4px;
  background: #fff !important;
  vertical-align: middle;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal input[type="checkbox"]:checked {
  border-color: var(--cl-green) !important;
  background: var(--cl-green) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12.5l4.2 4.2L19 6.5' fill='none' stroke='white' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 12px 12px no-repeat !important;
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .newcheckbox label svg,
body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .newcheckboxSvg svg {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal input[type="radio"] {
  accent-color: var(--cl-green);
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal :is(input:not([type="hidden"]), button, .btn):focus-visible {
  outline: 2px solid var(--cl-green);
  outline-offset: 2px;
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .gallery-move-list {
  max-height: 280px;
  margin: 16px 0;
  padding: 0;
  overflow: auto;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
  list-style: none;
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .gallery-move-list > li {
  min-height: 42px;
  padding: 10px 12px;
  border-bottom: 1px solid var(--cl-border);
  text-align: left;
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .gallery-move-list > .gallery-move {
  padding-left: 28px;
  color: var(--cl-text);
  cursor: pointer;
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .gallery-move-list .gallery-name-edit {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .gallery-move-list > .gallery-move:is(:hover, .active) {
  background: #eaf9f1;
  color: var(--cl-green-text);
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .gallery-move-list svg {
  width: 12px;
  height: 12px;
  fill: currentColor;
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .gallery-move-list .disabled {
  opacity: .45;
  pointer-events: none;
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .gallery-confirm-str {
  margin-bottom: 10px;
  text-align: left;
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .gallery-move-select label {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0;
  text-align: left;
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .gallery-move-select input[type="radio"] {
  position: static;
  flex: none;
  width: 16px;
  height: 16px;
  margin: 0;
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .link-content {
  display: block;
  float: none;
  width: 100%;
  max-height: min(420px, calc(100dvh - 310px));
  margin: 0;
  padding: 0;
  overflow: auto;
  list-style: none;
  text-align: left;
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .link-target {
  margin-top: 20px;
  text-align: left;
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .link-target label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .link-type {
  display: block;
  float: none;
  height: auto;
  min-height: 0;
  padding: 12px 0;
  border-top: 0;
  border-bottom: 1px solid var(--cl-border);
  background: transparent;
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .link-type > div {
  display: block;
  float: none;
  position: relative;
  height: auto;
  min-height: 20px;
  padding-left: 28px;
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .link-type > div > svg:not(.cm-popover-info) {
  position: absolute;
  top: 1px;
  left: 0;
  width: 18px;
  height: 18px;
  transform: none;
  fill: var(--cl-text-muted);
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .link-type.active > div > svg:not(.cm-popover-info) {
  fill: var(--cl-green);
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .link-type h5 {
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
  position: static !important;
  float: none !important;
  transform: none !important;
  margin: 0 0 10px !important;
  padding: 0 !important;
  font-size: 13px;
  font-weight: 600;
  line-height: 20px;
  color: var(--cl-text);
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .link-default h5 {
  margin-bottom: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .link-type .cm-popover-info {
  position: static !important;
  float: none !important;
  display: inline-block;
  width: 13px;
  height: 13px;
  margin: 0 0 0 4px;
  transform: none !important;
  vertical-align: middle;
  fill: var(--cl-green) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .link-type :is(.cl-common-form-wrap, .cl-common-form-group, .group-wrap) {
  display: block;
  position: relative;
  inset: auto;
  float: none;
  width: 100%;
  min-width: 0 !important;
  max-width: none !important;
  height: auto;
  max-height: none;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  transform: none;
  z-index: auto;
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .link-type .group-wrap > :is(.btn-group, .input-group) {
  display: block;
  width: 100%;
  height: auto;
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .link-content :is(input[type="text"], .btn) {
  position: relative;
  float: none;
  inset: auto;
  transform: none;
  display: flex;
  align-items: center;
  gap: 6px;
  width: 100%;
  max-width: 100%;
  height: 38px;
  margin: 0;
  padding: 8px 12px;
  border: 1px solid var(--cl-border);
  border-radius: 8px !important;
  background: #fff;
  color: var(--cl-text);
  font-size: 13px;
  box-shadow: none;
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .link-type .btn > span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: inherit;
  color: inherit;
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .link-type .dropdown-toggle {
  padding-right: 34px;
  text-align: left;
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .link-type .dropdown-toggle > svg {
  display: none;
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .link-type .dropdown-toggle::after {
  content: '';
  position: absolute;
  right: 12px;
  top: 50%;
  width: 14px;
  height: 14px;
  margin-top: -7px;
  border: 0;
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23B4B8BF' stroke-width='2'><path d='M6 9l6 6 6-6'/></svg>") center / 14px 14px no-repeat;
  pointer-events: none;
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .link-type .btn-group.open > .dropdown-toggle::after {
  transform: rotate(180deg);
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .link-type .dropdown-menu {
  top: calc(100% + 4px);
  width: 100%;
  min-width: 0;
  max-height: 180px;
  margin: 0;
  padding: 4px;
  overflow: auto;
  border: 1px solid var(--cl-border);
  border-radius: 10px;
  box-shadow: 0 8px 24px rgba(20, 24, 32, .14);
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .link-type .dropdown-menu > li > a {
  min-height: 34px;
  padding: 8px 12px;
  border-radius: 8px;
  color: var(--cl-text);
  font-size: 12.5px;
  line-height: 18px;
  white-space: normal;
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .link-type .dropdown-menu > li > a:is(:hover, :focus),
body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .link-type .dropdown-menu > li.active > a {
  background: #eaf9f1;
  color: var(--cl-green-text);
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .link-type .fileinput-button > svg {
  position: static;
  width: 16px;
  height: 16px;
  transform: none;
  fill: currentColor;
}

/* 파일 해제 아이콘은 선택된 파일 정보와 함께 표시한다. */
body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .link-file .prop-flink-ctrl {
  display: none;
  position: static;
  width: 100%;
  margin: 8px 0 0;
  color: var(--cl-text-secondary);
  font-size: 13px;
  line-height: 20px;
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .link-file .prop-flink-ctrl.active {
  display: flex;
  align-items: center;
  gap: 8px;
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .link-file .flink-info {
  flex: 1;
  min-width: 0;
  overflow-wrap: anywhere;
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .link-file .flink-size:not(:empty)::before {
  content: ' (';
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .link-file .flink-size:not(:empty)::after {
  content: 'KB)';
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .link-file .flink-size.unit_m:not(:empty)::after {
  content: 'MB)';
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .link-file .flink-cancel {
  display: none;
  position: static;
  flex: 0 0 24px;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  margin: 0;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .link-file .flink-info[data-id] ~ .flink-cancel {
  display: inline-flex;
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .link-file .flink-cancel svg {
  position: static;
  width: 10px;
  height: 10px;
  transform: none;
  fill: currentColor;
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .gallery-link-save-error,
body.cl-dashboard-redesign-page .cl-source-product-workflow-modal .link-type > .edit-link-error {
  position: static;
  margin: 8px 0 0 28px;
  padding: 0;
  width: auto;
  white-space: normal;
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal.cl-product-price-setting .bar {
  height: 3px;
  overflow: hidden;
  background: var(--cl-border);
  border-radius: 3px;
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal.cl-product-price-setting .bar > div {
  width: 0;
  height: 100%;
  background: var(--cl-green);
  transition: width .3s;
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal.cl-product-price-setting :is(.spin, .desc) {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 8px;
  text-align: left;
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal.cl-product-price-setting .detail-progress {
  max-height: 300px;
  margin-top: 24px;
  overflow: auto;
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal.cl-product-price-setting .process + .process {
  margin-top: 20px;
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal.cl-product-price-setting .desc .status {
  flex: none;
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal.cl-product-price-setting :is(.info, .counter span) {
  color: var(--cl-green-text);
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal.cl-product-price-setting .spin i {
  color: var(--cl-green);
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal.cl-product-price-setting :is(.danger, .error) {
  color: var(--cl-danger);
}

body.cl-dashboard-redesign-page .cl-source-product-workflow-modal.cl-product-price-setting .bar > .danger {
  background: var(--cl-danger);
}

@media (max-width: 640px) {
  body.cl-dashboard-redesign-page .flat-modal.cl-source-product-workflow-wrap:not(.cl-source-product-price-modal-wrap) {
    padding: 12px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-product-workflow-wrap:not(.cl-source-product-price-modal-wrap) .modal-dialog.cl-source-product-workflow-modal > .modal-content {
    padding: 24px 16px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-product-price-modal-wrap .modal-dialog.cl-source-product-price-modal .price_setting_input_box {
    flex-wrap: wrap;
    row-gap: 10px;
    overflow: visible !important;
  }

  body.cl-dashboard-redesign-page .cl-source-product-price-modal .price_setting_popup_title {
    flex: 0 0 100%;
  }

  body.cl-dashboard-redesign-page .cl-source-product-price-modal .price_setting_input_box[data-category="disc"] .price_setting_unit {
    flex-basis: 100%;
    margin-bottom: 0;
  }

  body.cl-dashboard-redesign-page .cl-source-product-badge-wrap .badge-setting-header {
    flex-wrap: wrap;
    row-gap: 12px;
  }
}

#cl-shopping-product-page .cl-source-product-panel {
  display: flex;
  min-height: 560px;
  overflow: hidden;
  background: var(--cl-surface);
  border: 1px solid var(--cl-border);
  border-radius: var(--cl-radius-lg);
  box-shadow: var(--cl-shadow-panel);
}

body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-gallery-toggle {
  display: none;
}

#cl-shopping-product-page .cl-source-product-side {
  flex: 0 0 240px;
  width: 240px;
  padding: 20px 0;
  border-right: 1px solid var(--cl-border);
  background: #fff;
}

#cl-shopping-product-page .cl-source-product-nav,
#cl-shopping-product-page .cl-source-product-galleries {
  display: flex;
  flex-direction: column;
}

@media (min-width: 769px) {
  body.cl-dashboard-redesign-page:has(#cl-shopping-product-page):not(.modal-open):not(.overflow-hidden) {
    overflow: visible !important;
  }

  /* Clip rounded corners without creating a scroll container for sticky navigation. */
  body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-panel {
    overflow: clip;
  }

  body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-nav {
    position: sticky;
    top: calc(var(--cl-source-topbar-h) + 16px);
    max-height: calc(100vh - var(--cl-source-topbar-h) - 32px);
    max-height: calc(100dvh - var(--cl-source-topbar-h) - 32px);
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior-y: contain;
  }

  body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-nav > * {
    flex-shrink: 0;
  }
}

#cl-shopping-product-page .cl-source-product-nav button {
  appearance: none;
  border: 0;
  background: transparent;
  font-family: inherit;
}

#cl-shopping-product-page .cl-source-product-nav-all {
  display: flex;
  align-items: center;
  width: 100%;
  gap: 9px;
  padding: 11px 24px 11px 21px;
  border-left: 3px solid transparent;
  color: var(--cl-text);
  font-size: 14.5px;
  font-weight: 700;
  line-height: 20px;
  text-align: left;
  cursor: pointer;
  transition: background-color .1s, color .1s, border-color .1s;
}

#cl-shopping-product-page .cl-source-product-nav-all svg {
  width: 18px;
  height: 18px;
  flex: none;
  color: var(--cl-text-sub);
}

#cl-shopping-product-page .cl-source-product-nav-all:hover,
#cl-shopping-product-page .cl-source-product-menu-row:hover,
#cl-shopping-product-page .cl-source-product-gallery:hover {
  background: #fafbfc;
}

#cl-shopping-product-page .cl-source-product-nav-all.active,
#cl-shopping-product-page .cl-source-product-gallery.active {
  background: #e4f7ec;
  border-left-color: var(--cl-green);
  color: var(--cl-green-text);
  font-weight: 700;
}

#cl-shopping-product-page .cl-source-product-nav-all.active svg {
  color: var(--cl-green);
}

#cl-shopping-product-page .cl-source-product-nav-caption {
  padding: 18px 24px 6px;
  color: var(--cl-text-muted);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .08em;
  line-height: 16px;
}

#cl-shopping-product-page .cl-source-product-menu-row {
  display: flex;
  align-items: center;
  width: 100%;
  gap: 8px;
  padding: 10px 24px;
  color: var(--cl-text);
  font-size: 14px;
  font-weight: 700;
  line-height: 20px;
  text-align: left;
  cursor: pointer;
}

#cl-shopping-product-page .cl-source-product-menu-row svg {
  width: 11px;
  height: 11px;
  flex: none;
  color: var(--cl-text-muted);
  transition: transform .15s;
}

#cl-shopping-product-page .cl-source-product-menu.open > .cl-source-product-menu-row svg {
  transform: rotate(90deg);
}

#cl-shopping-product-page .cl-source-product-menu:not(.open) .cl-source-product-galleries {
  display: none;
}

#cl-shopping-product-page .cl-source-product-gallery {
  display: block;
  width: 100%;
  padding: 10px 24px 10px 43px;
  border-left: 3px solid transparent;
  color: var(--cl-text-sub);
  font-size: 13.5px;
  font-weight: 500;
  line-height: 19px;
  text-align: left;
  cursor: pointer;
  transition: background-color .1s, color .1s, border-color .1s;
}

/* 갤러리 이름: 기본설정과 동일한 연필 / 인라인 저장·취소 컨트롤 */
#cl-shopping-product-page .cl-source-product-gallery {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px;
  padding: 7px 12px 7px 43px;
}
#cl-shopping-product-page .cl-source-product-gallery-select {
  flex: 1;
  min-width: 0;
  padding: 3px 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: left;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
#cl-shopping-product-page .cl-source-product-gallery-control {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 24px;
  width: 24px;
  height: 28px;
  padding: 4px;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: var(--cl-text-muted, #9297A3);
}
#cl-shopping-product-page .cl-source-product-gallery-control svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
#cl-shopping-product-page .cl-source-product-gallery-control.is-save,
#cl-shopping-product-page .cl-source-product-gallery-control:hover,
#cl-shopping-product-page .cl-source-product-gallery-control:focus-visible {
  color: var(--cl-green-text);
}
#cl-shopping-product-page .cl-source-product-gallery-rename { opacity: 0; }
#cl-shopping-product-page .cl-source-product-gallery:hover .cl-source-product-gallery-rename,
#cl-shopping-product-page .cl-source-product-gallery:focus-within .cl-source-product-gallery-rename { opacity: 1; }
#cl-shopping-product-page .cl-source-product-gallery-input {
  flex: 1;
  min-width: 0;
  width: 0;
  height: 32px;
  padding: 5px 8px;
  border: 1px solid var(--cl-primary, #03C75A);
  border-radius: 6px;
  background: #fff;
  color: var(--cl-text, #25282B);
  font: inherit;
}
#cl-shopping-product-page .cl-source-product-gallery-error {
  flex: 0 0 100%;
  color: #E5484D;
  font-size: 12px;
  line-height: 18px;
  overflow-wrap: anywhere;
}
#cl-shopping-product-page .cl-source-product-gallery-error:empty { display: none; }
#cl-shopping-product-page .cl-source-product-gallery-control:disabled,
#cl-shopping-product-page .cl-source-product-gallery-input:disabled { opacity: .5; cursor: wait; }
@media (hover: none) {
  #cl-shopping-product-page .cl-source-product-gallery-rename { opacity: 1; }
}

#cl-shopping-product-page .cl-source-product-main {
  flex: 1;
  min-width: 0;
  padding: 26px 30px 34px;
}

#cl-shopping-product-page .cl-source-product-main-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 22px;
}

#cl-shopping-product-page .cl-source-product-gallery-name {
  min-width: 0;
  margin: 0;
  color: var(--cl-text);
  font-size: 23px;
  font-weight: 800;
  line-height: 1.3;
  white-space: nowrap;
}

#cl-shopping-product-page .cl-source-product-tools {
  display: flex;
  flex: none;
  align-items: center;
  gap: 10px;
}

#cl-shopping-product-page .cl-source-product-search {
  position: relative;
  display: block;
  margin: 0;
}

#cl-shopping-product-page .cl-source-product-search input {
  display: block;
  width: 230px;
  height: 38px;
  margin: 0;
  padding: 9px 36px 9px 14px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
  box-shadow: none;
  color: var(--cl-text);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 18px;
  outline: 0;
}

#cl-shopping-product-page .cl-source-product-search input:focus {
  border-color: var(--cl-green);
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .15);
}

#cl-shopping-product-page .cl-source-product-search svg {
  position: absolute;
  top: 50%;
  right: 12px;
  width: 16px;
  height: 16px;
  color: var(--cl-text-muted);
  pointer-events: none;
  transform: translateY(-50%);
}

#cl-shopping-product-page .cl-source-product-view-select {
  z-index: 30;
}

#cl-shopping-product-page .cl-source-product-view-select .cl-redesign-select-trigger {
  height: 38px;
  min-width: 122px;
  padding-top: 8px;
  padding-bottom: 8px;
}

body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-category-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  min-height: 34px;
  gap: 14px;
  margin-bottom: 18px;
}

#cl-shopping-product-page .cl-source-product-category-label {
  flex: none;
  color: var(--cl-text);
  font-size: 14px;
  font-weight: 700;
  line-height: 20px;
  white-space: nowrap;
}

#cl-shopping-product-page .cl-source-product-category-divider {
  width: 1px;
  height: 14px;
  flex: none;
  background: var(--cl-border);
}

#cl-shopping-product-page .cl-source-product-toggle {
  position: relative;
  width: 36px;
  height: 20px;
  flex: none;
  padding: 0;
  background: #aeb4bd;
  border: 0;
  border-radius: 999px;
  cursor: pointer;
  transition: background-color .15s;
}

#cl-shopping-product-page .cl-source-product-toggle.active {
  background: var(--cl-green);
}

#cl-shopping-product-page .cl-source-product-toggle span {
  position: absolute;
  top: 2px;
  left: 2px;
  width: 16px;
  height: 16px;
  background: #fff;
  border-radius: 50%;
  box-shadow: 0 1px 2px rgba(20, 24, 32, .18);
  transition: left .15s;
}

#cl-shopping-product-page .cl-source-product-toggle.active span {
  left: 18px;
}

body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-category-tabs {
  display: flex;
  flex: 1 1 0;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  min-width: 0;
}

#cl-shopping-product-page .cl-source-product-category-tabs button {
  height: 30px;
  padding: 0 14px;
  background: transparent;
  border: 0;
  border-radius: 7px;
  color: var(--cl-text-sub);
  font-size: 13px;
  font-weight: 600;
  line-height: 30px;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color .12s, color .12s;
}

#cl-shopping-product-page .cl-source-product-category-tabs button:hover {
  background: #f1f2f5;
  color: var(--cl-text);
}

#cl-shopping-product-page .cl-source-product-category-tabs button.active {
  background: #e4f7ec;
  color: var(--cl-green-text);
  font-weight: 700;
}

#cl-shopping-product-page .cl-source-product-category-edit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  flex: none;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 7px;
  color: var(--cl-text-sub);
  cursor: pointer;
  transition: background-color .12s, color .12s;
}

#cl-shopping-product-page .cl-source-product-category-edit:hover {
  background: #f1f2f5;
  color: var(--cl-text);
}

#cl-shopping-product-page .cl-source-product-category-edit svg {
  width: 17px;
  height: 17px;
}

body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-status-tabs {
  display: flex;
  align-items: center;
  gap: 22px;
  margin-bottom: 0;
  border-bottom: 1px solid var(--cl-border);
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}

body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-status-tabs::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}

#cl-shopping-product-page .cl-source-product-status-tabs button {
  height: 45px;
  margin: 0 0 -1px;
  padding: 0 2px;
  background: transparent;
  border: 0;
  border-bottom: 2px solid transparent;
  color: var(--cl-text-sub);
  font-size: 14px;
  font-weight: 600;
  line-height: 43px;
  white-space: nowrap;
  cursor: pointer;
  transition: color .12s, border-color .12s;
}

#cl-shopping-product-page .cl-source-product-status-tabs button:hover {
  color: var(--cl-text);
}

#cl-shopping-product-page .cl-source-product-status-tabs button.active {
  border-bottom-color: var(--cl-green);
  color: var(--cl-green-text);
  font-weight: 700;
}

#cl-shopping-product-page .cl-source-product-bulkbar {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 51px;
  padding: 0 6px 0 0;
  border-bottom: 1px solid var(--cl-green);
}

#cl-shopping-product-page .cl-source-product-bulk-check {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 40px;
  align-self: flex-start;
  width: 40px;
  height: 50px;
  margin: 0;
  padding: 0;
}

#cl-shopping-product-page .cl-source-product-bulk-check input,
#cl-shopping-product-page .cl-source-product-bulkbar input[type="checkbox"] {
  display: inline-block;
  flex: none;
  width: 16px;
  height: 16px;
  margin: 0;
  padding: 0;
  appearance: none;
  -webkit-appearance: none;
  background: #fff !important;
  border: 1.5px solid #c9cdd4;
  border-radius: 4px;
  box-shadow: none;
  vertical-align: middle;
  cursor: pointer;
}

#cl-shopping-product-page .cl-source-product-bulk-check input:hover,
#cl-shopping-product-page .cl-source-product-bulkbar input[type="checkbox"]:hover {
  border-color: var(--cl-green);
}

#cl-shopping-product-page .cl-source-product-bulk-check input:checked,
#cl-shopping-product-page .cl-source-product-bulkbar input[type="checkbox"]:checked {
  background: var(--cl-green) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12.5l4.2 4.2L19 6.5' fill='none' stroke='%23ffffff' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 12px 12px no-repeat !important;
  border-color: var(--cl-green);
}

#cl-shopping-product-page .cl-source-product-bulk-check input:indeterminate,
#cl-shopping-product-page .cl-source-product-bulkbar input[type="checkbox"]:indeterminate {
  background: var(--cl-green) linear-gradient(#fff, #fff) center / 8px 2px no-repeat !important;
  border-color: var(--cl-green);
}

#cl-shopping-product-page .cl-source-product-bulk-check input:focus-visible,
#cl-shopping-product-page .cl-source-product-bulkbar input[type="checkbox"]:focus-visible {
  outline: 2px solid rgba(3, 199, 90, .3);
  outline-offset: 2px;
}

#cl-shopping-product-page .cl-source-product-bulk-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  min-width: 0;
  padding: 8px 0;
}

#cl-shopping-product-page .cl-source-product-bulk-actions button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 32px;
  padding: 0 13px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
  color: var(--cl-text);
  font-size: 13px;
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color .12s, border-color .12s, color .12s;
}

#cl-shopping-product-page .cl-source-product-bulk-actions button:hover {
  background: #e4f7ec;
  border-color: var(--cl-green);
  color: var(--cl-green-text);
}

body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-bulk-actions > button:is([data-product-bulk-cmd="prodDetail"], [data-product-bulk-cmd="prodInfo"]) {
  border-color: var(--cl-green);
  color: var(--cl-green-text);
}

body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-bulk-actions > button:is([data-product-bulk-cmd="prodDetail"], [data-product-bulk-cmd="prodInfo"]):is(:hover, :focus-visible) {
  background: var(--cl-green);
  border-color: var(--cl-green);
  color: #fff;
}

body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-bulk-actions > button:is([data-product-bulk-cmd="prodDetail"], [data-product-bulk-cmd="prodInfo"]):focus-visible {
  outline: 0;
  box-shadow: var(--cl-ring, 0 0 0 3px rgba(3, 199, 90, .13));
}

#cl-shopping-product-page .cl-source-product-bulk-actions button.danger {
  color: var(--cl-danger);
}

#cl-shopping-product-page .cl-source-product-bulk-actions button.danger:hover {
  background: #fdecf0;
  border-color: #f3b4b4;
  color: var(--cl-danger);
}

#cl-shopping-product-page .cl-source-product-bulk-order {
  position: relative;
  flex: none;
}

#cl-shopping-product-page .cl-source-product-bulk-order > button {
  gap: 5px;
}

#cl-shopping-product-page .cl-source-product-bulk-order > button svg {
  width: 13px;
  height: 13px;
  transition: transform .15s;
}

#cl-shopping-product-page .cl-source-product-bulk-order.open > button svg {
  transform: rotate(180deg);
}

#cl-shopping-product-page .cl-source-product-bulk-order-menu {
  position: fixed;
  top: calc(100% + 6px);
  left: 0;
  z-index: 40;
  display: none;
  min-width: 132px;
  padding: 6px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 10px;
  box-shadow: 0 8px 24px rgba(20, 24, 32, .14);
}

#cl-shopping-product-page .cl-source-product-bulk-order.open .cl-source-product-bulk-order-menu {
  display: block;
}

#cl-shopping-product-page .cl-source-product-bulk-order-menu button {
  justify-content: flex-start;
  width: 100%;
  height: auto;
  padding: 9px 12px;
  border: 0;
  border-radius: 7px;
  box-shadow: none;
  font-weight: 400;
  text-align: left;
}

#cl-shopping-product-page .cl-source-product-bulk-divider {
  width: 1px;
  height: 20px;
  margin: 0 3px;
  background: var(--cl-border);
}

@media (min-width: 1025px) {
  body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-bulk-actions > button:is([data-product-bulk-cmd="prodDetail"], [data-product-bulk-cmd="prodInfo"]),
  body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-bulk-divider {
    display: none;
  }
}

#cl-shopping-product-page .cl-source-product-table thead.is-hidden {
  display: none;
}

#cl-shopping-product-page .cl-source-product-table-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

/* Hidden products remain editable; mute content, not the entire row. */
@layer cl-product-visibility {
  body.cl-dashboard-redesign-page .gallery-modal.shopping .gallery-items > .table-item {
    border-color: transparent transparent var(--cl-border, #E5E7EB) !important;
    border-radius: 0 !important;
  }

  body.cl-dashboard-redesign-page .gallery-modal.shopping .gallery-items > .table-item.invisible,
  body.cl-dashboard-redesign-page #cl-shopping-product-page tr[data-product-hidden="true"] {
    visibility: visible !important;
    background: repeating-linear-gradient(135deg, transparent 0 6px, #CFDDD3 6px 7px, transparent 7px 12px) #F0F4F1 !important;
  }

  body.cl-dashboard-redesign-page #cl-shopping-product-page tr[data-product-hidden="true"] > td {
    background: transparent !important;
  }

  body.cl-dashboard-redesign-page .gallery-modal.shopping .gallery-items > .table-item.invisible > div {
    background: transparent !important;
    color: var(--cl-text-sub, #8A8F98) !important;
  }

  body.cl-dashboard-redesign-page .gallery-modal.shopping .gallery-items > .table-item.invisible :is(.item-title-str, .td-gallery span),
  body.cl-dashboard-redesign-page #cl-shopping-product-page tr[data-product-hidden="true"] .name {
    color: var(--cl-text-sub, #8A8F98) !important;
  }

  body.cl-dashboard-redesign-page .gallery-modal.shopping .gallery-items > .table-item.invisible .td-img::before {
    content: none !important;
    background: none !important;
  }

  body.cl-dashboard-redesign-page .gallery-modal.shopping .gallery-items > .table-item.invisible .td-img img,
  body.cl-dashboard-redesign-page #cl-shopping-product-page tr[data-product-hidden="true"] .cl-source-product-thumb {
    opacity: .5 !important;
  }

  body.cl-dashboard-redesign-page .gallery-modal.shopping .gallery-items > .table-item:is(.ui-selected, .ui-selecting) {
    background-color: #E4F7EC !important;
    border-top-color: var(--cl-green, #03C75A) !important;
    border-bottom-color: var(--cl-green, #03C75A) !important;
  }

  body.cl-dashboard-redesign-page .gallery-modal.shopping .gallery-items > .table-item .td-check input[type="checkbox"] {
    accent-color: var(--cl-green, #03C75A);
    opacity: 1 !important;
  }
}

#cl-shopping-product-page .cl-source-product-table {
  width: 100%;
  min-width: 900px;
  margin: 0;
  border: 0;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
}

#cl-shopping-product-page .cl-source-product-table th {
  height: 51px;
  padding: 15px 12px;
  background: #fff;
  border: 0;
  border-bottom: 1px solid var(--cl-border);
  color: var(--cl-text-sub);
  font-size: 12.5px;
  font-weight: 700;
  line-height: 18px;
  text-align: right;
  white-space: nowrap;
}

#cl-shopping-product-page .cl-source-product-table th.l {
  text-align: left;
}

#cl-shopping-product-page .cl-source-product-table th:first-child {
  padding: 0;
  vertical-align: middle;
  line-height: 0;
}

#cl-shopping-product-page .cl-source-product-table th:first-child input[type="checkbox"] {
  display: block;
  margin: 0 auto;
}

#cl-shopping-product-page .cl-source-product-table th.c,
#cl-shopping-product-page .cl-source-product-table td.c {
  text-align: center;
}

#cl-shopping-product-page .cl-source-product-table td {
  height: 73px;
  padding: 14px 12px;
  background: #fff;
  border: 0;
  border-bottom: 1px solid var(--cl-border);
  color: var(--cl-text);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 19px;
  text-align: right;
  vertical-align: middle;
}

#cl-shopping-product-page .cl-source-product-table th:nth-child(8),
#cl-shopping-product-page .cl-source-product-table td:nth-child(8) {
  padding-right: 8px;
  padding-left: 8px;
}

#cl-shopping-product-page .cl-source-product-table th:nth-child(2),
#cl-shopping-product-page .cl-source-product-table td:nth-child(2) {
  padding-right: 8px;
  padding-left: 8px;
  white-space: nowrap;
}

#cl-shopping-product-page .cl-source-product-order-cell { position: relative; }
body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-order-handle {
  position: absolute;
  left: 1px;
  top: 50%;
  transform: translateY(-50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 32px;
  padding: 4px;
  border: 0;
  border-radius: 5px;
  background: transparent;
  color: var(--cl-text-muted);
  cursor: grab;
  touch-action: auto;
  opacity: 0;
}
body.cl-dashboard-redesign-page #cl-shopping-product-page tr:hover .cl-source-product-order-handle,
body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-order-handle:focus-visible { opacity: 1; }
body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-order-handle:disabled { cursor: not-allowed; }
#cl-shopping-product-page .cl-source-product-order-handle svg { width: 16px; height: 20px; stroke: currentColor; stroke-width: 3; stroke-linecap: round; }
#cl-shopping-product-page .cl-product-order-dragging { opacity: .55; }
body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-product-order-dragging .cl-source-product-order-handle { cursor: grabbing; }
#cl-shopping-product-page .cl-product-order-before > td { box-shadow: inset 0 2px var(--cl-green, #03C75A); }
#cl-shopping-product-page .cl-product-order-after > td { box-shadow: inset 0 -2px var(--cl-green, #03C75A); }
@media (hover: none) {
  body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-order-handle { opacity: 1; }
}

#cl-shopping-product-page .cl-source-product-table td.l {
  text-align: left;
}

#cl-shopping-product-page .cl-source-product-table tbody tr:hover td {
  background: #fafbfc;
}

body.cl-dashboard-redesign-page #clProductTableBody {
  -webkit-user-select: none;
  user-select: none;
}

body.cl-dashboard-redesign-page #clProductTableBody input,
body.cl-dashboard-redesign-page #clProductTableBody textarea {
  -webkit-user-select: text;
  user-select: text;
}

body.cl-dashboard-redesign-page #clProductTableBody tr:is(.ui-selected, .ui-selecting) td {
  background-color: #E4F7EC;
}

body.cl-dashboard-redesign-page .ui-selectable-helper.cl-source-product-selection-box {
  position: absolute;
  z-index: 1000;
  pointer-events: none;
  border: 1px solid #03C75A;
  background: rgba(3, 199, 90, .08);
}

body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-empty {
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  min-height: 280px;
  padding: 40px 16px;
  color: var(--cl-text-muted);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 1.5;
  text-align: center;
  white-space: normal;
  overflow-wrap: anywhere;
}

body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-empty[hidden] {
  display: none;
}

#cl-shopping-product-page .cl-source-product-table input[type="checkbox"] {
  display: inline-block;
  flex: none;
  width: 16px;
  height: 16px;
  margin: 0;
  padding: 0;
  appearance: none;
  -webkit-appearance: none;
  background: #fff !important;
  border: 1.5px solid #c9cdd4;
  border-radius: 4px;
  box-shadow: none;
  vertical-align: middle;
  cursor: pointer;
}

#cl-shopping-product-page .cl-source-product-table input[type="checkbox"]:hover {
  border-color: var(--cl-green);
}

#cl-shopping-product-page .cl-source-product-table input[type="checkbox"]:checked {
  background: var(--cl-green) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12.5l4.2 4.2L19 6.5' fill='none' stroke='%23ffffff' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 12px 12px no-repeat !important;
  border-color: var(--cl-green);
}

#cl-shopping-product-page .cl-source-product-table input[type="checkbox"]:focus-visible {
  outline: 2px solid rgba(3, 199, 90, .3);
  outline-offset: 2px;
}

#cl-shopping-product-page .cl-source-product-item {
  display: flex;
  align-items: center;
  min-width: 0;
  gap: 12px;
}

#cl-shopping-product-page .cl-source-product-thumb {
  display: block;
  width: 44px;
  height: 44px;
  flex: none;
  overflow: hidden;
  background-color: #f1f2f5;
  background-position: center;
  background-size: cover;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
}

body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-thumb-wrap {
  position: relative;
  display: block;
  flex: none;
}

body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-grade-dot {
  position: absolute;
  top: 2px;
  left: calc(100% + 3px);
  width: 6px;
  height: 6px;
  border-radius: var(--r-full, 999px);
  background: var(--cl-green);
}

#cl-shopping-product-page .cl-source-product-thumb.thumb-1 {
  background-image: linear-gradient(135deg, #e8eef7, #b6c4d8 52%, #556070);
}

#cl-shopping-product-page .cl-source-product-thumb.thumb-2 {
  background-image: linear-gradient(135deg, #e8e1d5, #b98a64 52%, #464039);
}

#cl-shopping-product-page .cl-source-product-thumb.thumb-3 {
  background-image: linear-gradient(135deg, #dde9f0, #80a7be 50%, #23313a);
}

#cl-shopping-product-page .cl-source-product-thumb.thumb-4 {
  background-image: linear-gradient(135deg, #f6e4e9, #c68c9c 52%, #40313b);
}

#cl-shopping-product-page .cl-source-product-thumb.thumb-5 {
  background-image: linear-gradient(135deg, #f0ecdf, #c7ba8e 48%, #525141);
}

#cl-shopping-product-page .cl-source-product-thumb.thumb-6 {
  background-image: linear-gradient(135deg, #e1f0ed, #72aea0 50%, #263f45);
}

#cl-shopping-product-page .cl-source-product-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

#cl-shopping-product-page .cl-source-product-item .name {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  color: var(--cl-text);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 19px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-item > .cl-source-product-title {
  display: flex;
  flex: 1;
  flex-wrap: wrap;
  align-items: center;
  min-width: 0;
  gap: 4px 8px;
}

body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-item > .cl-source-product-title .name {
  flex: 0 1 auto;
  max-width: 100%;
}

body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-badges {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
}

body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-badges .product-badge {
  flex: none;
}

#cl-shopping-product-page .cl-source-product-row-actions {
  display: none;
  flex: none;
  align-items: center;
  gap: 7px;
  margin-left: 12px;
}

#cl-shopping-product-page .cl-source-product-table tbody tr:hover .cl-source-product-row-actions {
  display: inline-flex;
}

#cl-shopping-product-page .cl-source-product-row-actions button {
  height: 32px;
  padding: 0 13px;
  background: var(--cl-surface);
  border: 1px solid var(--cl-border);
  border-radius: 8px;
  color: var(--cl-green-text);
  font-size: 13px;
  font-weight: 600;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color .12s, border-color .12s, color .12s, box-shadow .12s;
}

#cl-shopping-product-page .cl-source-product-row-actions button[data-product-row-action="prodDetail"] {
  background: var(--cl-green-tint);
  border-color: var(--cl-green-line);
}

#cl-shopping-product-page .cl-source-product-row-actions button:hover {
  background: var(--cl-green-soft);
  border-color: var(--cl-green-line);
  color: var(--cl-green-text);
}

#cl-shopping-product-page .cl-source-product-row-actions button:focus-visible {
  border-color: var(--cl-green-action);
  outline: 0;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .13);
}

@media (max-width: 768px) {
  body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-table tbody tr:is(:hover, :focus-within) .cl-source-product-title {
    display: none;
  }

  #cl-shopping-product-page .cl-source-product-row-actions {
    margin-left: 0;
  }

  #cl-shopping-product-page .cl-source-product-table tbody tr:focus-within .cl-source-product-row-actions {
    display: inline-flex;
  }
}

body.cl-dashboard-redesign-page > .product-detail-modal {
  position: fixed !important;
  inset: 0 !important;
  z-index: 1000003 !important;
  display: block !important;
  width: 100vw !important;
  height: 100vh !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: #fff !important;
  transform: translateY(100%) !important;
  transition: transform .32s cubic-bezier(.2, .8, .2, 1) !important;
}

body.cl-dashboard-redesign-page > .product-detail-modal.open {
  transform: translateY(0) !important;
}

body.cl-dashboard-redesign-page > .product-detail-modal .detail-page {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: #fff !important;
}

body.cl-dashboard-redesign-page > .product-detail-modal .detail-iframe {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

/* Product SEO uses the v2 SEO form and the dashboard modal chrome. */
@layer cl-product-seo {
  body.cl-dashboard-redesign-page .flat-modal.cl-product-seo-wrap {
    position: fixed !important;
    inset: 0 !important;
    z-index: 1000005 !important;
    width: 100vw !important;
    height: 100dvh !important;
    margin: 0 !important;
    padding: 0 !important;
    background: rgba(0,0,0,.45) !important;
  }
  body.cl-dashboard-redesign-page .cl-product-seo-wrap > .modal {
    position: fixed !important;
    inset: 0 !important;
    z-index: 1000005 !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
  }
  body.cl-dashboard-redesign-page .cl-product-seo-wrap + .modal-backdrop,
  body.cl-dashboard-redesign-page .cl-product-seo-wrap .modal-backdrop { display: none !important; }
  body.cl-dashboard-redesign-page .cl-product-seo-wrap .cl-mobile-btn { display: none !important; }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal {
    width: calc(100% - 32px) !important;
    max-width: 600px !important;
    margin: 24px auto !important;
    padding: 0 !important;
    font-family: var(--cl-source-font) !important;
  }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .modal-content {
    display: block !important;
    float: none !important;
    width: 100% !important;
    height: auto !important;
    padding: 36px 0 0 !important;
    border: 0 !important;
    border-radius: 14px !important;
    background: #fff !important;
    box-shadow: 0 12px 34px rgba(20,24,32,.17) !important;
    max-height: calc(100dvh - 48px) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .modal-body {
    float: none !important;
    width: 100% !important;
    max-width: none !important;
    max-height: none !important;
    padding: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: visible !important;
  }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .modal-title {
    margin: 0 60px 28px !important;
    padding: 0 !important;
    text-align: center !important;
  }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .modal-title .SEO- {
    display: block !important;
    width: auto !important;
    max-width: none !important;
    height: auto !important;
    margin: 0 !important;
    font: 700 20px/28px var(--cl-source-font) !important;
    text-align: center !important;
    color: var(--cl-text) !important;
  }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .modal-footer {
    float: none !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 14px !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 40px 40px 36px !important;
    border: 0 !important;
    background: #fff !important;
  }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .modal-footer::before,
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .modal-footer::after { content: none !important; }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .modal-footer > .btn {
    width: 100% !important;
    max-width: none !important;
    height: 48px !important;
    margin: 0 !important;
    padding: 0 16px !important;
    border: 0 !important;
    border-radius: 8px !important;
    background: var(--cl-green) !important;
    color: #fff !important;
    font: 700 15px/20px var(--cl-source-font) !important;
  }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .modal-footer .ok-button-dialog:hover { background: var(--cl-green-hover) !important; }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .modal-footer .ok-button-dialog:disabled { background: #dbdcdf !important; color: #fff !important; cursor: default !important; }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .modal-footer .close-button-dialog { height: 42px !important; background: transparent !important; color: var(--cl-text-sub) !important; font-size: 13.5px !important; font-weight: 500 !important; }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .modal-footer .close-button-dialog:hover { background: #eaf9f1 !important; color: var(--cl-green-text) !important; }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .gallery-seo-button-label {
    width: auto !important; max-width: none !important; height: auto !important;
    font: inherit !important;
    color: inherit !important;
  }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .modal-content > .close-button-dialog {
    display: flex !important; align-items: center !important; justify-content: center !important;
    top: 20px !important; right: 22px !important; width: 30px !important; height: 30px !important;
    padding: 0 !important; margin: 0 !important; border: 0 !important; border-radius: 8px !important;
    background: transparent !important; color: var(--cl-text-sub) !important; opacity: 1 !important;
    transition: transform .18s, background-color .15s;
  }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .modal-content > .close-button-dialog::before,
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .modal-content > .close-button-dialog::after { content: none !important; }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .modal-content > .close-button-dialog :is(span, svg) { display: block !important; width: 15px !important; height: 15px !important; fill: currentColor !important; }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .modal-content > .close-button-dialog:hover { background: #f1f2f5 !important; color: var(--cl-text) !important; transform: rotate(90deg); }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal,
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal * { box-sizing: border-box !important; }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .gallery-seo-modal {
    flex: none !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    padding: 0 40px !important;
    overflow: visible !important;
    color: var(--cl-text) !important;
    font-family: var(--cl-source-font) !important;
    text-align: left !important;
  }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .seo-form {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: left !important;
  }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .gallery-seo-loading-spinner { border-top-color: var(--cl-green) !important; }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal :is(.seo-form label, .seo-representative-image-label, .seo-search-preview-label) {
    display: block !important; width: 100% !important; max-width: none !important; height: auto !important; margin: 0 0 8px !important;
    font: 700 14px/1.5 var(--cl-source-font) !important; color: var(--cl-text) !important;
    text-align: left !important;
  }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .seo-form :is(input:not([type="file"]), textarea) {
    display: block !important; width: 100% !important; min-width: 0 !important; max-width: none !important; height: 44px !important; margin: 0 !important; padding: 11px 13px !important;
    border: 1px solid var(--cl-border) !important; border-radius: 8px !important; background: #fff !important;
    font: 400 13.5px/20px var(--cl-source-font) !important; color: var(--cl-text) !important;
  }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .seo-form input.seo-keywords { margin-bottom: 20px !important; }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .seo-form textarea.seo-description { height: 96px !important; min-height: 76px !important; resize: vertical !important; }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .seo-form :is(input, textarea)::placeholder { color: var(--cl-text-muted) !important; font: inherit !important; }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .seo-form :is(input, textarea):focus { border-color: #03c75a !important; box-shadow: 0 0 0 3px rgba(3,199,90,.13) !important; }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .seo-title-validation {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    align-items: flex-start !important;
    gap: 4px !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    margin: 8px 0 20px !important;
  }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .seo-title-validation-item {
    display: inline-flex !important;
    flex: 0 1 auto !important;
    align-items: flex-start !important;
    min-width: 0 !important;
    max-width: 100% !important;
    gap: 3px !important;
  }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .seo-title-validation-item span { font: 400 12px/18px var(--cl-source-font) !important; color: var(--cl-text-sub) !important; white-space: normal !important; }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .seo-title-validation-item :is(.seo-title-count, .seo-description-count) { flex: none !important; white-space: nowrap !important; }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .seo-title-validation-check { width: 13px !important; height: 13px !important; flex: 0 0 13px !important; margin-top: 2px !important; fill: var(--cl-text-muted) !important; }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .is-valid .seo-title-validation-check { fill: var(--cl-green) !important; }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .seo-representative-image-row {
    display: flex !important;
    align-items: flex-start !important;
    gap: 24px !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    margin: 0 0 20px !important;
  }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .seo-representative-image-box {
    display: block !important;
    flex: 0 0 340px !important;
    width: 340px !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    padding: 0 0 14px !important;
    border: 1px solid var(--cl-border) !important;
    border-radius: 10px !important;
    overflow: hidden !important;
  }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .seo-representative-image-preview {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 340 / 168;
    margin: 0 0 14px !important;
    border: 0 !important;
    background: #edeff2 !important;
    overflow: hidden !important;
  }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .seo-representative-image-preview img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    object-fit: contain !important;
  }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .cl-seo-image-placeholder { width: 44px !important; height: 44px !important; color: #c4c9d0 !important; }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .seo-representative-image-title,
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .seo-representative-image-description {
    display: block !important;
    min-width: 0 !important;
    max-width: calc(100% - 32px) !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .seo-representative-image-title { height: auto !important; margin: 0 16px !important; width: calc(100% - 32px) !important; font: 600 13.5px/20px var(--cl-source-font) !important; color: var(--cl-text) !important; }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .seo-representative-image-description { height: auto !important; margin: 3px 16px 0 !important; width: calc(100% - 32px) !important; font: 400 12.5px/18px var(--cl-source-font) !important; color: var(--cl-text-sub) !important; }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .seo-representative-image-side {
    display: flex !important;
    flex: 1 1 0 !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 12px !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .seo-representative-image-file { display: none !important; }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .seo-representative-image-notice { height: auto !important; font: 400 12.5px/1.6 var(--cl-source-font) !important; color: var(--cl-text-sub) !important; }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .seo-representative-image-upload {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    width: auto !important;
    max-width: none !important;
    min-width: 32px !important;
    height: 34px !important;
    padding: 7px 12px !important;
    background: var(--cl-surface) !important;
    border: 1px solid var(--cl-border) !important;
    border-radius: 8px !important;
    color: var(--cl-text-sub) !important;
    line-height: 1 !important;
  }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .seo-representative-image-upload > svg { flex: none; }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .seo-representative-image-upload.is-upload > svg {
    width: 18px !important;
    height: 18px !important;
  }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .seo-representative-image-upload.is-upload > svg,
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .seo-representative-image-upload.is-upload > svg path {
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 2 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
  }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .seo-representative-image-upload.is-delete > svg { fill: currentColor; }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .seo-representative-image-upload.is-delete {
    width: 34px !important;
    padding: 8px !important;
    background: var(--cl-surface) !important;
  }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .seo-representative-image-upload.is-delete:hover,
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .seo-representative-image-upload.is-delete:focus-visible {
    background: var(--cl-green-tint) !important;
    border-color: var(--cl-green-line) !important;
    color: var(--cl-green-text) !important;
    outline: 0 !important;
  }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .seo-representative-image-upload span:not(.seo-representative-image-delete-icon) { max-width: none !important; font: 600 12.5px/18px var(--cl-source-font) !important; }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .seo-preview { width: 100% !important; min-width: 0 !important; max-width: none !important; height: auto !important; min-height: 92px !important; margin: 0 !important; padding: 12px 16px !important; border: 1px solid var(--cl-border) !important; border-radius: 10px !important; overflow: hidden !important; }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .preview-url { display: flex !important; align-items: center !important; width: 100% !important; min-width: 0 !important; max-width: none !important; margin-bottom: 4px !important; height: auto !important; }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .preview-favicon.cl-seo-site-indicator { flex: 0 0 12px !important; width: 12px !important; height: 12px !important; margin: 0 8px 0 0 !important; border-radius: 50% !important; background: #03c75a !important; }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .preview-url-text { min-width: 0 !important; height: auto !important; font: 400 12.5px/18px var(--cl-source-font) !important; color: var(--cl-text-sub) !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .preview-title { min-width: 0 !important; height: auto !important; margin: 0 !important; font: 600 15px/1.5 var(--cl-source-font) !important; color: #1a4bd6 !important; overflow-wrap: anywhere !important; }
  body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .preview-desc { height: auto !important; margin: 3px 0 0 !important; font: 400 12.5px/1.5 var(--cl-source-font) !important; color: var(--cl-text-sub) !important; white-space: normal !important; overflow-wrap: anywhere !important; }
  @media (max-width: 600px) {
    body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .gallery-seo-modal { padding: 0 20px !important; }
    body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .modal-footer { padding: 32px 20px 28px !important; }
    body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .seo-representative-image-row { flex-direction: column !important; gap: 12px !important; }
    body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .seo-representative-image-box { flex-basis: auto !important; width: 100% !important; }
    body.cl-dashboard-redesign-page .cl-product-seo-setting-modal .seo-representative-image-side { width: 100% !important; }
  }
}

/* Dashboard detail iframe: share product forms without restyling the preview. */
body.cl-dashboard-redesign-page.cl-source-product-detail-frame {
  padding-top: 0;
}

body.cl-dashboard-redesign-page.cl-source-product-detail-frame .dsgn-body > .product-detail-header .product-detail-title {
  color: var(--cl-text) !important;
}

@media (max-width: 768px) {
  body.cl-source-product-detail-frame .dsgn-body.body-detail {
    margin-top: 56px !important;
  }

  body.cl-source-product-detail-frame .dsgn-body > .product-detail-header {
    height: 56px;
    padding: 0;
  }

  body.cl-source-product-detail-frame .product-detail-header > .container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    height: 100%;
    padding: 0 12px;
    box-sizing: border-box;
  }

  body.cl-source-product-detail-frame .product-detail-header > .container::before,
  body.cl-source-product-detail-frame .product-detail-header > .container::after,
  body.cl-source-product-detail-frame .product-detail-header .clear {
    display: none;
  }

  body.cl-source-product-detail-frame .dsgn-body > .product-detail-header .product-detail-title {
    float: none;
    min-width: 0;
    margin: 0;
    padding: 0;
    font-family: var(--font, 'CreatorlinkSansKR', 'Apple SD Gothic Neo', 'Malgun Gothic', sans-serif);
    font-size: 14px;
    font-weight: 700;
    line-height: 1.3;
    white-space: nowrap;
  }

  body.cl-source-product-detail-frame .dsgn-body > .product-detail-header .product-detail-button {
    display: flex;
    flex: none;
    align-items: center;
    gap: 6px;
    float: none;
    margin: 0;
    padding: 0;
  }

  body.cl-source-product-detail-frame .dsgn-body > .product-detail-header .product-detail-button li {
    flex: none;
    width: auto;
    min-width: 44px;
    min-height: 44px;
    margin: 0;
    padding: 0 8px;
    font-size: 12px;
    white-space: nowrap;
  }
}

body.cl-dashboard-redesign-page .cl-source-product-template-modal {
  position: fixed;
  inset: 0;
  z-index: 1040;
  width: 100%;
  height: 100%;
  padding: 24px;
  background: rgba(0, 0, 0, .45);
  box-sizing: border-box;
}

body.cl-dashboard-redesign-page .cl-source-product-template-modal > form {
  display: flex;
  flex-direction: column;
  width: 100%;
  max-width: 1440px;
  height: 100%;
  margin: 0 auto;
  overflow: hidden;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 12px 34px rgba(20, 24, 32, .17);
}

body.cl-dashboard-redesign-page .cl-product-template-header {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 14px;
  padding: 16px 20px;
  border-bottom: 1px solid #e5e7eb;
  color: #222428;
  font-family: var(--cl-source-font);
}

body.cl-dashboard-redesign-page .cl-product-template-header h2 {
  flex: 1;
  margin: 0;
  font: 700 18px/1.4 var(--cl-source-font);
  letter-spacing: 0;
}

body.cl-dashboard-redesign-page .cl-source-product-template-modal .ptm-btn-area {
  position: static;
  display: flex;
  gap: 14px;
}

body.cl-dashboard-redesign-page .cl-source-product-template-modal .ptm-btn-area .btn {
  min-width: 80px;
  height: 40px;
  margin: 0;
  padding: 0 16px;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  background: #fff;
  color: #8a8f98;
  font: 600 13px/1 var(--cl-source-font);
  box-shadow: none;
}

body.cl-dashboard-redesign-page .cl-source-product-template-modal .ptm-btn-area .btn-close {
  border-color: transparent;
  background: transparent;
  font-size: 13.5px;
  transition: color .15s, background-color .15s;
}

body.cl-dashboard-redesign-page .cl-source-product-template-modal .ptm-btn-area .btn-close:hover,
body.cl-dashboard-redesign-page .cl-source-product-template-modal .ptm-btn-area .btn-close:focus-visible {
  background: #eaf9f1;
  color: var(--cl-green-text);
  border-color: transparent;
}

body.cl-dashboard-redesign-page .cl-product-template-close {
  display: inline-flex;
  flex: 0 0 30px;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  padding: 0;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #8a8f98;
  cursor: pointer;
  transition: color .15s, background-color .15s, transform .18s cubic-bezier(.34, 1.56, .64, 1);
}

body.cl-dashboard-redesign-page .cl-product-template-close svg {
  display: block;
  width: 15px;
  height: 15px;
  fill: currentColor;
}

body.cl-dashboard-redesign-page .cl-product-template-close svg path {
  fill: currentColor;
}

body.cl-dashboard-redesign-page .cl-product-template-close:hover,
body.cl-dashboard-redesign-page .cl-product-template-close:focus-visible {
  background: #f1f2f5;
  color: #222428;
  transform: rotate(90deg);
}

body.cl-dashboard-redesign-page .cl-source-product-template-modal .product-template-modal-container {
  flex: 1;
  min-height: 0;
  height: auto;
}

body.cl-dashboard-redesign-page .cl-source-product-template-modal .ptm-left {
  background: #fff;
  border-right: 1px solid #e5e7eb;
}

body.cl-dashboard-redesign-page .cl-source-product-template-modal .ptm-left .template-item {
  display: block;
  color: #8a8f98;
  border: 1px solid transparent;
  border-radius: 8px;
  font-family: var(--cl-source-font);
}

body.cl-dashboard-redesign-page .cl-source-product-template-modal .ptm-left .template-item:hover,
body.cl-dashboard-redesign-page .cl-source-product-template-modal .ptm-left .template-item:focus-visible,
body.cl-dashboard-redesign-page .cl-source-product-template-modal .ptm-left .template-item.active {
  background: #eaf9f1;
  border-color: #cdefdd;
  color: var(--cl-green-text);
}

body.cl-dashboard-redesign-page .cl-source-product-template-modal .template-item svg {
  fill: currentColor;
  filter: none;
}

body.cl-dashboard-redesign-page .cl-source-product-template-modal .ptm-right {
  min-width: 0;
  background: #f4f5f9;
}

body.cl-dashboard-redesign-page .cl-source-product-template-modal .ptm-content .content-box {
  min-width: 0;
  padding-bottom: 20px;
}

body.cl-dashboard-redesign-page .cl-source-product-template-modal .ptm-top {
  flex: 0 0 auto;
  padding-top: 12px;
  margin-bottom: 16px;
  font: 400 13px/1.5 var(--cl-source-font);
}

body.cl-dashboard-redesign-page .cl-source-product-template-modal .ptm-top .product-status-area {
  display: flex;
  align-items: center;
  gap: 10px;
  height: auto;
  padding: 8px 0;
}

body.cl-dashboard-redesign-page .cl-source-product-template-modal .ptm-top .option-area {
  justify-content: flex-start;
  align-items: center;
  gap: 12px 20px;
  margin: 8px 0 0;
  padding: 12px;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  box-sizing: border-box;
}

body.cl-dashboard-redesign-page .cl-source-product-template-modal .ptm-top .option-area > div {
  margin: 0;
}

body.cl-dashboard-redesign-page .cl-source-product-template-modal .ptm-top .option-area .option-reset-area {
  color: var(--cl-green-text);
  fill: var(--cl-green);
}

@layer cl-product-template-select {
  body.cl-dashboard-redesign-page .cl-source-product-template-modal .ptm-top .bootstrap-select {
    flex: 0 0 120px !important;
    width: 120px !important;
    min-width: 120px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-product-template-modal .ptm-top .bootstrap-select > .dropdown-toggle {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    width: 100% !important;
    height: 35px !important;
    padding: 6px 10px 6px 12px !important;
    background-image: none !important;
    outline: 0 !important;
    box-shadow: none !important;
  }

  body.cl-dashboard-redesign-page .cl-source-product-template-modal .ptm-top .bootstrap-select .filter-option {
    position: static !important;
    float: none !important;
    flex: 1 1 0 !important;
    width: auto !important;
    min-width: 0 !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: left !important;
  }

  body.cl-dashboard-redesign-page .cl-source-product-template-modal .ptm-top .bootstrap-select :is(.filter-option-inner, .filter-option-inner-inner) {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    white-space: nowrap !important;
  }

  body.cl-dashboard-redesign-page .cl-source-product-template-modal .ptm-top .bootstrap-select :is(.caret, .bs-caret),
  body.cl-dashboard-redesign-page .cl-source-product-template-modal .ptm-top .bootstrap-select > .dropdown-toggle::after,
  body.cl-dashboard-redesign-page .cl-source-product-template-modal .ptm-top :is(.product-status-area, .prouct-info-design) > svg {
    display: none !important;
  }

  body.cl-dashboard-redesign-page .cl-source-product-template-modal .ptm-top .cl-redesign-select-arrow {
    position: static !important;
    flex: 0 0 14px !important;
    width: 14px !important;
    height: 14px !important;
    margin: 0 !important;
    fill: none !important;
  }

  body.cl-dashboard-redesign-page .cl-source-product-template-modal .ptm-top .cl-redesign-select-menu {
    padding: 4px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-product-template-modal .ptm-top .cl-redesign-select-menu .dropdown-menu.inner {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  body.cl-dashboard-redesign-page .cl-source-product-template-modal .ptm-top .cl-redesign-select-menu li {
    box-sizing: border-box !important;
    height: 34px !important;
    min-height: 34px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    font-size: 12.5px !important;
    line-height: 18px !important;
    text-align: left !important;
  }

  body.cl-dashboard-redesign-page .cl-source-product-template-modal .ptm-top .cl-redesign-select-menu li + li {
    margin-top: 2px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-product-template-modal .ptm-top .cl-redesign-select-menu li > a {
    display: block !important;
    box-sizing: border-box !important;
    height: 34px !important;
    min-height: 34px !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    border: 0 !important;
    font: inherit !important;
    line-height: 18px !important;
    text-align: left !important;
  }

  body.cl-dashboard-redesign-page .cl-source-product-template-modal .ptm-top .cl-redesign-select-menu li > a .text {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    font: inherit !important;
    line-height: 18px !important;
    text-align: left !important;
  }
}

body.cl-dashboard-redesign-page .cl-source-product-template-modal .ptm-top .switch-input:checked ~ .switch-label {
  background: #03C75A;
  box-shadow: none;
}

body.cl-dashboard-redesign-page .cl-source-product-template-modal .ptm-content .btn-direction {
  flex-basis: 48px;
  padding-top: 0;
}

body.cl-dashboard-redesign-page .cl-source-product-template-modal .btn-direction svg {
  width: 24px;
  height: 24px;
}

body.cl-dashboard-redesign-page .cl-source-product-template-modal .ptm-content .content-box .viewer-container {
  flex: 1 1 auto;
  min-height: 120px;
  height: auto;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
}

body.cl-dashboard-redesign-page .cl-source-product-template-modal .ptm-content .content-box .viewer {
  min-width: 960px;
  min-height: 100%;
}

@media (max-width: 760px) {
  body.cl-dashboard-redesign-page .cl-source-product-template-modal { padding: 8px; }
  body.cl-dashboard-redesign-page .cl-source-product-template-modal .product-template-modal-container { flex-direction: column; }
  body.cl-dashboard-redesign-page .cl-product-template-header { flex-wrap: wrap; gap: 10px; padding: 12px; }
  body.cl-dashboard-redesign-page .cl-product-template-header h2 { font-size: 16px; }
  body.cl-dashboard-redesign-page .cl-source-product-template-modal .ptm-btn-area { order: 2; width: 100%; justify-content: flex-end; }
  body.cl-dashboard-redesign-page .cl-source-product-template-modal .ptm-left { display: flex; gap: 8px; flex: 0 0 88px; padding: 6px; overflow: auto; border-right: 0; border-bottom: 1px solid #e5e7eb; }
  body.cl-dashboard-redesign-page .cl-source-product-template-modal .ptm-left .template-item { flex: 0 0 74px; margin: 0; }
  body.cl-dashboard-redesign-page .cl-source-product-template-modal .ptm-right { flex: 1; width: 100%; min-height: 0; }
  body.cl-dashboard-redesign-page .cl-source-product-template-modal .ptm-content { min-height: 0; overflow-y: auto; }
  body.cl-dashboard-redesign-page .cl-source-product-template-modal .ptm-content .content-box { height: auto; min-height: 100%; overflow: visible; }
  body.cl-dashboard-redesign-page .cl-source-product-template-modal .ptm-content .btn-direction { flex-basis: 22px; }
  body.cl-dashboard-redesign-page .cl-source-product-template-modal .ptm-content .content-box .viewer-container { flex: 1 0 220px; }
  body.cl-dashboard-redesign-page .cl-source-product-template-modal .ptm-top .option-area { position: relative; }
  body.cl-dashboard-redesign-page .cl-source-product-template-modal .ptm-top .option-area .onoff-option-area { position: static; }
  body.cl-dashboard-redesign-page .cl-source-product-template-modal .onoff-option-layer { margin-left: 0 !important; transform: none; left: 8px; max-width: calc(100% - 16px); }
}

#cl-shopping-product-page .cl-source-product-date {
  display: inline-block;
  color: var(--cl-text);
  font-size: 13.5px;
  line-height: 1.5;
  white-space: nowrap;
}

#cl-shopping-product-page .cl-source-product-date .cl-source-product-time {
  color: var(--cl-text-sub);
  font-size: 11.5px;
}

#cl-shopping-product-page .cl-source-product-value-cell {
  white-space: nowrap;
}

#cl-shopping-product-page .cl-source-product-edit-cell {
  white-space: nowrap;
}

#cl-shopping-product-page .cl-source-product-value-wrap {
  position: relative;
  display: inline-block;
  max-width: 100%;
  vertical-align: middle;
  white-space: nowrap;
}

#cl-shopping-product-page .cl-source-product-edit-value {
  display: inline-block;
  white-space: nowrap;
}

#cl-shopping-product-page .cl-source-product-stock-warning {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 14px;
  height: 14px;
  margin-left: 4px;
  color: var(--cl-danger, #E5484D);
  vertical-align: middle;
  cursor: help;
}
#cl-shopping-product-page .cl-source-product-stock-warning svg {
  width: 14px;
  height: 14px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.3;
  stroke-linecap: round;
}
#cl-shopping-product-page .cl-source-product-stock-warning .warning-dot {
  fill: currentColor;
  stroke: none;
}

#cl-shopping-product-page .cl-source-product-value-edit {
  position: absolute;
  top: 50%;
  right: 100%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  margin: 0 4px 0 0;
  padding: 0;
  background: transparent;
  border: 0;
  color: var(--cl-text-muted);
  cursor: pointer;
  opacity: 0;
  pointer-events: none;
  transform: translateY(-50%);
  transition: color .12s, opacity .12s;
  visibility: hidden;
}

#cl-shopping-product-page .cl-source-product-value-edit:hover {
  color: var(--cl-green);
}

#cl-shopping-product-page .cl-source-product-table tbody tr:hover .cl-source-product-value-edit {
  opacity: 1;
  pointer-events: auto;
  visibility: visible;
}

#cl-shopping-product-page .cl-source-product-pencil {
  display: block;
  width: 14px;
  height: 14px;
}

#cl-shopping-product-page .cl-source-product-inline-edit {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

#cl-shopping-product-page .cl-source-product-edit-cell.c .cl-source-product-inline-edit {
  justify-content: center;
}

#cl-shopping-product-page .cl-source-product-inline-input {
  width: 60px;
  height: 30px;
  padding: 5px 6px;
  background: #fff;
  border: 1px solid var(--cl-green);
  border-radius: 6px;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .15);
  color: var(--cl-text);
  font-size: 13px;
  font-weight: 400;
  line-height: 18px;
  text-align: right;
  outline: none;
}

#cl-shopping-product-page .cl-source-product-unit {
  color: var(--cl-text-sub);
  font-size: 12.5px;
  white-space: nowrap;
}

#cl-shopping-product-page .cl-source-product-status-cell {
  position: relative;
}

#cl-shopping-product-page .cl-source-product-status-control {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-width: 0;
  height: 26px;
  padding: 4px 6px;
  background: transparent;
  border: 0;
  border-radius: 6px;
  color: inherit;
  cursor: pointer;
  transition: background .12s;
}

#cl-shopping-product-page .cl-source-product-status-control:hover {
  background: #f1f2f5;
}

#cl-shopping-product-page .cl-source-product-status-badge {
  color: var(--cl-green-text);
  font-size: 12.5px;
  font-weight: 600;
  line-height: 18px;
  white-space: nowrap;
}

#cl-shopping-product-page .cl-source-product-status-badge.soldout {
  color: #dc2626;
}

#cl-shopping-product-page .cl-source-product-status-badge.scheduled {
  color: #3b6fe0;
}

#cl-shopping-product-page .cl-source-product-status-badge.muted {
  color: var(--cl-text-muted);
}

#cl-shopping-product-page .cl-source-product-status-caret {
  position: absolute;
  top: 50%;
  left: 100%;
  display: block;
  width: 14px;
  height: 14px;
  margin-left: 2px;
  color: var(--cl-text-muted);
  opacity: 0;
  pointer-events: none;
  transform: translateY(-50%);
  transition: opacity .12s, transform .15s;
  visibility: hidden;
}

#cl-shopping-product-page .cl-source-product-table tbody tr:hover .cl-source-product-status-caret,
#cl-shopping-product-page .cl-source-product-status-control.open .cl-source-product-status-caret {
  opacity: 1;
  visibility: visible;
}

#cl-shopping-product-page .cl-source-product-status-control.open .cl-source-product-status-caret {
  transform: translateY(-50%) rotate(180deg);
}

#cl-shopping-product-page .cl-source-product-status-menu {
  position: absolute;
  top: calc(100% + 4px);
  right: 8px;
  z-index: 120;
  min-width: 132px;
  padding: 6px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 10px;
  box-shadow: 0 10px 26px rgba(20, 24, 32, .16);
  text-align: left;
}

#cl-shopping-product-page .cl-source-product-status-option {
  display: flex;
  align-items: center;
  width: 100%;
  gap: 8px;
  padding: 9px 10px;
  background: transparent;
  border: 0;
  border-radius: 7px;
  color: var(--cl-text);
  font-size: 13px;
  font-weight: 400;
  line-height: 18px;
  text-align: left;
  cursor: pointer;
  transition: background .1s, color .1s;
}

#cl-shopping-product-page .cl-source-product-status-option:hover {
  background: #e4f7ec;
  color: var(--cl-green-text);
}

#cl-shopping-product-page .cl-source-product-status-option.cur {
  color: var(--cl-green-text);
  font-weight: 700;
}

#cl-shopping-product-page .cl-source-product-status-check,
#cl-shopping-product-page .cl-source-product-status-check-sp {
  width: 15px;
  height: 15px;
  flex: none;
}

#cl-shopping-product-page .cl-source-product-status-check {
  color: var(--cl-green);
}

body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-category-overlay {
  position: fixed;
  inset: 0;
  z-index: 1210;
  display: none;
  align-items: flex-start;
  justify-content: center;
  box-sizing: border-box;
  height: 100vh;
  height: 100dvh;
  padding: 9vh 0 16px;
  padding-top: max(16px, 9dvh, env(safe-area-inset-top));
  padding-bottom: max(16px, env(safe-area-inset-bottom));
  overflow-y: auto;
  background: rgba(0, 0, 0, .45);
}

body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-category-overlay.open {
  display: flex;
}

body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-category-modal {
  position: relative;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  width: 420px;
  max-width: 92vw;
  max-height: 100%;
  margin-top: 0;
  overflow-y: auto;
  padding: 28px 28px 24px;
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 20px 50px rgba(20, 24, 32, .25);
}

body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-category-modal > * {
  flex-shrink: 0;
}

#cl-shopping-product-page .cl-source-product-category-modal h3 {
  margin: 0 0 22px;
  color: var(--cl-text);
  font-size: 19px;
  font-weight: 800;
  line-height: 27px;
  text-align: center;
}

#cl-shopping-product-page .cl-source-product-category-close {
  position: absolute;
  top: 18px;
  right: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 8px;
  color: var(--cl-text-sub);
  cursor: pointer;
  transition: color .15s, background .15s, transform .18s cubic-bezier(.34, 1.56, .64, 1);
}

#cl-shopping-product-page .cl-source-product-category-close:hover,
#cl-shopping-product-page .cl-source-product-category-close:focus {
  background: #f1f2f5;
  color: var(--cl-text);
  outline: 0;
  transform: rotate(90deg);
}

#cl-shopping-product-page .cl-source-product-category-close svg {
  display: block;
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
}

body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-category-edit-list {
  flex-shrink: 1;
  min-height: 48px;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior-y: contain;
  border: 1px solid var(--cl-border);
  border-radius: 10px;
}

@media (max-height: 500px) {
  body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-category-modal {
    padding-top: 16px;
    padding-bottom: 16px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-category-modal h3 {
    margin-bottom: 12px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-category-save {
    margin-top: 10px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-category-cancel {
    margin-top: 4px;
    padding-top: 7px;
    padding-bottom: 7px;
  }
}

#cl-shopping-product-page .cl-source-product-category-edit-item {
  background: #fff;
  border-bottom: 1px solid var(--cl-border);
}

#cl-shopping-product-page .cl-source-product-category-edit-item:last-child {
  border-bottom: 0;
}

#cl-shopping-product-page .cl-source-product-category-row-main {
  display: flex;
  align-items: center;
  width: 100%;
  gap: 10px;
  min-height: 47px;
  padding: 14px;
  background: transparent;
  border: 0;
  color: var(--cl-text);
  text-align: left;
  cursor: pointer;
  user-select: none;
  transition: background .1s;
}

#cl-shopping-product-page .cl-source-product-category-edit-item:hover .cl-source-product-category-row-main {
  background: #fafbfc;
}

#cl-shopping-product-page .cl-source-product-category-drag {
  display: flex;
  align-items: center;
  width: 14px;
  height: 16px;
  flex: none;
  color: var(--cl-text-muted);
  cursor: grab;
  opacity: 0;
  transition: opacity .1s;
}

#cl-shopping-product-page .cl-source-product-category-edit-item:hover .cl-source-product-category-drag {
  opacity: 1;
}

#cl-shopping-product-page .cl-source-product-category-name {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  color: var(--cl-text);
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#cl-shopping-product-page .cl-source-product-category-edit-item.dragging {
  opacity: .4;
}

#cl-shopping-product-page .cl-source-product-category-edit-item.drag-over-top {
  box-shadow: inset 0 2px 0 var(--cl-green);
}

#cl-shopping-product-page .cl-source-product-category-edit-item.drag-over-bottom {
  box-shadow: inset 0 -2px 0 var(--cl-green);
}

body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-category-edit-box {
  display: none;
  padding: 7px 12px;
  background: var(--cl-primary-soft, #F1FBF5);
}

#cl-shopping-product-page .cl-source-product-category-edit-item.editing .cl-source-product-category-row-main {
  display: none;
}

body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-category-edit-item.editing .cl-source-product-category-edit-box {
  display: block;
}

body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-category-edit-row {
  display: flex;
  align-items: center;
  gap: 4px;
}

body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-category-edit-row input {
  flex: 1;
  min-width: 0;
  width: 0;
  height: 32px;
  padding: 5px 8px;
  background: var(--cl-surface, #fff);
  border: 1px solid var(--cl-primary, #03C75A);
  border-radius: 6px;
  color: var(--cl-text);
  font: inherit;
  outline: none;
}

body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-category-edit-row input:focus-visible {
  box-shadow: var(--cl-ring, 0 0 0 3px rgba(3,199,90,.13));
}

#cl-shopping-product-page .cl-source-product-category-delete {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  flex: none;
  padding: 0;
  background: transparent;
  border: 0;
  color: #dc2626;
  cursor: pointer;
}

#cl-shopping-product-page .cl-source-product-category-delete svg {
  width: 19px;
  height: 19px;
}

#cl-shopping-product-page .cl-source-product-category-add {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 44px;
  margin-top: 10px;
  padding: 0;
  background: #f1f2f5;
  border: 0;
  border-radius: 10px;
  color: var(--cl-text-sub);
  cursor: pointer;
  transition: background .12s, color .12s;
}

#cl-shopping-product-page .cl-source-product-category-add:hover {
  background: #e4f7ec;
  color: var(--cl-green);
}

#cl-shopping-product-page .cl-source-product-category-add svg {
  width: 18px;
  height: 18px;
}

#cl-shopping-product-page .cl-source-product-category-save {
  width: 100%;
  height: 48px;
  margin-top: 20px;
  padding: 0;
  background: var(--cl-green);
  border: 0;
  border-radius: 10px;
  color: #fff;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  transition: background .13s;
}

#cl-shopping-product-page .cl-source-product-category-save:hover {
  background: var(--cl-green-hover);
}

#cl-shopping-product-page .cl-source-product-category-cancel {
  display: block;
  width: 100%;
  margin: 14px 0 0;
  padding: 11px;
  background: none;
  border: none;
  border-radius: 9px;
  color: var(--cl-text-sub);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 18px;
  text-align: center;
  cursor: pointer;
  transition: background .13s, color .13s;
}

#cl-shopping-product-page .cl-source-product-category-cancel:hover,
#cl-shopping-product-page .cl-source-product-category-cancel:focus {
  background: #e7e8e9;
  color: var(--cl-text);
  outline: 0;
}

/* Advanced options retain the product editor's existing option handlers. */
body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal {
  padding: 24px 16px !important;
  background: rgba(0, 0, 0, .45) !important;
  z-index: 1000004 !important;
  font-family: var(--cl-font) !important;
  letter-spacing: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal > .container {
  position: relative !important;
  width: 960px !important;
  max-width: 100% !important;
  min-height: 0 !important;
  max-height: calc(100vh - 48px);
  margin: 0 auto !important;
  padding: 0 0 24px !important;
  overflow: auto;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  box-shadow: 0 20px 50px rgba(20, 24, 32, .24);
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal h2 {
  position: sticky !important;
  top: 0 !important;
  z-index: 30;
  display: flex !important;
  align-items: center;
  width: 100% !important;
  height: 72px !important;
  margin: 0 !important;
  padding: 0 24px !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .top-buttons {
  position: static !important;
  display: flex;
  gap: 8px;
  margin-left: auto;
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .top-buttons > span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 72px;
  height: 36px;
  margin: 0;
  border-radius: 6px;
  font-size: 14px;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-save:not(.disabled) {
  background: #03C75A;
  color: #fff;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .cl-prod-info {
  display: none;
  position: absolute;
  width: 360px;
  max-width: calc(100vw - 58px);
  padding: 16px;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(20, 24, 32, .14);
  color: #8a8f98;
  font-size: 12.5px;
  font-weight: 400;
  line-height: 20px;
  text-align: left;
  white-space: normal;
  word-break: keep-all;
  overflow-wrap: break-word;
  pointer-events: none;
  z-index: 40;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .cl-prod-info > div + div {
  margin-top: 8px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .cl-prod-info::after {
  top: auto;
  bottom: -5px;
  left: var(--cl-prod-info-arrow-left, 24px) !important;
  border-color: #e5e7eb !important;
  transform: rotate(-45deg);
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .cl-prod-info.cl-prod-info-below::after {
  top: -5px;
  bottom: auto;
  transform: rotate(135deg);
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-group {
  margin: 24px 24px 0;
  gap: 12px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-group > label {
  flex-basis: 100px;
  width: 100px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .sales-option-section-body > .reset-wrap {
  /* 데스크톱 옵션 라벨 151px + 목록 531px의 오른쪽 끝에 정렬한다. */
  max-width: var(--cl-product-option-reset-width, calc(151px + 531px));
  padding-right: 0;
  text-align: right;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .reset-wrap .reset-options {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  line-height: 20px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .reset-wrap .reset-options > svg {
  position: static;
  display: block;
  flex: none;
  margin: 0;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .advanced-reset-options {
  position: static;
  margin-left: auto;
  transform: none;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .advanced-option-state-box label {
  border-radius: 18px;
  text-align: center;
  padding: 0 8px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-state {
  padding: 16px 70px 0 24px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-title {
  width: 112px;
  padding-left: 0;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-row,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-sortable {
  margin-left: 112px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .advanced-option-state-box label::before,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .advanced-option-state-box .newcheckbox::before {
  content: none !important;
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal hr.divider {
  margin-left: 0;
  margin-right: 0;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-list {
  margin: 0;
  padding: 16px 24px;
  overflow-x: auto;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .cl-options-fields-scroll {
  display: contents;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .cl-options-add-action {
  display: none;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-list table,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-list .options-toolbar {
  min-width: var(--cl-options-list-min-width, 640px);
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-list table th {
  white-space: nowrap;
}

/* 입력형의 마지막 셀은 판매 상태가 아닌 옵션명이다. */
body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-list table.option-text td.options-seq {
  width: auto;
  text-align: left;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-list table input.options-item-check,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-list table input.options-item-all {
  display: block !important;
  width: 20px !important;
  height: 20px !important;
  min-width: 20px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background-color: transparent !important;
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2020%2020%22%20width%3D%2220%22%20height%3D%2220%22%3E%3Cpath%20d%3D%22M5%202h10c1.66%200%203%201.34%203%203v10c0%201.66-1.34%203-3%203H5c-1.66%200-3-1.34-3-3V5c0-1.66%201.34-3%203-3%22%20style%3D%22fill%3A%23fff%22%2F%3E%3Cpath%20d%3D%22M15%203.25c.97%200%201.75.78%201.75%201.75v10c0%20.97-.78%201.75-1.75%201.75H5c-.97%200-1.75-.78-1.75-1.75V5c0-.97.78-1.75%201.75-1.75zM15%202H5C3.34%202%202%203.34%202%205v10c0%201.66%201.34%203%203%203h10c1.66%200%203-1.34%203-3V5c0-1.66-1.34-3-3-3%22%20style%3D%22fill%3A%23dbdcdf%22%2F%3E%3C%2Fsvg%3E") !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: 20px 20px !important;
  box-shadow: none !important;
  cursor: pointer !important;
  vertical-align: middle !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-list table input.options-item-check:not(:checked):hover,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-list table input.options-item-all:not(:checked):hover {
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2020%2020%22%20width%3D%2220%22%20height%3D%2220%22%3E%3Cpath%20d%3D%22M5%202h10c1.66%200%203%201.34%203%203v10c0%201.66-1.34%203-3%203H5c-1.66%200-3-1.34-3-3V5c0-1.66%201.34-3%203-3%22%20style%3D%22fill%3A%23eaf9f1%22%2F%3E%3Cpath%20d%3D%22M15%203.25c.97%200%201.75.78%201.75%201.75v10c0%20.97-.78%201.75-1.75%201.75H5c-.97%200-1.75-.78-1.75-1.75V5c0-.97.78-1.75%201.75-1.75zM15%202H5C3.34%202%202%203.34%202%205v10c0%201.66%201.34%203%203%203h10c1.66%200%203-1.34%203-3V5c0-1.66-1.34-3-3-3%22%20style%3D%22fill%3A%23cdefdd%22%2F%3E%3C%2Fsvg%3E") !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-list table input.options-item-check:checked,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-list table input.options-item-all:checked {
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2020%2020%22%20width%3D%2220%22%20height%3D%2220%22%3E%3Cpath%20fill%3D%22none%22%20d%3D%22M0%200h20v20H0z%22%20style%3D%22fill%3A%23222428%3Bfill-opacity%3A0%22%2F%3E%3Cpath%20d%3D%22M15%202H5C3.34%202%202%203.34%202%205v10c0%201.66%201.34%203%203%203h10c1.66%200%203-1.34%203-3V5c0-1.66-1.34-3-3-3m.03%206.03-5.5%205.5c-.29.29-.77.29-1.06%200l-3.5-3.5a.754.754%200%200%201%200-1.06c.29-.29.77-.29%201.06%200L9%2011.94l4.97-4.97c.3-.29.77-.28%201.06.02.28.29.28.75%200%201.04%22%20style%3D%22fill%3A%2303C75A%22%2F%3E%3C%2Fsvg%3E") !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-list table input.options-item-check:before,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-list table input.options-item-check:after,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-list table input.options-item-all:before,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-list table input.options-item-all:after {
  content: none !important;
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-h5 {
  float: none;
  width: auto;
  margin: 24px 24px 0;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-info-modal {
  background: rgba(0, 0, 0, .45);
  z-index: 1000005;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-info-modal > .container {
  width: 740px !important;
  max-width: 100% !important;
  margin: 0 auto !important;
}

@media (max-width: 767px) {
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal h2 {
    padding: 0 12px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .top-buttons {
    gap: 4px;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .top-buttons > span {
    width: 48px;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-group {
    flex-wrap: wrap;
    margin: 20px 16px 0;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-group > label {
    flex-basis: 100%;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .advanced-option-state-box {
    flex-wrap: wrap;
    gap: 6px;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .advanced-option-state-box .newcheckbox {
    margin: 0;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .advanced-option-state-box label {
    width: auto;
    min-width: 74px;
    font-size: 13px;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-state {
    padding: 16px 16px 0;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal :is(.options-section[data-type="2"], .options-section[data-type="3"], .options-text-section, .options-more-section) {
    --cl-options-editor-min-width: 480px;
    max-width: 100%;
    min-width: 0;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .cl-options-fields-scroll {
    display: block;
    overflow-x: auto;
    padding-right: 32px;
    overscroll-behavior-x: contain;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .cl-options-fields-scroll .options-sortable {
    padding-bottom: 0;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .cl-options-fields-scroll .options-data:last-child {
    margin-bottom: 0;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-sortable .options-add {
    display: none;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-state > .cl-options-add-action {
    position: static;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    width: max-content;
    height: 44px;
    margin: 0 0 0 auto;
    background: transparent;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-state > .cl-options-add-action::after {
    content: attr(aria-label);
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-section[data-type="3"] {
    --cl-options-editor-min-width: 640px;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal :is(.options-section[data-type="2"], .options-section[data-type="3"], .options-text-section, .options-more-section) > .cl-options-fields-scroll > :is(.options-row, .options-sortable) {
    min-width: var(--cl-options-editor-min-width);
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-list {
    min-width: 0;
    max-width: 100%;
    overscroll-behavior-x: contain;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-list:has(.op-value2) {
    --cl-options-list-min-width: 840px;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-list table :is(.op-title, .op-value, .op-value2) {
    min-width: 160px;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-title {
    float: none;
    width: auto;
    padding: 0;
    margin-top: 0;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-row,
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-sortable {
    margin-left: 0;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-row.depth2,
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-row.depth3 {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-row.depth3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-row.depth2::before,
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-row.depth3::before {
    grid-column: 1 / -1;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-row.depth2 .options-th1,
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-row.depth2 .options-th2,
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-row.depth3 .options-th1,
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-row.depth3 .options-th2,
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-row.depth3 .options-th3 {
    width: 100%;
    min-width: 0;
    padding: 0;
    margin-left: 0;
  }
}

/* 이전 compact 상품 모달 브리지 스타일은 G.20260701 전체화면 디자인과 충돌하므로 비활성화한다. */
@media not all {
body.cl-dashboard-redesign-page .cl-source-product-add-modal.prod-modal {
  position: fixed !important;
  inset: 0 !important;
  z-index: 999999 !important;
  display: block;
  width: 100vw !important;
  height: 100vh !important;
  overflow-x: hidden;
  overflow-y: auto;
  padding: 48px 24px 56px;
  background: rgba(0, 0, 0, .45);
  box-sizing: border-box;
  color: #222428;
  font-family: var(--cl-source-font);
  -webkit-overflow-scrolling: touch;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-header {
  position: relative;
  top: auto;
  right: auto;
  z-index: 2;
  width: min(1040px, calc(100vw - 48px));
  margin: 0 auto;
  background: #fff;
  border: 1px solid #dfe3ea;
  border-bottom: 1px solid #eef0f4;
  border-radius: 16px 16px 0 0;
  box-shadow: none;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-header > .prod-header-wrap {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  max-width: none;
  min-height: 72px;
  padding: 0 188px 0 72px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-header > .prod-header-wrap h1.prod-title {
  margin: 0;
  padding: 0;
  color: #222428;
  font-size: 20px;
  font-weight: 800;
  line-height: 28px;
  text-align: center;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-header > .prod-header-wrap ul.prod-button {
  position: absolute;
  top: 50%;
  right: 24px;
  display: flex;
  flex-direction: row-reverse;
  align-items: center;
  gap: 10px;
  margin: 0;
  padding: 0;
  transform: translateY(-50%);
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-header > .prod-header-wrap ul.prod-button > li {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 116px;
  height: 40px;
  margin: 0;
  padding: 0 18px;
  border-radius: 9px;
  cursor: pointer;
  font-size: 14px;
  font-weight: 700;
  line-height: 1;
  transition: background-color .13s, color .13s, transform .16s;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-header > .prod-header-wrap ul.prod-button > li.modal-close {
  position: relative;
  width: 40px;
  min-width: 40px;
  padding: 0;
  background: transparent;
  border: 0;
  color: var(--cl-text-sub);
  font-size: 0;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-header > .prod-header-wrap ul.prod-button > li.modal-close::before,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-header > .prod-header-wrap ul.prod-button > li.modal-close::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 17px;
  height: 2px;
  border-radius: 999px;
  background: currentColor;
  transform-origin: center;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-header > .prod-header-wrap ul.prod-button > li.modal-close::before {
  transform: translate(-50%, -50%) rotate(45deg);
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-header > .prod-header-wrap ul.prod-button > li.modal-close::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-header > .prod-header-wrap ul.prod-button > li.modal-close:hover {
  background: #f1f2f5;
  color: var(--cl-text);
  transform: rotate(90deg);
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-header > .prod-header-wrap ul.prod-button > li.modal-save {
  min-width: 136px;
  background: #03C75A;
  color: #fff;
  box-shadow: none;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-header > .prod-header-wrap ul.prod-button > li.modal-save:hover {
  background: #02b351;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .product-wrap {
  width: min(1040px, calc(100vw - 48px));
  max-width: none;
  margin: 0 auto;
  padding: 24px 28px 42px;
  background: #fff;
  border: 1px solid #dfe3ea;
  border-top: 0;
  border-radius: 0 0 16px 16px;
  box-shadow: 0 24px 64px rgba(20, 24, 32, .24);
  box-sizing: border-box;
  text-align: left;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-caption {
  margin: 0 0 20px;
  padding: 0;
  color: #8a8f98;
  font-size: 13px;
  font-weight: 400;
  line-height: 20px;
  text-align: right;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-image-wrap svg,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap svg {
  max-width: 24px;
  max-height: 24px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal form[name="prod_form"] {
  display: flex;
  align-items: flex-start;
  gap: 28px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-image-wrap {
  flex: 0 0 280px;
  max-width: 280px;
  width: 280px;
  padding: 0;
  box-sizing: border-box;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-image-wrap > .prod-item-image {
  position: relative;
  display: block;
  width: 100%;
  aspect-ratio: 1 / 1;
  height: auto;
  margin: 0 0 12px;
  overflow: hidden;
  background-color: #fafbfc;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 44px 44px;
  border: 1px solid #dfe3ea;
  border-radius: 10px;
  box-sizing: border-box;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-image-wrap > .prod-item-image > .guide-img {
  display: block;
  width: 100%;
  height: 100%;
  opacity: 0;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-image-wrap > .prod-item-image > .preview-img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-image-wrap > .prod-item-thumb {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-image-wrap > .prod-item-thumb > li {
  position: relative;
  display: block;
  float: none !important;
  width: auto !important;
  aspect-ratio: 1 / 1;
  height: auto !important;
  margin: 0 !important;
  overflow: hidden;
  text-align: center;
  box-sizing: border-box;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-image-wrap > .prod-item-thumb > li > img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-image-wrap > .prod-item-thumb > li.prod-item-image-add > .guide-img {
  opacity: 0;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-image-wrap > .prod-item-thumb > li.prod-item-image-add > svg {
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  width: 22px !important;
  height: 22px !important;
  max-width: 22px !important;
  max-height: 22px !important;
  fill: #03C75A;
  transform: translate(-50%, -50%) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap {
  flex: 1 1 auto;
  min-width: 0;
  width: auto;
  max-width: none;
  padding-left: 0;
  padding-right: 0;
  box-sizing: border-box;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap {
  min-height: 58px;
  height: auto;
  margin-bottom: 10px;
  padding: 10px 14px;
  background: #fafbfc;
  border: 1px solid #dfe3ea;
  border-radius: 10px;
  box-shadow: none;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.disabled {
  background: #f1f3f5;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap .product-gallery-name,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap .form-label {
  position: static !important;
  top: auto !important;
  left: auto !important;
  display: block;
  float: none !important;
  color: #8a8f98;
  font-size: 13px;
  font-weight: 600;
  line-height: 36px;
  text-align: left;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap .form-label {
  flex: 0 0 92px;
  min-width: 92px;
  width: 92px;
  margin-right: 18px;
  padding: 0;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap > .form-group {
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 38px;
  margin: 0;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.height-auto > .form-group {
  align-items: flex-start;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap .form-label.textarea {
  padding-top: 8px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap .form-group.choose-gallery {
  display: flex;
  align-items: center;
  height: 38px;
  padding: 0 12px;
  background: #fff;
  border: 1px solid #dfe3ea;
  border-radius: 8px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap .product-gallery-name {
  flex: 1;
  min-width: 0;
  padding-top: 0;
  color: #222428;
  line-height: 36px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap .custom-caret {
  top: 0;
  right: 0;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap input.prod-input,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap textarea.prod-input {
  flex: 1 1 auto;
  width: auto;
  min-width: 0;
  min-height: 38px;
  padding: 8px 11px;
  background: #fff;
  border: 1px solid #dfe3ea;
  border-radius: 8px;
  color: #222428;
  font-size: 13.5px;
  font-weight: 400;
  line-height: 20px;
  outline: 0;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap textarea.prod-input {
  min-height: 88px;
  resize: vertical;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap input.prod-input:focus,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap textarea.prod-input:focus {
  border-color: #03C75A;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .12);
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap input.prod-input:read-only {
  background: #f3f4f6;
  color: #8a8f98;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap .cl-prod-info {
  display: none;
  position: absolute !important;
  float: none !important;
  z-index: 40 !important;
  width: min(320px, calc(100vw - 64px));
  max-height: 260px;
  overflow: auto;
  padding: 12px 14px;
  background: #fff;
  border: 1px solid #dfe3ea;
  border-radius: 8px;
  box-shadow: 0 10px 28px rgba(20, 24, 32, .16);
  box-sizing: border-box;
  color: #222428;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.55;
  letter-spacing: 0;
  text-align: left;
  word-break: keep-all;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap .cl-prod-info::after {
  content: "";
  position: absolute;
  bottom: -5px;
  left: 24px;
  width: 9px;
  height: 9px;
  background: #fff;
  border-right: 1px solid #dfe3ea;
  border-bottom: 1px solid #dfe3ea;
  transform: rotate(45deg);
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap .cl-prod-info > div {
  margin: 0 0 8px;
  overflow: hidden;
  line-height: 1.55;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap .cl-prod-info > div:last-child {
  margin-bottom: 0;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap .cl-prod-info > div > span {
  float: left;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap .cl-prod-info > div > div {
  float: left;
  width: calc(100% - 12px);
  margin-left: 4px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap .cl-prod-info.discount-info,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap .cl-prod-info.npay-button-info,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap .cl-prod-info.unit-pricing-info {
  top: -48px;
  left: 110px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.status,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.npay-button,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.unit-pricing,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.culture-benefit,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.use-qna,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap#pccc-yn,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap#require-navershop {
  position: relative;
  height: auto !important;
  min-height: 58px;
  padding: 10px 60px 10px 14px;
  background: #fff;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap::after,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.disabled::after,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.status::after,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.status.disabled::after {
  content: none !important;
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.disabled,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.status.disabled,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.npay-button.disabled,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.unit-pricing.disabled {
  background: #f8fafb;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.status > .form-group,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.status > .product-padding-box > .form-group,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.npay-button .form-group,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.unit-pricing .form-group,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.culture-benefit > .form-group,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.use-qna > .form-group,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap#pccc-yn > .form-group,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap#require-navershop > .form-group {
  display: flex;
  align-items: center;
  min-height: 38px;
  margin: 0;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.status > .product-padding-box {
  height: auto !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap #state-append,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap #status-append {
  margin: 12px -14px -10px;
  padding: 14px;
  background: #f8fafb;
  border-top: 1px solid #eef0f4;
  border-radius: 0 0 10px 10px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap #etc-calendar,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap #sale-calendar {
  margin-top: 0;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.npay-button .npay-button-box {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 38px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.npay-button .npay-button-box > .form-group {
  flex: 1 1 auto;
  min-width: 0;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.npay-button .npay-button-label {
  flex: 0 0 92px;
  width: 92px;
  line-height: 18px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.npay-button .npay-button-status {
  position: static;
  margin-left: 18px;
  color: #8a8f98;
  font-size: 13.5px;
  font-weight: 500;
  transform: none;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.unit-pricing .unit-pricing-box {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 38px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.unit-pricing .unit-pricing-box > .form-group {
  flex: 1 1 auto;
  min-width: 0;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.unit-pricing .form-label.unit-pricing {
  flex: 0 0 92px;
  width: 92px;
  line-height: 18px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.unit-pricing.disabled .unit-pricing-toggle {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.unit-pricing:has(.switch-unit-pricing:not(:checked)) .unit-pricing-toggle {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.unit-pricing .unit-pricing-toggle {
  display: flex;
  margin: 12px 0 0;
  padding: 16px 0 2px;
  border-top: 1px solid #eef0f4;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.unit-pricing .unit-pricing-toggle > div[style] {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.unit-pricing .unit-pricing-toggle .grid {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  grid-auto-rows: minmax(34px, auto);
  gap: 10px 18px;
  width: 100%;
  padding: 0;
  color: #222428;
  font-size: 13px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.unit-pricing .unit-pricing-toggle .grid > div {
  display: flex;
  align-items: center;
  min-height: 34px;
  margin: 0;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.unit-pricing .unit-pricing-toggle .grid > div:nth-child(1),
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.unit-pricing .unit-pricing-toggle .grid > div:nth-child(5) {
  grid-column: 1 / -1;
  color: #8a8f98;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.unit-pricing .unit-pricing-toggle input[type="text"] {
  width: 96px;
  height: 34px;
  max-width: none;
  padding: 0 10px;
  background: #fff;
  border: 1px solid #dfe3ea;
  border-radius: 7px;
  color: #222428;
  font-size: 13px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.unit-pricing .unit-pricing-toggle .dropdown.bootstrap-select {
  width: 78px !important;
  margin-left: 8px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.unit-pricing .unit-pricing-toggle .dropdown.bootstrap-select > button {
  height: 34px;
  padding: 0 24px 0 10px;
  background: #fff;
  border: 1px solid #dfe3ea;
  border-radius: 7px;
  color: #222428;
  font-size: 13px;
  box-shadow: none;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap .input-switch {
  position: absolute;
  top: 50%;
  right: 16px;
  z-index: 5;
  display: flex;
  align-items: center;
  justify-content: center;
  transform: translateY(-50%);
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap .input-switch label {
  display: block;
  width: 36px;
  height: 20px;
  margin: 0;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap .input-switch input.switch[type="checkbox"] {
  position: absolute;
  width: 36px;
  height: 20px;
  margin: 0;
  opacity: 0;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap .input-switch input.switch[type="checkbox"].ios-switch + div {
  position: relative;
  width: 36px;
  height: 20px;
  margin: 0;
  background: #aeb4bd;
  border: 0;
  border-radius: 999px;
  box-shadow: none;
  cursor: pointer;
  transition: background-color .15s;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap .input-switch input.switch[type="checkbox"].ios-switch + div > div {
  position: absolute;
  top: 2px;
  left: 2px;
  float: none;
  width: 16px;
  height: 16px;
  margin: 0;
  background: #fff;
  border-radius: 50%;
  box-shadow: 0 1px 2px rgba(20, 24, 32, .18);
  transition: transform .15s;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap .input-switch input.switch[type="checkbox"].ios-switch:checked + div {
  background: #03C75A;
  border: 0;
  box-shadow: none;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap .input-switch input.switch[type="checkbox"].ios-switch:checked + div > div {
  background: #fff;
  box-shadow: 0 1px 2px rgba(20, 24, 32, .18);
  transform: translateX(16px);
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #status-product-box > .product-padding-box > .form-group > .product-state-box {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0;
  width: auto;
  min-height: 0;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #status-product-box > .product-padding-box > .form-group > .product-state-box > div {
  float: none;
  margin: 0;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #status-product-box > .product-padding-box > .form-group > .product-state-box input[type="radio"] {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #status-product-box > .product-padding-box > .form-group > .product-state-box label {
  position: relative;
  z-index: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 112px;
  height: 36px;
  margin: 0 0 0 -1px;
  padding: 0 14px;
  background: #fff;
  border: 1px solid #dfe3ea;
  color: #8a8f98;
  cursor: pointer;
  font-size: 13px;
  font-weight: 600;
  line-height: 1;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #status-product-box > .product-padding-box > .form-group > .product-state-box > div:first-child label {
  margin-left: 0;
  border-radius: 8px 0 0 8px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #status-product-box > .product-padding-box > .form-group > .product-state-box > div:last-child label {
  border-radius: 0 8px 8px 0;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #status-product-box > .product-padding-box > .form-group > .product-state-box input:checked + label,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #status-product-box > .product-padding-box > .form-group > .product-state-box label.active {
  z-index: 1;
  background: #fff;
  border-color: #03C75A;
  color: var(--cl-green-text);
  font-weight: 700;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #status-product-box > .product-padding-box > .form-group > .product-state-box input:checked + label::before,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #status-product-box > .product-padding-box > .form-group > .product-state-box label.active::before {
  content: "";
  width: 10px;
  height: 6px;
  margin-right: 7px;
  border-left: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(-45deg) translateY(-1px);
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.prod-item-price1 {
  padding-right: 92px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.prod-item-price1 .prod-input-discount-rate,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.prod-item-price1 .prod-discount-unit-btn {
  height: 38px;
  border-color: #dfe3ea;
  border-radius: 8px;
  color: #222428;
  font-size: 13.5px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.prod-item-price1 .discount-unit-select {
  border-color: #dfe3ea;
  border-radius: 8px;
  box-shadow: 0 10px 24px rgba(20, 24, 32, .13);
  overflow: hidden;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .gallery-menus-wrap {
  border: 1px solid #dfe3ea;
  border-radius: 0 0 10px 10px;
  box-shadow: 0 12px 28px rgba(20, 24, 32, .14);
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-image-wrap > .prod-item-thumb > li.prod-item-image-add {
  background-color: #fafbfc;
  border: 1px solid #dfe3ea;
  border-radius: 10px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap .check-sale {
  position: absolute;
  top: 50%;
  right: 16px;
  z-index: 3;
  display: inline-flex;
  align-items: center;
  margin: 0;
  color: #8a8f98;
  font-size: 13px;
  font-weight: 500;
  line-height: 18px;
  transform: translateY(-50%);
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap .check-sale .checkbox {
  display: inline-flex;
  align-items: center;
  min-height: 0;
  margin: 0;
  padding: 0;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap .check-sale .checkbox input[type="checkbox"] {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap .check-sale .checkbox label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 0;
  padding: 0;
  color: inherit;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap .check-sale .checkbox label svg {
  position: static !important;
  flex: 0 0 16px;
  width: 16px !important;
  height: 16px !important;
  max-width: 16px !important;
  max-height: 16px !important;
  margin: 0 !important;
  fill: currentColor;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap .check-sale.checked {
  color: var(--cl-green-text);
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap .check-sale.disabled,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap .check-sale input[type="checkbox"]:disabled + label {
  color: #b4b8bf;
  cursor: default;
}

@media (max-width: 900px) {
  body.cl-dashboard-redesign-page .cl-source-product-add-modal.prod-modal {
    padding: 16px;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-header,
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .product-wrap {
    width: calc(100vw - 32px);
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-header > .prod-header-wrap {
    justify-content: flex-start;
    min-height: 66px;
    padding: 0 164px 0 20px;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-header > .prod-header-wrap ul.prod-button {
    right: 14px;
    width: auto;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-header > .prod-header-wrap ul.prod-button > li {
    flex: 0 0 auto;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-header > .prod-header-wrap ul.prod-button > li.modal-save {
    min-width: 112px;
    padding: 0 12px;
    font-size: 12.5px;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-header > .prod-header-wrap ul.prod-button > li.modal-close {
    width: 36px;
    min-width: 36px;
    height: 36px;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .product-wrap {
    padding: 20px 18px 56px;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal form[name="prod_form"] {
    flex-direction: column;
    gap: 18px;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-image-wrap {
    flex: 0 0 auto;
    max-width: none;
    width: 100%;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap {
    width: 100%;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.prod-item-price1 {
    padding-right: 14px;
    padding-bottom: 42px;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap .check-sale {
    top: auto;
    right: 14px;
    bottom: 12px;
    transform: none;
  }
}
}

/* G.20260701 상품정보 설정창: 상품관리 리디자인 화면 전용 원본 디자인 보정 */
body.cl-dashboard-redesign-page .cl-source-product-add-modal.prod-modal {
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  z-index: 999999 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  padding: 0 !important;
  overflow-x: hidden !important;
  overflow-y: scroll !important;
  background: #eef0f4 !important;
  color: #222428;
  font-family: var(--cl-source-font);
  box-sizing: border-box;
  -webkit-overflow-scrolling: touch;
}

html.cl-source-product-add-open,
body.cl-dashboard-redesign-page.cl-source-product-add-open,
html:has(body.cl-dashboard-redesign-page .cl-source-product-add-modal.prod-modal),
body.cl-dashboard-redesign-page:has(.cl-source-product-add-modal.prod-modal) {
  overflow: hidden !important;
  scrollbar-gutter: auto !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal.prod-modal.over-hidden {
  overflow: hidden !important;
}

body.cl-dashboard-redesign-page.cl-source-product-resource-open #el-fileupload.cl-source-product-resource-modal {
  z-index: var(--cl-product-resource-z, 1000002) !important;
}

body.cl-dashboard-redesign-page.cl-source-product-resource-open .modal-backdrop.cl-source-product-resource-backdrop,
body.cl-dashboard-redesign-page.cl-source-product-resource-open #el-fileupload.cl-source-product-resource-modal + .modal-backdrop {
  z-index: calc(var(--cl-product-resource-z, 1000002) - 1) !important;
}

/* 이미지 보관함 폴더 삭제 팝업 */
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.confirm-resource-folder-delete),
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.modal-over-1:has(.modal-dialog.confirm-resource-folder-delete) {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  overflow: hidden !important;
  background: rgba(20, 24, 32, .45) !important;
  z-index: 1000005 !important;
}

body.cl-dashboard-redesign-page .modal-backdrop.cl-source-folder-delete-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.confirm-resource-folder-delete) + .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.modal-over-1:has(.modal-dialog.confirm-resource-folder-delete) + .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.confirm-resource-folder-delete) + .modal-backdrop.fade.in,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.modal-over-1:has(.modal-dialog.confirm-resource-folder-delete) + .modal-backdrop.fade.in {
  background: transparent !important;
  opacity: 0 !important;
  z-index: 1000004 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.confirm-resource-folder-delete) > .modal-default,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.modal-over-1:has(.modal-dialog.confirm-resource-folder-delete) > .modal-default {
  position: fixed !important;
  inset: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100vw !important;
  min-height: 100vh !important;
  margin: 0 !important;
  padding: 24px 16px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  background: transparent !important;
  z-index: inherit !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.confirm-resource-folder-delete) > .modal-default > .cl-mobile-btn.close {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.confirm-resource-folder-delete {
  width: min(520px, calc(100vw - 32px)) !important;
  max-width: min(520px, calc(100vw - 32px)) !important;
  margin: auto !important;
  padding: 0 !important;
  background: transparent !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default.in .modal-dialog.confirm-resource-folder-delete,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default.fade .modal-dialog.confirm-resource-folder-delete {
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.confirm-resource-folder-delete .modal-content {
  position: relative !important;
  width: 100% !important;
  min-height: 0 !important;
  padding: 42px 36px 30px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border, #e5e7eb) !important;
  border-radius: 14px !important;
  box-shadow: 0 24px 70px rgba(20, 24, 32, .28) !important;
  color: var(--cl-text, #222428) !important;
  font-family: var(--cl-source-font) !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.confirm-resource-folder-delete .modal-body {
  width: 100% !important;
  max-width: none !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text-sub, #8a8f98) !important;
  font-size: 14px !important;
  line-height: 1.7 !important;
  text-align: center !important;
  word-break: keep-all !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.confirm-resource-folder-delete .modal-title {
  margin: 0 34px 24px !important;
  padding: 0 !important;
  color: var(--cl-text, #222428) !important;
  font-size: 22px !important;
  font-weight: 800 !important;
  line-height: 30px !important;
  letter-spacing: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.confirm-resource-folder-delete .modal-content > .close.close-button-dialog {
  position: absolute !important;
  top: 16px !important;
  right: 16px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub, #8a8f98) !important;
  font-size: 0 !important;
  line-height: 1 !important;
  opacity: 1 !important;
  text-shadow: none !important;
  transition: color .15s, background .15s, transform .18s cubic-bezier(.34, 1.56, .64, 1) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.confirm-resource-folder-delete .modal-content > .close.close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.confirm-resource-folder-delete .modal-content > .close.close-button-dialog:focus {
  background: #f1f2f5 !important;
  color: var(--cl-text, #222428) !important;
  outline: 0 !important;
  transform: rotate(90deg) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.confirm-resource-folder-delete .modal-content > .close.close-button-dialog svg {
  display: block !important;
  width: 9px !important;
  height: 9px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.confirm-resource-folder-delete .popup-info.edit-link-info {
  width: 100% !important;
  margin: 0 0 26px !important;
  padding: 0 !important;
  color: var(--cl-text, #222428) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 1.7 !important;
  text-align: center !important;
  word-break: keep-all !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.confirm-resource-folder-delete .duplicate-gallery-content.delete-folder {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  float: none !important;
  clear: none !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.confirm-resource-folder-delete .duplicate-gallery-content.delete-folder > li {
  display: block !important;
  float: none !important;
  clear: none !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.confirm-resource-folder-delete .duplicate-gallery-content.delete-folder > li > div {
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  height: 52px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border, #e5e7eb) !important;
  border-radius: 8px !important;
  color: var(--cl-text-sub, #8a8f98) !important;
  cursor: pointer !important;
  transition: border-color .13s, background .13s, color .13s !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.confirm-resource-folder-delete .duplicate-gallery-content.delete-folder > li.active > div {
  background: var(--cl-green-tint, #f3fcf7) !important;
  border-color: var(--cl-green, #03C75A) !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.confirm-resource-folder-delete .duplicate-gallery-content.delete-folder svg {
  flex: 0 0 20px !important;
  width: 20px !important;
  height: 20px !important;
  margin: 0 12px 0 0 !important;
  fill: #d5d9e0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.confirm-resource-folder-delete .duplicate-gallery-content.delete-folder > li.active svg {
  fill: var(--cl-green, #03C75A) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.confirm-resource-folder-delete .duplicate-gallery-content.delete-folder h5 {
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text, #222428) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 20px !important;
  letter-spacing: 0 !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.confirm-resource-folder-delete .duplicate-gallery-content.delete-folder > li.active h5 {
  color: var(--cl-green-text) !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.confirm-resource-folder-delete .modal-footer {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  width: 100% !important;
  max-width: none !important;
  margin: 28px auto 0 !important;
  padding: 0 !important;
  border: 0 !important;
  gap: 10px !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.confirm-resource-folder-delete .modal-footer > .btn {
  float: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: none !important;
  height: 46px !important;
  min-height: 46px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  text-decoration: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.confirm-resource-folder-delete .modal-footer > .ok-button-dialog,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.confirm-resource-folder-delete .modal-footer > .ok-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.confirm-resource-folder-delete .modal-footer > .ok-button-dialog:focus {
  background: var(--cl-danger, #e5484d) !important;
  border: 1px solid var(--cl-danger, #e5484d) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.confirm-resource-folder-delete .modal-footer > .ok-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.confirm-resource-folder-delete .modal-footer > .ok-button-dialog:focus {
  background: #d93f44 !important;
  border-color: #d93f44 !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.confirm-resource-folder-delete .modal-footer > .close-button-dialog,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.confirm-resource-folder-delete .modal-footer > .close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.confirm-resource-folder-delete .modal-footer > .close-button-dialog:focus {
  background: transparent !important;
  border: 0 !important;
  color: var(--cl-text-sub, #8a8f98) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.confirm-resource-folder-delete .modal-footer > .close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.confirm-resource-folder-delete .modal-footer > .close-button-dialog:focus {
  background: #eaf9f1 !important;
  color: var(--cl-green-text) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page #el-fileupload.in ~ .ui-selectable-helper,
body.cl-dashboard-redesign-page #el-fileupload.show ~ .ui-selectable-helper,
body.cl-dashboard-redesign-page:has(#el-fileupload.in) .ui-selectable-helper,
body.cl-dashboard-redesign-page:has(#el-fileupload.show) .ui-selectable-helper {
  z-index: 1000004 !important;
  border: 1px dotted rgba(3, 199, 90, .72) !important;
  background: rgba(3, 199, 90, .12) !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .modal#el-fileupload {
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 24px !important;
  overflow: hidden !important;
  background: rgba(20, 24, 32, .34) !important;
  color: var(--cl-text, #222428);
  font-family: var(--cl-source-font) !important;
  box-sizing: border-box;
}

body.cl-dashboard-redesign-page .modal#el-fileupload.full-width {
  padding: 0 !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-dialog.modal-resourcebox {
  width: min(1120px, calc(100vw - 48px)) !important;
  max-width: none !important;
  height: calc(100vh - 48px) !important;
  min-height: min(560px, calc(100vh - 48px)) !important;
  margin: 0 auto !important;
  padding: 0 !important;
  font-family: var(--cl-source-font) !important;
}

body.cl-dashboard-redesign-page #el-fileupload.full-width .modal-dialog.modal-resourcebox {
  width: 100% !important;
  height: 100vh !important;
  min-height: 100vh !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-dialog.modal-resourcebox .modal-content.resource-files-content {
  height: 100% !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  background: #fff !important;
  border: 1px solid var(--cl-border, #e5e7eb) !important;
  border-radius: 12px !important;
  box-shadow: 0 24px 70px rgba(20, 24, 32, .24) !important;
}

body.cl-dashboard-redesign-page #el-fileupload.full-width .modal-dialog.modal-resourcebox .modal-content.resource-files-content {
  border-radius: 0 !important;
  border-right: 0 !important;
  border-left: 0 !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .modal-header {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex: 0 0 56px !important;
  min-height: 56px !important;
  max-height: 56px !important;
  padding: 0 16px 0 22px !important;
  background: #fff !important;
  border: 0 !important;
  border-bottom: 1px solid var(--cl-line, #eef0f4) !important;
  color: var(--cl-text, #222428) !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .modal-header h4 {
  margin: 0 !important;
  color: var(--cl-text, #222428) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 22px !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .modal-header .close {
  position: relative !important;
  top: auto !important;
  right: auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 32px;
  width: 32px !important;
  height: 32px !important;
  margin: 0 0 0 auto !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 7px !important;
  background: transparent !important;
  color: var(--cl-text-sub, #8a8f98) !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .modal-header .close:hover,
body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .modal-header .close:focus {
  background: #f0f2f5 !important;
  color: var(--cl-text, #222428) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .modal-header .close span,
body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .modal-header .close svg {
  display: block !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .modal-header .close svg {
  width: 15px !important;
  height: 15px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .modal-body {
  display: flex !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
  min-height: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: #fff !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .nav-tabs {
  display: flex !important;
  align-items: center !important;
  flex: 0 0 52px !important;
  min-height: 52px !important;
  max-height: 52px !important;
  gap: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #f3f4f6 !important;
  border: 0 !important;
  border-bottom: 1px solid var(--cl-line, #eef0f4) !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .nav-tabs::before,
body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .nav-tabs::after {
  display: none !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .nav-tabs > li:not(.right) {
  flex: 0 0 147px !important;
  width: 147px !important;
  min-width: 147px !important;
  max-width: 147px !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .nav-tabs > li > a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-width: 147px !important;
  height: 52px !important;
  margin: 0 !important;
  padding: 0 20px !important;
  border: 1px solid transparent !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--cl-text-sub, #8a8f98) !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  line-height: 18px !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  text-transform: none !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .nav-tabs > li.active > a,
body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .nav-tabs > li.active > a:hover,
body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .nav-tabs > li.active > a:focus {
  background: #fff !important;
  border-top-color: #fff !important;
  border-right-color: var(--cl-line, #eef0f4) !important;
  border-bottom-color: #fff !important;
  border-left-color: var(--cl-line, #eef0f4) !important;
  color: var(--cl-green-text) !important;
  box-shadow: inset 0 2px 0 var(--cl-green, #03C75A) !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .nav-tabs > li.active:first-child > a,
body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .nav-tabs > li.active:first-child > a:hover,
body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .nav-tabs > li.active:first-child > a:focus {
  border-left-color: #fff !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .nav-tabs > li > a:hover,
body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .nav-tabs > li > a:focus {
  background: #fff !important;
  color: var(--cl-green-text) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .nav-tabs > li:not(.active) > a:hover,
body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .nav-tabs > li:not(.active) > a:focus {
  border-bottom-color: var(--cl-line, #eef0f4) !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .nav-tabs > li.right {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex: 1 1 0 !important;
  min-width: 32px !important;
  margin: 0 !important;
  padding: 0 20px !important;
  float: none !important;
  text-align: right !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .nav-tabs > li.right > div {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  width: 100% !important;
  gap: 0 !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .nav-tabs > li #btn-resourcebox-fullwidth {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 32px !important;
  height: 32px !important;
  border-radius: 7px !important;
  color: var(--cl-text-sub, #8a8f98) !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .nav-tabs > li #btn-resourcebox-fullwidth:hover,
body.cl-dashboard-redesign-page #el-fileupload.full-width .modal-resourcebox .nav-tabs > li #btn-resourcebox-fullwidth {
  background: var(--cl-green-soft, #eaf9f1) !important;
  color: var(--cl-green, #03C75A) !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .nav-tabs > li #btn-resourcebox-fullwidth svg {
  width: 16px !important;
  height: 16px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .nav-tabs > li #btn-resourcebox-fullwidth + label {
  display: none !important;
  margin: 0 !important;
  color: var(--cl-text-sub, #8a8f98) !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  line-height: 16px !important;
  letter-spacing: 0 !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .tab-content,
body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .tab-content > .active {
  display: flex !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-heading {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex: 0 0 auto !important;
  min-height: 58px !important;
  max-height: none !important;
  gap: 16px !important;
  padding: 11px 18px !important;
  overflow: visible !important;
  border-bottom: 1px solid var(--cl-line, #eef0f4) !important;
  background: #fff !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-heading::before,
body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-heading::after {
  display: none !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-heading > .pull-left,
body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-heading > .pull-right {
  display: flex !important;
  align-items: center !important;
  min-width: 0 !important;
  float: none !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-heading > .pull-right {
  justify-content: flex-end !important;
  gap: 8px !important;
  margin-left: auto !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-heading .info,
body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-heading .resource-info,
body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-heading .upload-max-size {
  color: var(--cl-text-sub, #8a8f98) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 18px !important;
  letter-spacing: 0 !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  width: auto !important;
  min-width: 96px !important;
  height: 36px !important;
  margin: 0 !important;
  padding: 0 14px !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  line-height: 34px !important;
  letter-spacing: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .btn.fileinput-button,
body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .btn.fileinput-button:hover,
body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .btn.fileinput-button:focus {
  min-width: 158px !important;
  border: 1px solid var(--cl-green-line, #cdefdd) !important;
  background: var(--cl-green-tint, #f3fcf7) !important;
  color: var(--cl-green-text) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .btn.fileinput-button .resource-info,
body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .btn.fileinput-button .resource-info span {
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .btn.fileinput-button::before {
  content: "";
  display: inline-block;
  flex: 0 0 16px;
  width: 16px;
  height: 16px;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 1.5 4.7 4.8l.8.8L7.4 3.7v7.1h1.2V3.7l1.9 1.9.8-.8L8 1.5ZM3 9.8h1.2v3h7.6v-3H13V14H3V9.8Z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 1.5 4.7 4.8l.8.8L7.4 3.7v7.1h1.2V3.7l1.9 1.9.8-.8L8 1.5ZM3 9.8h1.2v3h7.6v-3H13V14H3V9.8Z'/%3E%3C/svg%3E") center / contain no-repeat;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .btn.fileinput-button img {
  display: none !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .btn.resource-useit,
body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .btn.btn-default {
  border: 1px solid var(--cl-border, #e5e7eb) !important;
  background: #fff !important;
  color: var(--cl-text-sub, #8a8f98) !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .btn.resource-useit.active {
  border-color: var(--cl-green, #03C75A) !important;
  background: var(--cl-green, #03C75A) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .btn.resource-useit:not(.active) {
  border-color: var(--cl-border, #e5e7eb) !important;
  background: #f8fafb !important;
  color: var(--cl-text-muted, #b4b8bf) !important;
  opacity: 1 !important;
  cursor: default !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .btn.resource-useit:not(.active):hover,
body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .btn.resource-useit:not(.active):focus {
  border-color: var(--cl-border, #e5e7eb) !important;
  background: #f8fafb !important;
  color: var(--cl-text-muted, #b4b8bf) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .btn.resource-useit:hover,
body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .btn.resource-useit:focus,
body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .btn.btn-default:hover,
body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .btn.btn-default:focus {
  border-color: var(--cl-green-line, #cdefdd) !important;
  background: var(--cl-green-soft, #eaf9f1) !important;
  color: var(--cl-green-text) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .btn.resource-useit.active:hover,
body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .btn.resource-useit.active:focus {
  border-color: var(--cl-green-hover, #02b351) !important;
  background: var(--cl-green-hover, #02b351) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-body {
  display: flex !important;
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow: hidden !important;
  background: #fff !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-body_left {
  display: flex !important;
  flex: 0 0 238px !important;
  flex-direction: column !important;
  width: 238px !important;
  min-width: 238px !important;
  max-width: 238px !important;
  min-height: 0 !important;
  padding: 14px !important;
  overflow: hidden !important;
  border-right: 1px solid var(--cl-line, #eef0f4) !important;
  background: #fafbfc !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-body_right,
body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-body_center {
  display: flex !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
  min-width: 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
  background: #fff !important;
}

body.cl-dashboard-redesign-page #el-fileupload #mystorage .dd-header {
  flex: 0 0 auto !important;
  min-height: 0 !important;
  max-height: none !important;
  padding: 0 0 12px !important;
  border-bottom: 1px solid var(--cl-line, #eef0f4) !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page #el-fileupload #mystorage .dd-header .add-folder {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  height: 36px !important;
  margin: 0 0 10px !important;
  padding: 0 12px !important;
  border: 1px solid var(--cl-green-line, #cdefdd) !important;
  border-radius: 8px !important;
  background: var(--cl-green-tint, #f3fcf7) !important;
  color: var(--cl-green-text) !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  line-height: 18px !important;
  letter-spacing: 0 !important;
}

body.cl-dashboard-redesign-page #el-fileupload #mystorage .dd-header .add-folder svg {
  width: 14px !important;
  height: 14px !important;
  margin: 0 !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .folder-search-group,
body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-search-group {
  display: flex !important;
  align-items: center !important;
  height: 36px !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 10px !important;
  border: 1px solid var(--cl-border, #e5e7eb) !important;
  border-radius: 8px !important;
  background: #f8fafb !important;
  color: var(--cl-text-sub, #8a8f98) !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-search-group {
  flex: 0 1 360px !important;
  width: 360px !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .folder-search-group span,
body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-search-group span {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 16px !important;
  width: 16px !important;
  height: 16px !important;
  margin: 0 7px 0 0 !important;
  color: var(--cl-text-sub, #8a8f98) !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .folder-search-group span svg,
body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-search-group span svg {
  width: 16px !important;
  height: 16px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .folder-search-group input,
body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-search-group input {
  flex: 1 1 auto !important;
  width: auto !important;
  height: 34px !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--cl-text, #222428) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 18px !important;
  letter-spacing: 0 !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .folder-search-group input::placeholder,
body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-search-group input::placeholder {
  color: var(--cl-text-muted, #b4b8bf) !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .folder-search-group .folder-search-btn,
body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-search-group .resource-search-btn {
  display: none !important;
}

body.cl-dashboard-redesign-page #el-fileupload #mystorage #nestableFolder {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  margin: 12px -6px 0 !important;
  padding: 0 6px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}

body.cl-dashboard-redesign-page #el-fileupload .dd-list.fll {
  gap: 2px !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page #el-fileupload .dd-list.fll > .fli {
  flex: 0 0 auto !important;
  min-height: 36px !important;
  max-height: none !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page #el-fileupload .dd-list.fll > .fli > .fli-wrap {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  height: 36px !important;
  padding: 0 8px 0 26px !important;
  border: 0 !important;
  border-radius: 7px !important;
  background: transparent !important;
  color: var(--cl-text-sub, #8a8f98) !important;
}

body.cl-dashboard-redesign-page #el-fileupload .dd-list.fll > .fli.active > .fli-wrap {
  background: var(--cl-green-soft, #eaf9f1) !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page #el-fileupload .dd-list.fll > .fli:not(.active):hover > .fli-wrap {
  background: transparent !important;
  color: var(--cl-text-sub, #8a8f98) !important;
}

body.cl-dashboard-redesign-page #el-fileupload .dd-list.fll > .fli > .fli-wrap > span[class*=dd-] {
  color: currentColor !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  line-height: 18px !important;
}

body.cl-dashboard-redesign-page #el-fileupload .dd-list.fll > .fli.active > .fli-wrap > span[class*=dd-] {
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page #el-fileupload .dd-list.fll > .fli > .fli-wrap > span[class*=dd-] svg {
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page #el-fileupload .dd-list.fll > .fli > .fli-wrap > span.dd-fln {
  flex: 0 1 auto !important;
  max-width: calc(100% - 98px) !important;
  min-width: 0 !important;
  padding: 0 4px 0 8px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  text-transform: none !important;
}

body.cl-dashboard-redesign-page #el-fileupload .dd-list.fll > .fli > .fli-wrap > span.dd-flc {
  flex: 0 0 auto !important;
  max-width: 36px !important;
  margin: 0 auto 0 0 !important;
  color: var(--cl-green-text) !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page #el-fileupload .dd-list.fll > .fli > .fli-wrap > span.cl-handle {
  position: absolute !important;
  top: 8px !important;
  left: 4px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 20px !important;
  height: 20px !important;
  padding: 0 !important;
  color: #d1d3d5 !important;
  opacity: 0;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page #el-fileupload .dd-list.fll > .fli:not(.fl-nodrag):hover > .fli-wrap > span.cl-handle {
  opacity: 1;
}

body.cl-dashboard-redesign-page #el-fileupload .dd-list.fll > .fli > .fli-wrap > span.cl-handle svg {
  width: 20px !important;
  height: 20px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page #el-fileupload .dd-list.fll > .fli > .fli-wrap > span[class*=dd-].fli-hover {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px !important;
  max-width: 24px !important;
  height: 24px;
  padding: 0 !important;
  border-radius: 6px;
  cursor: pointer !important;
  pointer-events: auto !important;
}

body.cl-dashboard-redesign-page #el-fileupload .dd-list.fll > .fli > .fli-wrap > span[class*=dd-].fli-hover:hover {
  background: rgba(3, 199, 90, .12);
}

body.cl-dashboard-redesign-page #el-fileupload .dd-list.fll > .fli > .fli-wrap > span[class*=dd-].fli-hover svg,
body.cl-dashboard-redesign-page #el-fileupload .dd-list.fll > .fli > .fli-wrap > span[class*=dd-].fli-hover svg * {
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page #el-fileupload .dd-list.fll > .fli:is(:not(:hover), .fl-nodrag) > .fli-wrap > span[class*=dd-].fli-hover {
  display: none !important;
  width: 0 !important;
  max-width: 0 !important;
  margin-left: 0 !important;
}

body.cl-dashboard-redesign-page #el-fileupload .dd-list.fll > .fli:is(:not(:hover), .fl-nodrag) > .fli-wrap > span[class*=dd-].fli-hover.dd-flf[data-fav="1"] {
  display: inline-flex !important;
  width: 24px !important;
  max-width: 24px !important;
  margin-left: 0 !important;
}

body.cl-dashboard-redesign-page #el-fileupload .dd-list.fll > .fli[data-id="all"] > .fli-wrap > span.fli-hover {
  display: none !important;
  width: 0 !important;
  max-width: 0 !important;
  margin-left: 0 !important;
}

body.cl-dashboard-redesign-page #el-fileupload .dd-list.fll > .fli[data-id="all"] > .fli-wrap > span.dd-flc {
  max-width: none !important;
}

body.cl-dashboard-redesign-page #el-fileupload .dd-list.fll > .fli > .fli-wrap:has(.fln-group) {
  overflow: visible !important;
}

body.cl-dashboard-redesign-page #el-fileupload .dd-list.fll > .fli > .fli-wrap > span.dd-fln:has(.fln-group) {
  flex: 1 1 auto !important;
  max-width: none !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page #el-fileupload .dd-list.fll > .fli > .fli-wrap:has(.fln-group) > span.fli-hover {
  display: none !important;
}

body.cl-dashboard-redesign-page #el-fileupload .dd-list.fll > .fli > .fli-wrap > span.dd-fln > .fln-group {
  position: absolute !important;
  top: 0 !important;
  right: 8px !important;
  bottom: auto !important;
  left: 50px !important;
  z-index: 3 !important;
  display: flex !important;
  width: auto !important;
  max-width: none !important;
  height: 36px !important;
  background: #fff !important;
  border-radius: 6px !important;
  pointer-events: auto !important;
}

body.cl-dashboard-redesign-page #el-fileupload .dd-list.fll > .fli > .fli-wrap > span.dd-fln > .fln-group > input.form-control {
  flex: 1 1 auto !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 36px !important;
  margin: 0 !important;
  padding: 0 28px 0 8px !important;
  border: 1px solid var(--cl-border, #e5e7eb) !important;
  border-right: 0 !important;
  border-radius: 6px 0 0 6px !important;
  background: #fff !important;
  box-shadow: none !important;
  color: var(--cl-text, #222428) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 34px !important;
}

body.cl-dashboard-redesign-page #el-fileupload .dd-list.fll > .fli > .fli-wrap > span.dd-fln > .fln-group > .input-group-btn {
  display: flex !important;
  flex: 0 0 36px !important;
  width: 36px !important;
  min-width: 36px !important;
}

body.cl-dashboard-redesign-page #el-fileupload .dd-list.fll > .fli > .fli-wrap > span.dd-fln > .fln-group > .input-group-btn > button.btn.btn-fln-save {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 36px !important;
  width: 36px !important;
  min-width: 36px !important;
  height: 36px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid var(--cl-green, #03C75A) !important;
  border-radius: 0 6px 6px 0 !important;
  background: var(--cl-green, #03C75A) !important;
  box-shadow: none !important;
  color: #fff !important;
  line-height: 1 !important;
}

body.cl-dashboard-redesign-page #el-fileupload .dd-list.fll > .fli > .fli-wrap > span.dd-fln > .fln-group > .input-group-btn > button.btn.btn-fln-save:hover,
body.cl-dashboard-redesign-page #el-fileupload .dd-list.fll > .fli > .fli-wrap > span.dd-fln > .fln-group > .input-group-btn > button.btn.btn-fln-save:focus {
  border-color: var(--cl-green-hover, #02b351) !important;
  background: var(--cl-green-hover, #02b351) !important;
  color: #fff !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page #el-fileupload .dd-list.fll > .fli > .fli-wrap > span.dd-fln > .fln-group > .btn-fln-cancel {
  position: absolute !important;
  top: 50% !important;
  right: 43px !important;
  z-index: 4 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 20px !important;
  height: 20px !important;
  color: #c5cad1 !important;
  transform: translateY(-50%) !important;
}

body.cl-dashboard-redesign-page #el-fileupload .dd-list.fll > .fli > .fli-wrap > span.dd-fln > .fln-group > .btn-fln-cancel:hover {
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page #el-fileupload .dd-list.fll > .fli > .fli-wrap > span.dd-fln > .fln-group i {
  color: currentColor !important;
  font-size: 12px !important;
  line-height: 1 !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page #el-fileupload #freestorage .resource-body_left .resource-folderlist {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

body.cl-dashboard-redesign-page #el-fileupload #freestorage .resource-body_left .resource-folderlist > li {
  display: flex !important;
  align-items: center !important;
  height: 38px !important;
  margin: 0 !important;
  padding: 0 10px !important;
  border-radius: 7px !important;
  color: var(--cl-text-sub, #8a8f98) !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  line-height: 18px !important;
}

body.cl-dashboard-redesign-page #el-fileupload #freestorage .resource-body_left .resource-folderlist > li:hover,
body.cl-dashboard-redesign-page #el-fileupload #freestorage .resource-body_left .resource-folderlist > li.active {
  background: var(--cl-green-soft, #eaf9f1) !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page #el-fileupload #freestorage .resource-body_left .resource-folderlist > li.active {
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-row.top {
  display: flex !important;
  align-items: center !important;
  flex: 0 0 60px !important;
  min-height: 60px !important;
  max-height: 60px !important;
  gap: 12px !important;
  padding: 12px 18px !important;
  border-bottom: 1px solid var(--cl-line, #eef0f4) !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-row.line {
  display: none !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-ctrl-group {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin-left: auto !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-selectbox .bootstrap-select:not([class*="col-"]):not([class*="form-control"]):not(.input-group-btn) {
  width: auto !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-selectbox > .bootstrap-select > button,
body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-selectbox > .bootstrap-select > button:hover,
body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-selectbox > .bootstrap-select > button:focus {
  display: inline-flex !important;
  align-items: center !important;
  min-width: 112px !important;
  height: 36px !important;
  padding: 0 30px 0 12px !important;
  border: 1px solid var(--cl-border, #e5e7eb) !important;
  border-radius: 8px !important;
  background: #fff !important;
  box-shadow: none !important;
  color: var(--cl-text, #222428) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 34px !important;
  letter-spacing: 0 !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-selectbox > .bootstrap-select > button .filter-option {
  display: flex !important;
  align-items: center !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-selectbox > .bootstrap-select > button .caret {
  right: 11px !important;
  border-top-color: var(--cl-text-sub, #8a8f98) !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-selectbox .btn.dropdown-toggle ~ .dropdown-menu {
  min-width: 140px !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 5px 0 0 !important;
  padding: 5px !important;
  overflow: visible !important;
  border: 1px solid var(--cl-border, #e5e7eb) !important;
  border-radius: 8px !important;
  background: #fff !important;
  box-shadow: 0 10px 28px rgba(20, 24, 32, .14) !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-selectbox .dropdown-menu > li > a {
  padding: 8px 10px !important;
  border-radius: 6px !important;
  color: var(--cl-text, #222428) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 18px !important;
  letter-spacing: 0 !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-selectbox .dropdown-menu > li > a:hover,
body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-selectbox .dropdown-menu > li > a:focus,
body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-selectbox .dropdown-menu > li.active > a {
  background: var(--cl-green-soft, #eaf9f1) !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-row.content {
  position: relative !important;
  flex: 1 1 auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
  background: #fff !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox ul.files {
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox ul.files[data-layout="grid"] {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(112px, 1fr)) !important;
  align-content: flex-start !important;
  align-items: start !important;
  column-gap: 18px !important;
  row-gap: 19px !important;
  padding: 30px 18px 18px 30px !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox ul.files[data-layout="grid"] > li.fitem {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  color: var(--cl-text, #222428) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox ul.files[data-layout="grid"] .fitem-wrap {
  display: block !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox ul.files[data-layout="grid"] .fitem-thumb {
  position: relative !important;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 1 / 1 !important;
  overflow: hidden !important;
  border: 1px solid var(--cl-border, #e5e7eb) !important;
  border-radius: 0 !important;
  background: #f8fafb !important;
  transition: border-color .12s, box-shadow .12s, background-color .12s !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox ul.files[data-layout="grid"] .fitem-mold {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox ul.files[data-layout="grid"] .fitem-mold > img {
  width: 100% !important;
  height: 100% !important;
  border-radius: 0 !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox ul.files[data-layout="grid"] .fitem-img {
  max-width: 100% !important;
  max-height: 100% !important;
  border-radius: 0 !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox ul.files[data-layout="grid"] .fitem-visual:hover .fitem-thumb,
body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox ul.files[data-layout="grid"] .fitem.ui-selecting .fitem-thumb,
body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox ul.files[data-layout="grid"] .fitem.ui-selected .fitem-thumb {
  border-color: var(--cl-green, #03C75A) !important;
  box-shadow: 0 0 0 2px var(--cl-green-soft, #eaf9f1) !important;
  background: var(--cl-green-tint, #f3fcf7) !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox ul.files[data-layout="grid"] .fitem-visual:hover .fitem-mold {
  background: transparent !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox ul.files[data-layout="grid"] .fitem-ctrl {
  left: 1px !important;
  right: 1px !important;
  bottom: 1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  border-radius: 0 !important;
  background: rgba(20, 24, 32, .78) !important;
  background-clip: border-box !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox ul.files[data-layout="grid"] .fitem-ctrl > ul > li {
  height: 36px !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox ul.files[data-layout="grid"] .fitem-ctrl > ul > li [class*=fitem-ctrl-] svg {
  fill: #fff !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox ul.files[data-layout="grid"] .fitem-content {
  padding: 8px 2px 11px !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox ul.files[data-layout="grid"] .fitem-content p {
  margin: 0 !important;
  line-height: 18px !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox ul.files[data-layout="grid"] .fitem-content .fitem-name {
  color: var(--cl-text, #222428) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox ul.files[data-layout="grid"] .fitem-content .fitem-date2,
body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox ul.files[data-layout="grid"] .fitem-content .fitem-size,
body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox ul.files[data-layout="grid"] .fitem-content .fitem-username {
  color: var(--cl-text-sub, #8a8f98) !important;
  font-size: 12px !important;
  font-weight: 400 !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox ul.files[data-layout="grid"] .fitem-content .fitem-username > a {
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox ul.files[data-layout="list"] {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  padding: 12px 18px !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox ul.files[data-layout="list"] > li.fitem {
  flex: 0 0 auto !important;
  min-height: 58px !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 0 !important;
  color: var(--cl-text, #222428) !important;
  font-size: 13px !important;
  letter-spacing: 0 !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox ul.files[data-layout="list"] .fitem-visual {
  min-height: 58px !important;
  padding: 3px !important;
  border: 1px solid transparent !important;
  border-radius: 0 !important;
  background: #fff !important;
  transition: border-color .12s, background-color .12s !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox ul.files[data-layout="list"] .fitem-visual:hover {
  background: #f8fafb !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox ul.files[data-layout="list"] .fitem.ui-selecting .fitem-visual,
body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox ul.files[data-layout="list"] .fitem.ui-selected .fitem-visual {
  border-color: var(--cl-green, #03C75A) !important;
  background: var(--cl-green-tint, #f3fcf7) !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox ul.files[data-layout="list"] .fitem-thumb {
  flex: 0 0 52px !important;
  width: 52px !important;
  height: 52px !important;
  border-radius: 0 !important;
  background: #f8fafb !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-row.bottom {
  display: flex !important;
  align-items: center !important;
  flex: 0 0 52px !important;
  min-height: 52px !important;
  max-height: 52px !important;
  padding: 8px 18px !important;
  border-top: 1px solid var(--cl-line, #eef0f4) !important;
  background: #fff !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-row.bottom .resource-paging:empty {
  display: none !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-row.bottom .resource-ctrl-group {
  flex: 1 1 auto !important;
  width: 100% !important;
  margin-left: 0 !important;
  padding: 0 !important;
  justify-content: space-between !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-paging {
  padding: 0 !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-paging .pagination {
  display: inline-flex !important;
  align-items: center !important;
  gap: 2px !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-paging .pagination a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 28px !important;
  height: 28px !important;
  padding: 0 8px !important;
  border: 0 !important;
  border-radius: 6px !important;
  color: var(--cl-text-sub, #8a8f98) !important;
  font-size: 12.5px !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-paging .pagination .active a,
body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-paging .pagination .active a:hover {
  background: var(--cl-green-soft, #eaf9f1) !important;
  color: var(--cl-green-text) !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-ctrl-selectedinfo > label {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  margin: 2px 32px 0 0 !important;
  color: #484b50 !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-ctrl-selectedinfo > label .count {
  color: #ee445f !important;
  font-weight: 400 !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-ctrl-selectedinfo > label .size {
  color: #484b50 !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-row.bottom .resource-ctrl-btns {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex: 0 0 auto !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-ctrl-deletes,
body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-ctrl-downloads {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  min-width: 72px !important;
  height: 36px !important;
  padding: 0 12px !important;
  border: 1px solid var(--cl-border, #e5e7eb) !important;
  border-radius: 7px !important;
  background: #fff !important;
  color: var(--cl-text-sub, #8a8f98) !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  line-height: 34px !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-ctrl-downloads {
  margin-right: 10px !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-ctrl-deletes:hover,
body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-ctrl-downloads:hover {
  border-color: var(--cl-green-line, #cdefdd) !important;
  background: var(--cl-green-soft, #eaf9f1) !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-ctrl-deletes svg,
body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-ctrl-downloads svg {
  width: 13px !important;
  height: 13px !important;
  fill: currentColor !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page #el-fileupload .resource-selected-ul {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  flex: 0 0 0 !important;
  box-sizing: border-box !important;
  min-height: 0 !important;
  max-height: 0 !important;
  margin: 0 20px 15px 12px !important;
  padding: 0 !important;
  overflow-y: auto !important;
  border: 0 !important;
  border-radius: 2px !important;
  background: #f5f5f5 !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page #el-fileupload .resource-selected-ul:not(:empty) {
  flex-basis: 56px !important;
  min-height: 56px !important;
  max-height: 56px !important;
  margin-bottom: 20px !important;
  padding: 0 !important;
  border: 0 !important;
  background: #f5f5f5 !important;
}

body.cl-dashboard-redesign-page #el-fileupload .resource-selected-ul > li {
  position: relative !important;
  flex: 0 1 56px !important;
  min-width: 56px !important;
  max-width: 56px !important;
  overflow: hidden !important;
  padding: 1px !important;
}

body.cl-dashboard-redesign-page #el-fileupload .resource-selected-ul > li img {
  width: 100% !important;
  height: auto !important;
  object-fit: initial !important;
}

body.cl-dashboard-redesign-page #el-fileupload .resource-selected-ul > li .selected-hover {
  line-height: 56px !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox ul.files .resource-empty {
  color: var(--cl-text-sub, #8a8f98) !important;
}

body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox ul.files .resource-empty p {
  color: var(--cl-text-sub, #8a8f98) !important;
  font-size: 14px !important;
  line-height: 22px !important;
  letter-spacing: 0 !important;
}

body.cl-dashboard-redesign-page #el-fileupload .resource-tooltip {
  z-index: 1000003 !important;
}

body.cl-dashboard-redesign-page #el-fileupload.flink-fileupload .modal-dialog.modal-resourcebox {
  width: min(780px, calc(100vw - 48px)) !important;
}

body.cl-dashboard-redesign-page #el-fileupload.flink-fileupload .nav-tabs {
  display: none !important;
}

body.cl-dashboard-redesign-page #el-fileupload.flink-fileupload .resource-body {
  flex-direction: column !important;
}

body.cl-dashboard-redesign-page #el-fileupload.flink-fileupload .modal-resourcebox .resource-row.bottom:not(.active) {
  display: none !important;
}

body.cl-dashboard-redesign-page #el-fileupload.flink-fileupload .modal-resourcebox ul.files[data-layout="flist"] {
  display: flex !important;
  flex-direction: column !important;
  flex-wrap: nowrap !important;
  gap: 6px !important;
  padding: 14px 18px !important;
}

body.cl-dashboard-redesign-page #el-fileupload.flink-fileupload .modal-resourcebox ul.files[data-layout="flist"] .fitem {
  width: 100% !important;
  margin: 0 !important;
  padding: 10px 12px !important;
  border: 1px solid transparent !important;
  border-radius: 8px !important;
  background: #fff !important;
}

body.cl-dashboard-redesign-page #el-fileupload.flink-fileupload .modal-resourcebox ul.files[data-layout="flist"] .fitem:hover,
body.cl-dashboard-redesign-page #el-fileupload.flink-fileupload .modal-resourcebox ul.files[data-layout="flist"] .fitem.selected {
  border-color: var(--cl-green, #03C75A) !important;
  background: var(--cl-green-tint, #f3fcf7) !important;
}

body.cl-dashboard-redesign-page #el-fileupload.flink-fileupload .resource-loadmore {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: 112px !important;
  height: 32px !important;
  margin: 0 auto !important;
  padding: 0 14px !important;
  border: 1px solid var(--cl-border, #e5e7eb) !important;
  border-radius: 8px !important;
  color: var(--cl-text-sub, #8a8f98) !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  line-height: 30px !important;
}

@media (max-width: 900px) {
  body.cl-dashboard-redesign-page .modal#el-fileupload {
    padding: 12px !important;
  }

  body.cl-dashboard-redesign-page #el-fileupload .modal-dialog.modal-resourcebox {
    width: calc(100vw - 24px) !important;
    height: calc(100vh - 24px) !important;
    min-height: 0 !important;
  }

  body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .nav-tabs {
    overflow-x: auto !important;
  }

  body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-heading {
    align-items: flex-start !important;
    flex-direction: column !important;
    gap: 10px !important;
  }

  body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-heading > .pull-right {
    width: 100% !important;
    justify-content: flex-start !important;
    flex-wrap: wrap !important;
    margin-left: 0 !important;
  }

  body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-body {
    flex-direction: column !important;
  }

  body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-body_left {
    flex: 0 0 168px !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    border-right: 0 !important;
    border-bottom: 1px solid var(--cl-line, #eef0f4) !important;
  }

  body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-row.top {
    align-items: flex-start !important;
    flex-direction: column !important;
    height: auto !important;
    max-height: none !important;
  }

  body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-search-group {
    width: 100% !important;
    flex-basis: auto !important;
  }

  body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-ctrl-group {
    width: 100% !important;
    justify-content: flex-start !important;
    margin-left: 0 !important;
  }

  body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox .resource-row.bottom .resource-ctrl-group {
    justify-content: space-between !important;
    padding: 0 !important;
  }

  body.cl-dashboard-redesign-page #el-fileupload .modal-resourcebox ul.files[data-layout="grid"] {
    grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)) !important;
    column-gap: 18px !important;
    row-gap: 19px !important;
    padding: 30px 14px 14px 30px !important;
  }
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal *,
body.cl-dashboard-redesign-page .cl-source-product-add-modal *::before,
body.cl-dashboard-redesign-page .cl-source-product-add-modal *::after {
  box-sizing: border-box;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal input,
body.cl-dashboard-redesign-page .cl-source-product-add-modal textarea,
body.cl-dashboard-redesign-page .cl-source-product-add-modal select,
body.cl-dashboard-redesign-page .cl-source-product-add-modal button {
  font-family: var(--cl-source-font);
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-hover-tooltip[data-tooltip]:not(.setting-date-etc):not(.setting-time-etc) {
  position: relative;
  overflow: visible;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-hover-tooltip[data-tooltip]:not(.setting-date-etc):not(.setting-time-etc)::before,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-hover-tooltip[data-tooltip]:not(.setting-date-etc):not(.setting-time-etc)::after {
  position: absolute !important;
  left: 50% !important;
  display: none !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-hover-tooltip[data-tooltip]:not(.setting-date-etc):not(.setting-time-etc)::before {
  content: attr(data-tooltip) !important;
  bottom: calc(100% + 8px) !important;
  z-index: 100 !important;
  box-sizing: border-box !important;
  padding: 5px 9px !important;
  border: 1px solid #dbdcdf !important;
  border-radius: 10px !important;
  background: #fff !important;
  box-shadow: 0 2px 6px rgba(34, 36, 40, .12) !important;
  color: #222428 !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 16px !important;
  white-space: nowrap !important;
  transform: translateX(-50%) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-hover-tooltip[data-tooltip]:not(.setting-date-etc):not(.setting-time-etc)::after {
  content: "" !important;
  bottom: calc(100% + 4px) !important;
  z-index: 101 !important;
  width: 8px !important;
  height: 8px !important;
  border-right: 1px solid #dbdcdf !important;
  border-bottom: 1px solid #dbdcdf !important;
  background: #fff !important;
  transform: translateX(-50%) rotate(45deg) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-hover-tooltip[data-tooltip]:not(.setting-date-etc):not(.setting-time-etc):hover::before,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-hover-tooltip[data-tooltip]:not(.setting-date-etc):not(.setting-time-etc):hover::after {
  display: block !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .cl-icon.cl_icon_info {
  position: relative !important;
  top: .5px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 13px;
  width: 13px !important;
  height: 13px !important;
  margin: 0 0 0 4px !important;
  padding: 0 !important;
  color: #03C75A;
  fill: currentColor;
  font-size: 0 !important;
  line-height: 1 !important;
  vertical-align: middle;
  transform: none !important;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .cl-icon.cl_icon_info > svg {
  display: block !important;
  flex: 0 0 13px;
  width: 13px !important;
  height: 13px !important;
  margin: 0 !important;
  margin-bottom: 3px !important;
  vertical-align: middle;
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .cl-icon.cl_icon_info > svg path,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .cl-icon.cl_icon_info > svg rect {
  fill: currentColor;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-header {
  position: fixed !important;
  top: 0 !important;
  right: 8px !important;
  left: 0 !important;
  z-index: 1000 !important;
  width: 100% !important;
  margin: 0 !important;
  background: #fff !important;
  border: 0 !important;
  border-bottom: 1px solid #cbd2d6 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-header > .prod-header-wrap {
  position: relative !important;
  display: var(--cl-product-header-display, block) !important;
  max-width: none !important;
  min-height: 0 !important;
  margin: auto !important;
  padding: var(--cl-product-header-padding, 0) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-header > .prod-header-wrap h1.prod-title {
  margin: 0 !important;
  padding: var(--cl-product-title-padding, 30px 0) !important;
  color: #222428 !important;
  font-size: var(--cl-product-title-size, 24px) !important;
  font-weight: var(--cl-product-title-weight, 600) !important;
  line-height: 1.2 !important;
  text-align: var(--cl-product-title-align, center) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-header > .prod-header-wrap ul.prod-button {
  position: var(--cl-product-actions-position, absolute) !important;
  top: 23px !important;
  right: 50px !important;
  display: var(--cl-product-actions-display, inline-block) !important;
  width: auto !important;
  margin: 0 !important;
  padding: var(--cl-product-actions-padding, 0) !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-header > .prod-header-wrap ul.prod-button > li {
  display: var(--cl-product-action-display, inline-block) !important;
  width: auto !important;
  min-width: var(--cl-product-touch-size, 0) !important;
  height: var(--cl-product-action-height, auto) !important;
  margin: var(--cl-product-action-margin, 0 13px 0 0) !important;
  padding: var(--cl-product-action-padding, 8px 55px) !important;
  border: 0 !important;
  border-radius: var(--cl-product-action-radius, 5px) !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #fff !important;
  cursor: pointer;
  font-size: var(--cl-product-action-size, 15px) !important;
  font-weight: 600 !important;
  line-height: 20px !important;
  text-align: center;
  transition: background-color .15s, color .15s !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-header > .prod-header-wrap ul.prod-button > li.modal-close {
  position: static !important;
  color: #696c71 !important;
  font-size: var(--cl-product-action-size, 15px) !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-header > .prod-header-wrap ul.prod-button > li.modal-close::before,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-header > .prod-header-wrap ul.prod-button > li.modal-close::after {
  content: none !important;
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-header > .prod-header-wrap ul.prod-button > li.modal-close:hover {
  background: #efeff3 !important;
  color: #696c71 !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-header > .prod-header-wrap ul.prod-button > li.modal-save {
  margin-right: 0 !important;
  padding: var(--cl-product-action-padding, 8px 20px) !important;
  background: #03C75A !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-header > .prod-header-wrap ul.prod-button > li.modal-save:hover {
  background: #02b351 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .product-wrap {
  width: 1140px !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: var(--cl-product-page-padding, 120px 0 100px) !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  text-align: var(--cl-product-page-align, center) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-caption {
  margin: 0 0 25px !important;
  padding: 0 !important;
  color: #8e9095 !important;
  font-size: var(--cl-product-caption-size, 14px) !important;
  font-weight: 400 !important;
  line-height: 1.4 !important;
  text-align: var(--cl-product-caption-align, right) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal form[name="prod_form"] {
  display: block !important;
  align-items: normal !important;
  gap: 0 !important;
  width: 100%;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal form[name="prod_form"]::after {
  content: "";
  display: block;
  clear: both;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-image-wrap {
  float: left !important;
  display: block !important;
  flex: none !important;
  width: 33.33333333% !important;
  max-width: 33.33333333% !important;
  padding: 0 40px 0 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-image-wrap > .prod-item-image {
  position: relative;
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 100% !important;
  height: auto !important;
  margin: 0 0 16px !important;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  background: #e4e7ec !important;
  border: 0 !important;
  border-radius: 10px !important;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-image-wrap > .prod-item-image > .prod-item-image-icon {
  display: block !important;
  width: 36px !important;
  height: 36px !important;
  max-width: 36px !important;
  max-height: 36px !important;
  fill: #b1b3b7 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-image-wrap > .prod-item-image > .preview-img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-image-wrap > .prod-item-thumb {
  display: inline-block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-image-wrap > .prod-item-thumb > li {
  position: relative;
  float: left !important;
  display: block !important;
  width: calc(33.3333% - 10.66666667px) !important;
  height: auto !important;
  margin: 0 0 16px !important;
  overflow: visible;
  border-radius: 10px !important;
  text-align: center;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-image-wrap > .prod-item-thumb > li > .img-delete {
  position: absolute;
  top: -9px;
  right: -7px;
  bottom: auto;
  left: auto;
  display: none !important;
  width: 16px;
  height: 17px;
  margin: 0;
  padding: 0;
  border-radius: 50%;
  background: #fff;
  color: #3c4450;
  font-size: 20px;
  line-height: 20px;
  cursor: pointer;
  z-index: 1;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-image-wrap > .prod-item-thumb > li:hover > .img-delete,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-image-wrap > .prod-item-thumb > li:focus-within > .img-delete {
  display: block !important;
}

@media (hover: none) {
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-image-wrap > .prod-item-thumb > li > .img-delete {
    display: block !important;
  }
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-image-wrap > .prod-item-thumb > li > .img-delete > i {
  position: absolute;
  top: -1px;
  left: -1px;
  font-size: inherit;
  line-height: inherit;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-image-wrap > .prod-item-thumb > li + li {
  margin-left: 16px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-image-wrap > .prod-item-thumb > li:nth-child(3n + 1) {
  margin-left: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-image-wrap > .prod-item-thumb > li.prod-item-image-add {
  background: #fff !important;
  border: 0 !important;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-image-wrap > .prod-item-thumb > li.prod-item-image-add:hover {
  box-shadow: inset 0 0 0 1px #cdefdd !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-image-wrap > .prod-item-thumb > li.prod-item-image-add > svg {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  width: 23px !important;
  height: 23px !important;
  max-width: 23px !important;
  max-height: 23px !important;
  transform: translate(-50%, -50%) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-image-wrap > .prod-item-thumb > li.prod-item-image-add > svg polygon {
  fill: var(--cl-green);
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-image-wrap > .prod-item-thumb > li.prod-item-image-add.prod-hover-tooltip::before {
  bottom: calc(100% + 9px) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-image-wrap > .prod-item-thumb > li.prod-item-image-add.prod-hover-tooltip::after {
  bottom: calc(100% + 5px) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-image-wrap > .prod-item-thumb > li > img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  border-radius: 10px;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap {
  float: left !important;
  display: flex !important;
  flex: none !important;
  flex-direction: column;
  width: 66.66666667% !important;
  max-width: 66.66666667% !important;
  min-width: 0;
  padding: 0 !important;
  vertical-align: top;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > div {
  position: relative;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap {
  position: relative;
  margin-bottom: 8px;
  padding: 14px 10px 8px 20px;
  background: #fff;
  border: 0;
  border-radius: 3px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .prod-setting-section {
  order: 0;
  position: relative;
  margin: 0 0 20px !important;
  background: #fff !important;
  border-radius: 10px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .prod-setting-section:last-child {
  margin-bottom: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .prod-setting-section > .prod-setting-section-header {
  position: relative;
  height: 56px;
  background: #fff;
  border-bottom: 1px solid #eeeff0;
  border-radius: 10px 10px 0 0;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .prod-setting-section > .prod-setting-section-body {
  overflow: visible;
  padding: var(--cl-product-section-padding, 0 24px) !important;
  box-sizing: border-box;
  background: #fff !important;
  border-radius: 0 0 10px 10px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .prod-setting-section > .prod-setting-section-body::before,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .prod-setting-section > .prod-setting-section-body::after {
  content: "";
  display: block;
  height: 20px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section {
  order: -100;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-header {
  display: flex;
  align-items: center;
  height: 56px;
  padding: 0 65px 0 25px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-header::before {
  content: "기본 정보";
  display: flex;
  align-items: center;
  flex: 0 0 var(--cl-product-label-width, 132px);
  height: 56px;
  margin-right: 20px;
  color: #222428;
  font-size: 18px;
  font-weight: 700;
  text-align: left;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-header > #state-product-box:not(.prod-info) {
  flex: 1 1 auto;
  height: auto !important;
  min-height: 0;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible;
  background: transparent !important;
  border-radius: 0;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-header > #state-product-box:not(.prod-info)::before,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-header > #state-product-box:not(.prod-info)::after {
  content: none !important;
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-header > #state-product-box:not(.prod-info) > .product-padding-box {
  display: flex !important;
  align-items: center;
  height: auto !important;
  min-height: 56px;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-header > #state-product-box:not(.prod-info) > .product-padding-box > .form-group {
  display: flex !important;
  align-items: center;
  min-height: 56px;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-header > #state-product-box:not(.prod-info) .form-label.product-state,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-header > #state-product-box:not(.prod-info) .cl-prod-info.product-info {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-header > #state-product-box:not(.prod-info) .product-state-box {
  position: static !important;
  display: flex !important;
  align-items: center;
  width: auto !important;
  height: auto !important;
  min-height: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-header > #state-product-box:not(.prod-info) .product-state-box > div {
  display: flex !important;
  align-items: center;
  float: none !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-header > #state-product-box:not(.prod-info) .product-state-box > div + div::before {
  content: "|";
  margin: 0 var(--cl-product-type-divider-gap, 12px);
  color: #dbdcdf;
  font-size: 13px;
  font-weight: 300;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-header > #state-product-box:not(.prod-info) .product-state-box input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-header > #state-product-box:not(.prod-info) .product-state-box label {
  display: flex !important;
  align-items: center;
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #b1b3b7 !important;
  cursor: pointer !important;
  font-size: 0 !important;
  font-weight: 600 !important;
  line-height: 18px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-header > #state-product-box:not(.prod-info) .product-state-box label:hover {
  color: #cdefdd !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-header > #state-product-box:not(.prod-info) .product-state-box label.active,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-header > #state-product-box:not(.prod-info) .product-state-box input:checked + label {
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-header > #state-product-box:not(.prod-info) .product-state-box label.active::before,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-header > #state-product-box:not(.prod-info) .product-state-box input:checked + label::before {
  content: "";
  display: block;
  width: 13px;
  height: 10px;
  margin-right: var(--cl-product-type-check-gap, 8px);
  color: inherit;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13 10'%3E%3Cpath d='M11.59.29 5 6.88 1.41 3.29 0 4.7l5 5 8-7.99L11.59.3Z'/%3E%3C/svg%3E") center / 13px 10px no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13 10'%3E%3Cpath d='M11.59.29 5 6.88 1.41 3.29 0 4.7l5 5 8-7.99L11.59.3Z'/%3E%3C/svg%3E") center / 13px 10px no-repeat;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-header > #state-product-box:not(.prod-info) #normal-product + label::after {
  content: "일반상품";
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-header > #state-product-box:not(.prod-info) #download-product + label::after {
  content: "다운로드상품";
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-header > #state-product-box:not(.prod-info) #etc-product + label::after {
  content: "무형상품";
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-header > #state-product-box:not(.prod-info) #normal-product + label::after,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-header > #state-product-box:not(.prod-info) #download-product + label::after,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-header > #state-product-box:not(.prod-info) #etc-product + label::after {
  color: inherit;
  font-size: var(--cl-product-type-size, 15px);
  font-weight: 600;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-header::before,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .review-inquiry-section > .review-inquiry-section-header::before,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-header::before,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-header::before,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-header::before {
  display: flex;
  align-items: center;
  height: 56px;
  padding: 0 25px;
  color: #222428;
  font-size: 18px;
  font-weight: 700;
  text-align: left;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-header::before {
  content: "배송정보";
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-header::before {
  content: "판매 조건 및 옵션";
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-header::before {
  content: "법정고지 및 혜택";
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .review-inquiry-section > .review-inquiry-section-header::before {
  content: "후기 및 문의";
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-header::before {
  content: "기타";
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .prod-setting-section > .prod-setting-section-header .prod-settings-group-toggle {
  position: absolute !important;
  top: var(--cl-product-toggle-top, 14px) !important;
  right: var(--cl-product-toggle-right, 16px) !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: var(--cl-product-touch-size, 28px) !important;
  min-width: var(--cl-product-touch-size, 28px) !important;
  height: var(--cl-product-touch-size, 28px) !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 5px;
  background: transparent !important;
  color: #222428 !important;
  font-size: 0 !important;
  line-height: 1 !important;
  cursor: pointer;
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .prod-setting-section > .prod-setting-section-header .prod-settings-group-toggle:hover {
  background: #fafafa !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .prod-setting-section > .prod-setting-section-header .prod-settings-group-toggle::before {
  content: none !important;
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .prod-setting-section > .prod-setting-section-header .prod-settings-group-toggle svg {
  display: block !important;
  width: 10px !important;
  height: 6px !important;
  max-width: 10px !important;
  max-height: 6px !important;
  fill: currentColor !important;
  pointer-events: none;
  transition: transform .15s;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .prod-setting-section.basic-info-collapsed > .prod-setting-section-header .prod-settings-group-toggle svg,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .prod-setting-section.sales-option-collapsed > .prod-setting-section-header .prod-settings-group-toggle svg,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .prod-setting-section.shipping-info-collapsed > .prod-setting-section-header .prod-settings-group-toggle svg,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .prod-setting-section.legal-notice-collapsed > .prod-setting-section-header .prod-settings-group-toggle svg,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .prod-setting-section.review-inquiry-collapsed > .prod-setting-section-header .prod-settings-group-toggle svg,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .prod-setting-section.etc-collapsed > .prod-setting-section-header .prod-settings-group-toggle svg {
  transform: rotate(180deg);
}

.cl-dashboard-redesign-page .cl-source-product-add-modal .basic-info-section-body > #state-append {
  padding: 10px 0;
  background: transparent;
}
.cl-dashboard-redesign-page .cl-source-product-add-modal #normal-product-state .product-pay-setting {
  display: flex;
  align-items: center;
  gap: 20px;
  width: 100%;
}
.cl-dashboard-redesign-page .cl-source-product-add-modal #normal-product-state .product-pay-setting > .title {
  box-sizing: border-box;
  flex: 0 0 var(--cl-product-label-width, 132px);
  width: var(--cl-product-label-width, 132px);
  min-height: 0;
  margin: 0;
  padding: 0 0 0 20px;
  color: #696c71;
  font-size: 14px;
  font-weight: 600;
  line-height: 18px;
}
.cl-dashboard-redesign-page .cl-source-product-add-modal #edit-option-select-tax {
  position: relative;
  float: none !important;
  flex: none;
  width: 112px;
  height: auto;
  margin: 0;
  padding: 0;
  border: 0;
  overflow: visible;
}
.cl-dashboard-redesign-page .cl-source-product-add-modal #tax {
  position: relative;
  width: 100% !important;
  height: 40px;
  padding-right: 30px;
  font-size: 15px;
  text-align: left;
}
.cl-dashboard-redesign-page .cl-source-product-add-modal #tax::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 13px;
  width: 6px;
  height: 6px;
  margin: -2px 0 0;
  padding: 0;
  border: solid var(--cl-text-muted);
  border-width: 0 1.5px 1.5px 0;
  transform: translateY(-50%) rotate(45deg);
}
.cl-dashboard-redesign-page .cl-source-product-add-modal #tax.open::after {
  margin-top: 2px;
  transform: translateY(-50%) rotate(225deg);
}
.cl-dashboard-redesign-page .cl-source-product-add-modal #edit-option-select-tax > .cl-redesign-select-menu {
  width: 100%;
  right: auto;
  z-index: 1000001;
  list-style: none;
}
.cl-dashboard-redesign-page .cl-source-product-add-modal #edit-option-select-tax li.active::after {
  content: none;
}
@media (max-width: 900px) {
  .cl-dashboard-redesign-page .cl-source-product-add-modal #normal-product-state .product-pay-setting {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
  }
  .cl-dashboard-redesign-page .cl-source-product-add-modal #normal-product-state .product-pay-setting > .title {
    flex-basis: auto;
    width: 100%;
    padding-left: 0;
  }
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section.basic-info-collapsed > .basic-info-section-header,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section.sales-option-collapsed > .sales-option-section-header,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section.shipping-info-collapsed > .shipping-info-section-header,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section.legal-notice-collapsed > .legal-notice-section-header,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .review-inquiry-section.review-inquiry-collapsed > .review-inquiry-section-header,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section.etc-collapsed > .etc-section-header {
  border-bottom: 0;
  border-radius: 10px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .form-label {
  color: #222428;
  font-size: 14px;
  font-weight: 600;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap:has(#prod-title),
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap:has(#prod-desc),
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.category-wrap,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > .form-wrap.product-seo-row,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > .form-wrap,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > .form-wrap,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .review-inquiry-section > .review-inquiry-section-body > .form-wrap,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > .form-wrap,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > #require-navershop,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > #mng-prd-info {
  height: auto !important;
  margin: 0;
  padding: 0;
  overflow: visible;
  background: #fff !important;
  border: 0 !important;
  border-radius: 0;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap:has(#prod-desc),
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.category-wrap,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > .form-wrap.product-seo-row,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > #pccc-yn,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > .form-wrap.culture-benefit,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .review-inquiry-section > .review-inquiry-section-body > .form-wrap.use-qna,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > .form-wrap.brand,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > #mng-prd-info {
  margin-top: 20px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap:has(#prod-title) > .form-group,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap:has(#prod-desc) > .form-group,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 > .form-group,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .unit-pricing-box,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.category-wrap,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > .form-wrap.product-seo-row > .form-group,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > .form-wrap.delivery-template > .form-group,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > #pccc-yn,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > .form-wrap.culture-benefit,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .review-inquiry-section > .review-inquiry-section-body > .form-wrap:has(.review-checkbox-check),
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .review-inquiry-section > .review-inquiry-section-body > .form-wrap.use-qna,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > .form-wrap.npay-button .npay-button-box,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > #require-navershop,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > .form-wrap.brand .form-group.prod-brand-modify,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > #mng-prd-info .mng-prd-box {
  display: flex;
  align-items: center;
  min-height: 40px;
  margin-bottom: 0;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap:has(#prod-desc) > .form-group,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.category-wrap {
  align-items: flex-start;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap:has(#prod-title) .form-label,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap:has(#prod-desc) .form-label,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .form-label,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .form-label.unit-pricing,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.category-wrap .form-label.category,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > .form-wrap.product-seo-row .form-label.product-seo-label,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > .form-wrap.delivery-template .form-label,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > #pccc-yn .form-label.pccc-label,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > .form-wrap.culture-benefit .form-label.culture-benefit,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .review-inquiry-section > .review-inquiry-section-body > .form-wrap:has(.review-checkbox-check) .form-label.review-check,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .review-inquiry-section > .review-inquiry-section-body > .form-wrap.use-qna .form-label.qna-check,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > .form-wrap.npay-button .npay-button-label,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > #require-navershop .form-label.require-navershop-label,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > .form-wrap.brand .form-label.brand,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > #mng-prd-info .form-label.prd-code-label,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > #mng-prd-info .mng-prd-info-title {
  position: static !important;
  display: flex;
  align-items: center;
  flex: 0 0 var(--cl-product-label-width, 132px);
  width: var(--cl-product-label-width, 132px) !important;
  min-width: var(--cl-product-label-width, 132px);
  margin: var(--cl-product-label-margin, 0 20px 0 0) !important;
  padding: 0 !important;
  float: none !important;
  color: #222428;
  font-size: 14px;
  font-weight: 600;
  line-height: 18px;
  text-align: left;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap:has(#prod-desc) .form-label {
  padding-top: 10px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > .form-wrap.product-seo-row .product-seo-label {
  min-height: 40px;
  line-height: 18px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > .form-wrap.product-seo-row .product-seo-label-text {
  display: inline-block;
  line-height: 18px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > .form-wrap.product-seo-row .product-seo-label .cl-icon.cl_icon_info {
  position: static !important;
  top: auto !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 13px;
  width: 13px;
  height: 13px;
  margin-left: 5px !important;
  line-height: 1;
  vertical-align: middle;
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > .form-wrap.product-seo-row .product-seo-label .cl-icon.cl_icon_info svg {
  display: block;
  flex: 0 0 13px;
  width: 13px;
  height: 13px;
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > .form-wrap.product-seo-row .product-seo-summary {
  display: flex;
  align-items: center;
  flex: 1 1 auto;
  width: auto;
  min-width: 0;
  height: 40px;
  margin: 0;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > .form-wrap.product-seo-row .product-seo-summary-text {
  display: block;
  flex: 0 1 auto;
  width: auto;
  max-width: 264px;
  min-width: 0;
  height: 18px;
  margin: 0;
  overflow: hidden;
  font-family: var(--cl-source-font);
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 18px;
  letter-spacing: normal;
  text-align: left;
  color: var(--color-content-placeholder, #b1b3b7);
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > .form-wrap.product-seo-row.is-configured .product-seo-summary-text {
  color: var(--color-content-primary, #222428);
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > .form-wrap.product-seo-row .product-seo-setting {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  flex: 0 0 28px !important;
  width: 28px !important;
  min-width: 28px !important;
  max-width: 28px !important;
  height: 28px !important;
  min-height: 28px !important;
  margin: 0 0 0 8px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #03C75A !important;
  fill: currentColor !important;
  font-size: 0 !important;
  line-height: 1 !important;
  box-shadow: none !important;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > .form-wrap.product-seo-row .product-seo-setting:hover,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > .form-wrap.product-seo-row .product-seo-setting:focus {
  color: #02b351 !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > .form-wrap.product-seo-row .product-seo-setting svg {
  display: block !important;
  flex: 0 0 16px !important;
  width: 16px !important;
  height: 16px !important;
  margin: 0 !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > .form-wrap.product-seo-row .product-seo-reset-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
  width: auto !important;
  max-width: 100% !important;
  height: 28px !important;
  margin: 0 0 0 auto !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--cl-green-text) !important;
  fill: var(--cl-green) !important;
  cursor: pointer;
  box-shadow: none !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > .form-wrap.product-seo-row .product-seo-reset-button:hover,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > .form-wrap.product-seo-row .product-seo-reset-button:focus {
  color: var(--cl-green-text) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > .form-wrap.product-seo-row .product-seo-reset-button:disabled {
  cursor: default;
  opacity: .45;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > .form-wrap.product-seo-row .product-seo-reset-button .gallery-seo-reset-icon {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  flex: 0 0 20px;
  width: 20px;
  min-width: 20px;
  max-width: 20px;
  height: 20px;
  min-height: 20px;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  color: currentColor;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > .form-wrap.product-seo-row .product-seo-reset-button .gallery-seo-reset-icon svg {
  display: block;
  width: 20px;
  height: 20px;
  fill: currentColor;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > .form-wrap.product-seo-row .product-seo-reset-button .gallery-seo-reset-label {
  display: flex;
  align-items: center;
  width: 64px;
  height: 16px;
  margin: 0 0 0 8px;
  font-family: var(--cl-source-font);
  font-size: 14px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 16px;
  letter-spacing: normal;
  text-align: left;
  color: currentColor;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .review-inquiry-section > .review-inquiry-section-body > .form-wrap:has(.review-checkbox-check),
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .review-inquiry-section > .review-inquiry-section-body > .form-wrap.use-qna {
  justify-content: flex-start !important;
  width: 100% !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .review-inquiry-section > .review-inquiry-section-body > .form-wrap:has(.review-checkbox-check) > .form-group,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .review-inquiry-section > .review-inquiry-section-body > .form-wrap.use-qna > .form-group {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  flex: var(--cl-product-toggle-group-flex, 0 0 152px) !important;
  width: var(--cl-product-toggle-group-width, 152px) !important;
  min-width: var(--cl-product-toggle-group-width, 152px) !important;
  min-height: 40px !important;
  margin: 0 !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .review-inquiry-section > .review-inquiry-section-body > .form-wrap:has(.review-checkbox-check) > .input-switch,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .review-inquiry-section > .review-inquiry-section-body > .form-wrap.use-qna > .input-switch {
  flex: 0 0 36px !important;
  width: 36px !important;
  margin: var(--cl-product-toggle-margin, 0) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .review-inquiry-section > .review-inquiry-section-body > .form-wrap:has(.review-checkbox-check) .photo-review-tab.hide,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .review-inquiry-section > .review-inquiry-section-body > .form-wrap:has(.review-checkbox-check) .photo-review-top-view.hide {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .review-inquiry-section > .review-inquiry-section-body > .form-wrap:has(.review-checkbox-check):has(.photo-review-tab:not(.hide)) {
  display: grid !important;
  grid-template-columns: var(--cl-product-toggle-columns, 152px 36px minmax(0, 1fr)) !important;
  grid-template-rows: 40px minmax(40px, auto) !important;
  align-items: center !important;
  column-gap: 0 !important;
  row-gap: 10px !important;
  min-height: 90px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .review-inquiry-section > .review-inquiry-section-body > .form-wrap:has(.review-checkbox-check):has(.photo-review-tab:not(.hide)) > .form-group {
  position: relative !important;
  display: grid !important;
  grid-column: 1 / -1;
  grid-row: 1 / -1;
  grid-template-columns: var(--cl-product-toggle-columns, 152px 36px minmax(0, 1fr)) !important;
  grid-template-rows: 40px minmax(40px, auto) !important;
  align-items: center !important;
  column-gap: 0 !important;
  row-gap: 10px !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 90px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .review-inquiry-section > .review-inquiry-section-body > .form-wrap:has(.review-checkbox-check):has(.photo-review-tab:not(.hide)) .form-label.review-check {
  grid-column: 1;
  grid-row: 1;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .review-inquiry-section > .review-inquiry-section-body > .form-wrap:has(.review-checkbox-check):has(.photo-review-tab:not(.hide)) > .input-switch {
  z-index: 1;
  grid-column: 2;
  grid-row: 1;
  align-self: center;
  justify-self: start;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .review-inquiry-section > .review-inquiry-section-body > .form-wrap:has(.review-checkbox-check) .photo-review-tab:not(.hide) {
  display: grid !important;
  grid-column: 1 / -1;
  grid-row: 2;
  grid-template-columns: var(--cl-product-toggle-columns, 152px 36px minmax(0, 1fr)) !important;
  align-items: center !important;
  column-gap: 0 !important;
  width: 100% !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: #fff !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .review-inquiry-section > .review-inquiry-section-body > .form-wrap:has(.review-checkbox-check) .photo-review-tab:not(.hide) > .page-options:not(.photo-review-top-view) {
  display: grid !important;
  grid-column: 1 / 3;
  grid-template-columns: var(--cl-product-toggle-columns, 152px 36px) !important;
  align-items: center !important;
  column-gap: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  width: var(--cl-product-toggle-row-width, 188px) !important;
  height: 40px !important;
  min-height: 40px !important;
  background: transparent !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .review-inquiry-section > .review-inquiry-section-body > .form-wrap:has(.review-checkbox-check) .photo-review-tab:not(.hide) > .page-options:not(.photo-review-top-view) > h3 {
  display: flex !important;
  grid-column: 1;
  align-items: center !important;
  justify-self: start !important;
  width: var(--cl-product-label-width, 132px) !important;
  min-width: var(--cl-product-label-width, 132px) !important;
  height: 20px !important;
  margin: var(--cl-product-label-margin, 0 20px 0 0) !important;
  padding: 0 0 0 16px !important;
  float: none !important;
  color: #222428 !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 20px !important;
  text-indent: 0 !important;
  text-align: left !important;
  white-space: nowrap !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .review-inquiry-section > .review-inquiry-section-body > .form-wrap:has(.review-checkbox-check) .photo-review-tab:not(.hide) > .page-options:not(.photo-review-top-view) > .input-switch {
  position: static !important;
  top: auto !important;
  grid-column: 2;
  align-self: center;
  justify-self: start;
  flex: 0 0 36px !important;
  width: 36px !important;
  height: 20px !important;
  margin: var(--cl-product-toggle-margin, 0) !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .review-inquiry-section > .review-inquiry-section-body > .form-wrap:has(.review-checkbox-check) .photo-review-tab:not(.hide) > .page-options.photo-review-top-view:not(.hide) {
  display: flex !important;
  grid-column: var(--cl-product-review-column, 3);
  align-items: center !important;
  width: auto !important;
  min-width: 0 !important;
  height: 20px !important;
  min-height: 20px !important;
  margin: var(--cl-product-review-margin, 0 0 0 28px) !important;
  padding: 0 !important;
  background: transparent !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .review-inquiry-section > .review-inquiry-section-body > .form-wrap:has(.review-checkbox-check) .photo-review-tab:not(.hide) > .page-options.photo-review-top-view .newcheckbox {
  display: inline-flex !important;
  align-items: center !important;
  flex: 0 0 16px !important;
  width: 16px !important;
  min-width: 16px !important;
  height: 16px !important;
  min-height: 16px !important;
  margin: 0 5px 0 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .review-inquiry-section > .review-inquiry-section-body > .form-wrap:has(.review-checkbox-check) .photo-review-tab:not(.hide) > .page-options.photo-review-top-view .newcheckbox label {
  position: relative !important;
  display: block !important;
  float: none !important;
  width: 16px !important;
  height: 16px !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 16px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .review-inquiry-section > .review-inquiry-section-body > .form-wrap:has(.review-checkbox-check) .photo-review-tab:not(.hide) > .page-options.photo-review-top-view .newcheckbox input[type="checkbox"],
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .review-inquiry-section > .review-inquiry-section-body > .form-wrap:has(.review-checkbox-check) .photo-review-tab:not(.hide) > .page-options.photo-review-top-view .newcheckbox svg {
  top: 0 !important;
  left: 0 !important;
  width: 16px !important;
  height: 16px !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .review-inquiry-section > .review-inquiry-section-body > .form-wrap:has(.review-checkbox-check) .photo-review-tab:not(.hide) > .page-options.photo-review-top-view .newcheckbox svg.active,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .review-inquiry-section > .review-inquiry-section-body > .form-wrap:has(.review-checkbox-check) .photo-review-tab:not(.hide) > .page-options.photo-review-top-view .newcheckbox svg.active path,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .review-inquiry-section > .review-inquiry-section-body > .form-wrap:has(.review-checkbox-check) .photo-review-tab:not(.hide) > .page-options.photo-review-top-view .newcheckbox svg.active rect {
  fill: #03C75A !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .review-inquiry-section > .review-inquiry-section-body > .form-wrap:has(.review-checkbox-check) .photo-review-tab:not(.hide) > .page-options.photo-review-top-view > label.hand {
  display: inline-flex !important;
  align-items: center !important;
  height: 20px !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #222428 !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 20px !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .form-label.unit-pricing {
  position: relative !important;
  align-items: center;
  min-height: 40px;
  padding: 2px 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .unit-pricing-box > .form-group {
  margin-bottom: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .form-label.unit-pricing .unit-pricing-label-text {
  display: inline-block;
  line-height: 18px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .form-label.unit-pricing .cl-icon.cl_icon_info {
  position: static !important;
  top: auto !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 13px;
  width: 13px;
  height: 13px;
  margin-left: 4px !important;
  line-height: 1;
  vertical-align: middle;
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .form-label.unit-pricing .cl-icon.cl_icon_info svg {
  display: block;
  width: 13px;
  height: 13px;
  margin: 0;
  transform: none !important;
}

/* Product add category dropdown: override legacy config.css in every product modal path. */
body.cl-dashboard-redesign-page .prod-modal.cl-p-modal .category-wrap:not(.height-auto) {
  position: relative !important;
  display: grid !important;
  grid-template-columns: var(--cl-product-category-columns, 152px 230px) !important;
  grid-template-rows: 40px 40px !important;
  align-items: center !important;
  column-gap: 0 !important;
  row-gap: 10px !important;
  min-height: 90px !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .prod-modal.cl-p-modal .category-wrap:not(.height-auto).disabled {
  grid-template-rows: 40px !important;
  row-gap: 0 !important;
  min-height: 40px !important;
}

body.cl-dashboard-redesign-page .prod-modal.cl-p-modal .category-wrap:not(.height-auto) > .form-group {
  grid-column: 1 !important;
  grid-row: 1 !important;
  align-self: center !important;
  width: 152px !important;
  min-width: 152px !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .prod-modal.cl-p-modal .category-wrap:not(.height-auto) .form-label.category {
  width: var(--cl-product-label-width, 132px) !important;
  min-width: var(--cl-product-label-width, 132px) !important;
  margin: var(--cl-product-label-margin, 0 20px 0 0) !important;
  line-height: 18px !important;
}

body.cl-dashboard-redesign-page .prod-modal.cl-p-modal .category-wrap:not(.height-auto) > .input-switch {
  grid-column: 2 !important;
  grid-row: 1 !important;
  align-self: center !important;
  justify-self: start !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .prod-modal.cl-p-modal .category-wrap:not(.height-auto) .category-text {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  grid-column: var(--cl-product-category-field-column, 2) !important;
  grid-row: 2 !important;
  align-self: start !important;
  justify-self: start !important;
  display: block !important;
  width: var(--cl-product-category-field-width, 230px) !important;
  height: 40px !important;
  margin: 0 !important;
  padding: 0 34px 0 10px !important;
  overflow: hidden !important;
  border: 1px solid #dbdcdf !important;
  border-radius: 5px !important;
  background: #fff !important;
  box-shadow: none !important;
  color: #8d919a !important;
  font-size: 15px !important;
  font-weight: 400 !important;
  line-height: 38px !important;
  text-align: left !important;
  text-decoration: none !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  cursor: pointer !important;
  z-index: 31 !important;
}

body.cl-dashboard-redesign-page .prod-modal.cl-p-modal .category-wrap:not(.height-auto) .category-text.hide {
  display: none !important;
}

body.cl-dashboard-redesign-page .prod-modal.cl-p-modal .category-wrap:not(.height-auto).open .category-text,
body.cl-dashboard-redesign-page .prod-modal.cl-p-modal .category-wrap:not(.height-auto) .category-text:focus,
body.cl-dashboard-redesign-page .prod-modal.cl-p-modal .category-wrap:not(.height-auto) .category-text:active {
  border-color: #03C75A !important;
}

body.cl-dashboard-redesign-page .prod-modal.cl-p-modal .category-wrap:not(.height-auto):not(.disabled) .category-text:hover {
  border-color: #cdefdd !important;
}

body.cl-dashboard-redesign-page .prod-modal.cl-p-modal .category-wrap:not(.height-auto) .category-text::after {
  content: none !important;
  display: none !important;
}

body.cl-dashboard-redesign-page .prod-modal.cl-p-modal .category-wrap:not(.height-auto) .category-text::before {
  content: "" !important;
  position: absolute !important;
  top: 50% !important;
  right: 11px !important;
  display: block !important;
  width: 0 !important;
  height: 0 !important;
  margin-top: -1px !important;
  border-top: 4px solid #696c71 !important;
  border-right: 4px solid transparent !important;
  border-bottom: 0 !important;
  border-left: 4px solid transparent !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .prod-modal.cl-p-modal .category-wrap:not(.height-auto).open .category-text::before {
  margin-top: -3px !important;
  border-top: 0 !important;
  border-bottom: 4px solid #03C75A !important;
}

body.cl-dashboard-redesign-page .prod-modal.cl-p-modal .category-wrap:not(.height-auto) .category-text .bs-caret,
body.cl-dashboard-redesign-page .prod-modal.cl-p-modal .category-wrap:not(.height-auto) .category-text .caret {
  display: none !important;
}

body.cl-dashboard-redesign-page .prod-modal.cl-p-modal .category-wrap:not(.height-auto) .category-text .category-selected-text {
  display: block !important;
  overflow: hidden !important;
  min-width: 0 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .prod-modal.cl-p-modal .category-wrap:not(.height-auto) .category-text .category-selected-text.category-selected {
  color: #222428 !important;
}

body.cl-dashboard-redesign-page .prod-modal.cl-p-modal .category-wrap:not(.height-auto) .category-lists {
  display: none;
  position: absolute !important;
  top: 94px !important;
  left: var(--cl-product-field-indent, 152px) !important;
  right: auto !important;
  width: var(--cl-product-category-field-width, 230px) !important;
  min-width: var(--cl-product-category-field-width, 230px) !important;
  max-width: none !important;
  padding: 8px 0 0 !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 6px !important;
  background: #fff !important;
  box-shadow: 0 8px 22px rgba(20, 24, 32, .12) !important;
  box-sizing: border-box !important;
  text-align: left !important;
  z-index: 30 !important;
}

body.cl-dashboard-redesign-page .prod-modal.cl-p-modal .category-wrap:not(.height-auto).open .category-lists {
  border-color: #e5e7eb !important;
}

body.cl-dashboard-redesign-page .prod-modal.cl-p-modal .category-lists ul {
  position: static !important;
  display: block !important;
  max-height: 220px !important;
  margin: 0 !important;
  padding: 4px 0 8px !important;
  overflow-y: auto !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .prod-modal.cl-p-modal .category-lists li {
  width: 100% !important;
  display: flex !important;
  align-items: center !important;
  height: 36px !important;
  min-height: 36px !important;
  margin: 0 !important;
  padding: 7px 12px !important;
  box-sizing: border-box !important;
  color: #222428 !important;
  font-size: 15px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  white-space: nowrap !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .prod-modal.cl-p-modal .category-lists li:hover,
body.cl-dashboard-redesign-page .prod-modal.cl-p-modal .category-lists li.active {
  background: #eaf9f1 !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .prod-modal.cl-p-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.category-wrap .category-lists li::before,
body.cl-dashboard-redesign-page .prod-modal.cl-p-modal .category-lists li::before {
  content: "" !important;
  position: static !important;
  top: auto !important;
  left: auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 16px !important;
  width: 16px !important;
  height: 16px !important;
  margin: 0 6px 0 0 !important;
  background-color: transparent !important;
  color: transparent !important;
  font-size: 0 !important;
  line-height: 0 !important;
}

body.cl-dashboard-redesign-page .prod-modal.cl-p-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.category-wrap .category-lists li.active::before,
body.cl-dashboard-redesign-page .prod-modal.cl-p-modal .category-lists li.active::before {
  content: "" !important;
  background-color: #03C75A !important;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13 10'%3E%3Cpath d='M11.59.29 5 6.88 1.41 3.29 0 4.7l5 5 8-7.99L11.59.3Z'/%3E%3C/svg%3E") center / 13px 10px no-repeat !important;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13 10'%3E%3Cpath d='M11.59.29 5 6.88 1.41 3.29 0 4.7l5 5 8-7.99L11.59.3Z'/%3E%3C/svg%3E") center / 13px 10px no-repeat !important;
}

body.cl-dashboard-redesign-page .prod-modal.cl-p-modal .category-lists .form-ctrl-button.category {
  position: static !important;
  top: auto !important;
  right: auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 44px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-top: 1px solid #eef0f4 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--cl-green-text) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  line-height: 18px !important;
  text-align: center !important;
  transform: none !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .prod-modal.cl-p-modal .category-lists .form-ctrl-button.category:hover {
  background: transparent !important;
  color: var(--cl-green-text) !important;
  text-decoration: none !important;
}

body.cl-dashboard-redesign-page .prod-modal.cl-p-modal .category-lists .form-ctrl-button.category svg {
  flex: 0 0 16px !important;
  width: 16px !important;
  height: 16px !important;
  margin: 0 5px 0 0 !important;
  display: block !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .prod-modal.cl-p-modal .category-lists .form-ctrl-button.category svg path {
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .cl-category-modal-backdrop {
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  display: none;
  overflow: auto !important;
  background-color: rgba(0, 0, 0, .45) !important;
  z-index: 1000005 !important;
}

body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  display: flex;
  flex-direction: column;
  width: min(480px, calc(100% - 32px)) !important;
  max-height: calc(100% - 32px) !important;
  margin: 0;
  padding: 0 !important;
  overflow: hidden;
  border: 1px solid var(--cl-border);
  border-radius: var(--r-xl, 14px);
  box-shadow: var(--shadow-modal, 0 20px 50px rgba(20,24,32,.25));
  background-color: var(--surface, #fff) !important;
  color: #222428 !important;
  transform: translate(-50%, -50%) !important;
}

body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal {
  font-family: var(--cl-font) !important;
}

body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal .form-group {
  height: 66px !important;
  margin-bottom: 8px !important;
  padding: 20px 10px 8px 0 !important;
}

body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal h1.category-modal-title {
  margin: 0 !important;
  flex: none;
  padding: 20px 64px 16px 20px !important;
  border-bottom: 0 !important;
  background-color: transparent !important;
  color: var(--cl-text) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: normal !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal .cl-category-modal-footer {
  display: flex;
  flex: none;
  flex-direction: column;
  gap: 8px;
  clear: left !important;
  overflow: visible !important;
  padding: 16px 20px 20px !important;
}

body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal .cl-category-modal-footer .cl-category-modal-close,
body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal .cl-category-modal-footer .cl-category-modal-ok {
  float: none !important;
  width: 100% !important;
  height: 46px !important;
  padding: 0 16px;
  border: 0;
  border-radius: var(--r-md, 8px);
  font-weight: 700;
  color: #fff !important;
  font-size: 15px !important;
  line-height: 46px !important;
  text-align: center !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal .cl-category-modal-footer .cl-category-modal-close {
  order: 2;
  background-color: transparent !important;
  color: var(--cl-text-sub) !important;
}

body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal .cl-category-modal-footer .cl-category-modal-ok {
  order: 1;
  background-color: var(--cl-green) !important;
}

body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal .category-title {
  display: flex;
  align-items: center;
  grid-column: 2 / 4 !important;
  grid-row: 1 !important;
  z-index: 1 !important;
  min-width: 0 !important;
  height: 66px !important;
  margin-right: 0 !important;
  overflow: hidden !important;
  padding-left: 0 !important;
  background: #fff !important;
  color: #222428 !important;
  font-size: 15px !important;
  font-weight: normal !important;
  line-height: 1.5 !important;
  cursor: pointer !important;
  word-break: break-all !important;
}

body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal .category-input {
  padding-right: 0 !important;
}

body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal .category-edit {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
  margin: 0 20px !important;
  padding: 0 !important;
  border: 1px solid var(--cl-border);
  border-radius: 8px !important;
  list-style: none !important;
}

body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal .category-edit li {
  position: relative;
  display: grid !important;
  grid-template-columns: 44px minmax(0, 1fr) 44px !important;
  min-height: 66px !important;
  margin: 0 !important;
  border-bottom: 0 !important;
  background-color: #fff !important;
}

body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal .category-edit li::after {
  content: "" !important;
  position: absolute !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  z-index: 3 !important;
  height: 1px !important;
  background-color: #e2e3e5 !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal .category-edit .form-wrap {
  grid-column: 2 / 3 !important;
  grid-row: 1 !important;
  min-width: 0 !important;
  height: 66px !important;
  margin-bottom: 0 !important;
  padding: 0 !important;
  background-color: #fff !important;
}

body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal .category-edit .form-wrap .form-group {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  top: auto !important;
  left: auto !important;
  width: auto !important;
  height: 66px !important;
  margin-bottom: 0 !important;
  padding: 0 8px 0 0 !important;
  background-color: #fff !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal .category-edit .form-wrap .form-group .control-label {
  display: none;
  position: absolute !important;
  top: 20px !important;
  left: 0 !important;
  z-index: 1 !important;
  padding-left: 0 !important;
  color: #b3b3b3 !important;
  font-size: 14px !important;
  font-weight: normal !important;
  line-height: initial !important;
  pointer-events: none !important;
  -webkit-transition: all 0.28s ease-in-out !important;
  -moz-transition: all 0.28s ease-in-out !important;
  -ms-transition: all 0.28s ease-in-out !important;
  -o-transition: all 0.28s ease-in-out !important;
  transition: all 0.28s ease-in-out !important;
}

body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal .category-edit .form-wrap .form-group .bar {
  position: relative !important;
  display: block !important;
  border-bottom: 2px solid transparent !important;
}

body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal .category-edit .form-wrap .form-group .bar::before {
  content: "" !important;
  position: absolute !important;
  bottom: -0.0625rem !important;
  left: 50% !important;
  z-index: 2 !important;
  width: 0 !important;
  height: 0.125rem !important;
  background: transparent !important;
  -webkit-transition: left 0.28s ease, width 0.28s ease !important;
  -moz-transition: left 0.28s ease, width 0.28s ease !important;
  -ms-transition: left 0.28s ease, width 0.28s ease !important;
  -o-transition: left 0.28s ease, width 0.28s ease !important;
  transition: left 0.28s ease, width 0.28s ease !important;
}

body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal .category-edit .form-wrap .form-group input.category-input {
  display: block !important;
  width: 100% !important;
  height: 40px !important;
  padding: 0 8px !important;
  border: 1px solid var(--cl-border) !important;
  border-width: 1px !important;
  border-color: var(--cl-border) !important;
  border-radius: 8px;
  background: var(--surface, #fff) !important;
  box-shadow: none !important;
  color: var(--cl-text) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.9 !important;
  -webkit-transition: all 0.28s ease !important;
  -moz-transition: all 0.28s ease !important;
  -ms-transition: all 0.28s ease !important;
  -o-transition: all 0.28s ease !important;
  transition: all 0.28s ease !important;
}

body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal .category-edit .form-wrap .form-group input.category-input:focus,
body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal .category-edit .form-wrap .form-group input.category-input:valid,
body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal .category-edit .form-wrap .form-group input.category-input.has-value {
  color: #000 !important;
}

body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal .category-edit .form-wrap .form-group input:focus ~ .control-label,
body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal .category-edit .form-wrap .form-group input:valid ~ .control-label,
body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal .category-edit .form-wrap .form-group input.form-file ~ .control-label,
body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal .category-edit .form-wrap .form-group input.has-value ~ .control-label {
  top: 8px !important;
  left: 0 !important;
  color: gray !important;
  font-size: 12px !important;
  -webkit-transition: all 0.28s ease-in-out !important;
  -moz-transition: all 0.28s ease-in-out !important;
  -ms-transition: all 0.28s ease-in-out !important;
  -o-transition: all 0.28s ease-in-out !important;
  transition: all 0.28s ease-in-out !important;
}

body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal .category-edit .form-wrap .form-group input:focus {
  outline: none !important;
  border-color: var(--cl-green) !important;
  box-shadow: var(--ring, 0 0 0 3px rgba(3,199,90,.13)) !important;
}

body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal .category-edit .form-wrap .form-group input:focus ~ .control-label {
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal .category-edit .form-wrap .form-group input:focus ~ .bar::before {
  left: 0 !important;
  width: 100% !important;
}

body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal .category-move {
  display: flex;
  align-items: center;
  justify-content: center;
  grid-column: 1 / 2 !important;
  grid-row: 1 !important;
  z-index: 2 !important;
  width: 44px !important;
  height: 66px !important;
  background-color: #fff !important;
  color: #b9b9b9 !important;
  font-size: 14px !important;
  line-height: 1 !important;
  text-align: center !important;
  cursor: default !important;
}

body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal .category-move .cl-sort-handle {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 100% !important;
}

body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal .category-move:not(.delete) .cl-sort-handle {
  visibility: hidden !important;
}

body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal .category-edit li:hover .category-move:not(.delete) .cl-sort-handle {
  visibility: visible !important;
}

body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal .category-move.delete {
  grid-column: 3 / 4 !important;
  width: 44px !important;
  color: var(--cl-danger, #E5484D) !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal .category-move.delete svg {
  fill: currentColor !important;
  vertical-align: middle !important;
}

body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal .category-edit .item-add {
  display: block !important;
  height: 44px !important;
  min-height: 44px !important;
  border-bottom: 0 !important;
  background-color: var(--surface, #fff) !important;
  background-image: none !important;
  color: var(--cl-green-text);
  text-align: center;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  line-height: 44px !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal .category-edit .item-add::after {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal .cl-category-modal-x {
  position: absolute;
  top: 8px;
  right: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--cl-text-sub);
}
body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal .cl-category-modal-x svg { width: 15px; height: 15px; transition: transform .18s; }
body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal .cl-category-modal-x:hover svg { transform: rotate(90deg); }
body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal .cl-category-modal-x:hover,
body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal .cl-category-modal-x:focus-visible { background: var(--bg-3, #F1F2F5); color: var(--cl-text); }
body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal .cl-category-modal-footer .cl-category-modal-ok:hover,
body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal .cl-category-modal-footer .cl-category-modal-ok:focus-visible { background-color: var(--cl-green-hover, #02B351) !important; }
body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal .cl-category-modal-footer .cl-category-modal-close:hover { color: var(--cl-text) !important; }
body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal .category-edit .item-add::before { content: "+"; font-size: 24px; }
body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal .category-edit .item-add:hover { background-color: var(--green-tint, #F6FDF9) !important; }
body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal :is(button, .item-add):focus-visible { outline: 2px solid var(--cl-green); outline-offset: -2px; }
@media (hover: none), (max-width: 767px) {
  body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal .category-move:not(.delete) .cl-sort-handle { visibility: visible !important; }
}
@media (prefers-reduced-motion: reduce) {
  body.cl-dashboard-redesign-page .cl-category-modal-backdrop .cl-category-modal.category-modal .cl-category-modal-x svg { transition: none; }
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap #prod-title,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap #prod-desc {
  flex: 1 1 auto;
  width: var(--cl-product-field-width, calc(100% - 152px)) !important;
  min-width: 0;
  border: 1px solid #dbdcdf !important;
  border-radius: 5px !important;
  background: #fff !important;
  color: #222428 !important;
  font-size: 15px !important;
  box-shadow: none !important;
  outline: 0;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap #prod-title {
  height: 40px !important;
  padding: 0 8px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap #prod-desc {
  height: 108px !important;
  min-height: 108px !important;
  padding: 8px !important;
  overflow-y: auto;
  resize: none;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap #prod-title::placeholder,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap #prod-desc::placeholder {
  color: #b1b3b7;
  opacity: 1;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap #prod-title:hover,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap #prod-desc:hover,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 #prod-price:hover,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > .form-wrap.delivery-template .option-delivery-template-str:hover {
  border-color: #cdefdd !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap #prod-title:focus,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap #prod-desc:focus,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 #prod-price:focus,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > .form-wrap.delivery-template .option-delivery-template-str.open {
  border-color: #03C75A !important;
  outline: 0;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 {
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  min-height: 40px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 > .form-group:first-child {
  order: 1;
  flex: 0 0 auto;
  width: auto;
  max-width: none;
  min-height: 40px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 #prod-price {
  order: 1;
  flex: 0 0 120px;
  width: 120px !important;
  min-width: 120px;
  max-width: 120px;
  height: 40px !important;
  padding: 0 8px !important;
  border: 1px solid #dbdcdf !important;
  border-radius: 5px !important;
  background: #fff !important;
  color: #222428 !important;
  font-size: 15px !important;
  box-shadow: none !important;
  box-sizing: border-box;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .price-unit {
  order: 2;
  margin: 0 0 0 8px !important;
  color: #222428;
  font-size: 14px;
  line-height: 40px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 #prod-sale {
  order: 3;
  display: none;
  width: auto;
  min-width: 0;
  max-width: none;
  margin: 0 0 0 32px;
  padding: 0;
  border: 0;
  background-color: transparent;
  color: #b1b3b7;
  font-size: 15px;
  line-height: 40px;
}

/* 할인 중에는 정가/할인 판매가를 표시하고 일반 가격 입력은 숨긴다. */
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1:has(#prod-sale-check:checked) #prod-price,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1:has(#prod-sale-check:checked) #prod-price + .price-unit {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1:has(#prod-sale-check:checked) #prod-sale {
  margin-left: 0;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 #prod-sale.strike {
  text-decoration: line-through;
  text-decoration-color: #b1b3b7;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 #prod-sale.strike::after {
  content: "원";
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .prod-discount-price {
  order: 4;
  margin-left: 12px;
  color: #ee445f;
  font-size: 15px;
  font-weight: 600;
  line-height: 40px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 > .form-group.discount-append {
  order: 10;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 > .form-group.discount-append:not(.hide) {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  flex: 0 0 var(--cl-product-field-width, calc(100% - 152px));
  width: var(--cl-product-field-width, calc(100% - 152px));
  min-height: 40px;
  margin: 10px 0 0 var(--cl-product-field-indent, 152px);
  padding: 0;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 > .form-group.discount-append .product-label {
  display: none;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 > .form-group.discount-append + .error-msg {
  order: 11;
  flex: 0 0 var(--cl-product-field-width, calc(100% - 152px));
  width: var(--cl-product-field-width, calc(100% - 152px));
  margin: 4px 0 0 var(--cl-product-field-indent, 152px);
  padding-left: 0;
  color: #ee445f;
  font-size: 13px;
  line-height: 18px;
  text-align: left;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 > .form-group.discount-append + .error-msg > svg {
  margin-top: -3px;
  margin-right: 3px;
  fill: #ee445f;
  vertical-align: middle;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .prod-input-discount-rate {
  flex: 0 0 var(--cl-product-discount-input-width, 120px);
  width: var(--cl-product-discount-input-width, 120px) !important;
  min-width: var(--cl-product-discount-input-width, 120px);
  max-width: var(--cl-product-discount-input-width, 120px);
  height: 40px !important;
  padding: 0 8px !important;
  border: 1px solid #dbdcdf !important;
  border-radius: 5px !important;
  background: #fff !important;
  color: #222428 !important;
  font-size: 15px !important;
  line-height: 1.4;
  box-shadow: none !important;
  box-sizing: border-box;
  transition: border-color .15s;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .prod-input-discount-rate.empty {
  border-color: #ee445f !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .prod-input-discount-rate:not(.empty):hover {
  border-color: #cdefdd !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .prod-input-discount-rate:not(.empty):focus {
  border-color: #03C75A !important;
  outline: none;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .prod-discount-unit-btn {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex: 0 0 62px;
  width: 62px;
  height: 40px;
  margin: 0 0 0 8px;
  padding: 0 12px;
  border: 1px solid #dbdcdf;
  border-radius: 5px;
  background-color: #fff;
  color: #222428;
  font-size: 15px;
  line-height: 40px;
  cursor: pointer;
  box-sizing: border-box;
  transition: border-color .15s, color .15s;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .prod-discount-unit-btn:hover,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .prod-discount-unit-btn:has(.discount-unit-select:not([style*="display: none"])) {
  border-color: #03C75A;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .prod-discount-unit-btn svg {
  position: static !important;
  flex: 0 0 8px;
  width: 8px;
  height: 4px;
  margin: 0;
  fill: #222428;
  transition: fill .15s, transform .15s;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .prod-discount-unit-btn:hover svg,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .prod-discount-unit-btn:has(.discount-unit-select:not([style*="display: none"])) svg {
  fill: #03C75A;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .prod-discount-unit-btn:has(.discount-unit-select:not([style*="display: none"])) svg {
  transform: rotate(180deg);
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .discount-unit-select {
  position: absolute;
  top: 40px;
  right: -1px;
  left: -1px;
  z-index: 999;
  display: none;
  width: auto;
  margin-top: 0;
  border: 1px solid #dbdcdf;
  border-radius: 5px;
  background-color: #fff;
  overflow: hidden;
  box-shadow: 0 8px 20px rgba(20, 24, 32, .12);
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .discount-unit-select > div {
  min-height: 37px;
  padding: 0 12px;
  color: #222428;
  font-size: 15px;
  line-height: 37px;
  transition: background-color .15s, color .15s;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .discount-unit-select > div:hover {
  background-color: #eaf9f1;
  color: var(--cl-green-text);
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .prod-discount-summary {
  margin-left: 12px;
  color: #8e9095;
  font-size: 15px;
  line-height: 40px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.prod-item-price1 .prod-discount-price {
  order: 4;
  margin-left: 12px;
  color: #ee445f;
  font-size: 15px;
  font-weight: 600;
  line-height: 40px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.prod-item-price1 .prod-discount-summary {
  margin-left: 12px;
  color: #8e9095;
  font-size: 15px;
  line-height: 40px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.prod-item-price1 > .form-group.discount-append .error-msg {
  flex: 0 0 100%;
  width: 100%;
  margin-top: 4px;
  color: #ee445f;
  font-size: 13px;
  line-height: 18px;
  text-align: left;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .form-wrap.prod-item-price1 > .form-group.discount-append .error-msg > svg {
  margin-top: -3px;
  margin-right: 3px;
  fill: #ee445f;
  vertical-align: middle;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .check-sale {
  order: 2;
  position: relative !important;
  top: auto !important;
  right: auto !important;
  display: flex !important;
  align-items: center;
  flex: 0 0 75px;
  width: 75px;
  max-width: 75px;
  height: 40px;
  margin: var(--cl-product-discount-margin, 0 0 0 32px) !important;
  color: #222428;
  font-size: 14px;
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .check-sale .checkbox,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .check-sale .checkbox label {
  display: flex !important;
  align-items: center !important;
  height: 20px;
  min-height: 0;
  margin: 0;
  padding: 0;
  line-height: 20px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .check-sale .checkbox label svg {
  position: static !important;
  display: block;
  flex: 0 0 20px;
  align-self: center;
  width: 20px !important;
  height: 20px !important;
  max-width: 20px !important;
  max-height: 20px !important;
  margin: 0 5px 0 0 !important;
  margin-top: 2px !important;
  vertical-align: top !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .check-sale .checkbox label .check-sale-label-text {
  display: inline-block;
  margin-bottom: 2px !important;
  line-height: 20px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .check-sale input[type="checkbox"] {
  position: absolute !important;
  top: 50%;
  left: 0;
  z-index: 2;
  width: 20px;
  height: 20px;
  margin: var(--cl-product-discount-margin, 0);
  opacity: 0;
  visibility: visible;
  cursor: pointer;
  transform: translateY(-50%);
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .check-sale input[type="checkbox"]:disabled {
  cursor: not-allowed;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .check-sale .checkbox label {
  display: flex !important;
  align-items: center !important;
  height: 20px;
  color: #222428;
  font-size: 14px;
  line-height: 20px;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .check-sale input[type="checkbox"]:disabled + label {
  cursor: default;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .check-sale.checked:not(.disabled) .checkbox label svg,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .check-sale:not(.disabled) input[type="checkbox"]:checked + label svg {
  fill: #03C75A;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .check-sale:not(.disabled) input[type="checkbox"]:not(:checked):hover + label svg path:first-child,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .check-sale:not(.disabled) input[type="checkbox"]:not(:checked) + label:hover svg path:first-child {
  fill: #eaf9f1 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .check-sale:not(.disabled) input[type="checkbox"]:not(:checked):hover + label svg path:last-child,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .check-sale:not(.disabled) input[type="checkbox"]:not(:checked) + label:hover svg path:last-child {
  fill: #cdefdd !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .check-sale .cl-discount-info {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: center;
  width: 13px;
  height: 13px;
  margin-left: 4px !important;
  margin-bottom: 0;
  line-height: 1;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .check-sale .cl-discount-info svg {
  display: block;
  margin-top: 0;
  transform: none;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .check-sale .cl-prod-info.discount-info {
  top: -25px;
  left: 105px;
  transform: none;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .check-sale .cl-prod-info.discount-info::after {
  top: 42px;
  bottom: auto;
  left: -4px;
  transform: rotate(135deg);
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .grade-sale {
  order: 3;
  position: relative;
  top: auto;
  right: auto;
  display: flex;
  align-items: center;
  flex: 0 0 auto;
  height: 40px;
  margin: 0 0 0 20px;
  color: #222428;
  font-size: 14px;
  line-height: 20px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .grade-sale .checkbox,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .grade-sale .checkbox label {
  display: flex;
  align-items: center;
  height: 20px;
  min-height: 0;
  margin: 0;
  padding: 0;
  color: inherit;
  line-height: 20px;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .grade-sale input[type="checkbox"] {
  position: absolute;
  top: 50%;
  left: 0;
  z-index: 2;
  width: 20px;
  height: 20px;
  margin: 0;
  opacity: 0;
  visibility: visible;
  cursor: pointer;
  transform: translateY(-50%);
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .grade-sale .checkbox label {
  gap: 0;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .grade-sale .checkbox label svg {
  position: static;
  display: block;
  flex: 0 0 20px;
  align-self: center;
  width: 20px;
  height: 20px;
  max-width: 20px;
  max-height: 20px;
  margin: 2px 5px 0 0;
  fill: #8a8f98;
  vertical-align: top;
  transform: none;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .grade-sale .checkbox label .grade-sale-label-text {
  display: inline-block;
  margin-bottom: 2px;
  line-height: 20px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .grade-sale.checked:not(.disabled) .checkbox label svg,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .grade-sale:not(.disabled) input[type="checkbox"]:checked + label svg {
  fill: #03C75A;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .grade-sale.disabled,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .grade-sale input[type="checkbox"]:disabled + label {
  color: #b4b8bf;
  cursor: default;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .grade-sale.disabled .checkbox label svg,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .grade-sale input[type="checkbox"]:disabled + label svg {
  fill: #b4b8bf;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .grade-sale .cl-grade-info {
  position: static;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 13px;
  width: 13px;
  height: 13px;
  margin-left: 4px;
  line-height: 1;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .grade-sale .cl-grade-info svg {
  display: block;
  width: 13px;
  height: 13px;
  fill: #03C75A;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .input-switch {
  position: static !important;
  top: auto !important;
  right: auto !important;
  display: flex;
  align-items: center;
  justify-content: center;
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .input-switch > label {
  position: relative;
  display: block;
  width: 36px;
  height: 20px;
  margin: 0;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .input-switch input.switch[type="checkbox"] {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  width: 36px;
  height: 20px;
  margin: 0;
  opacity: 0;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .input-switch input.switch[type="checkbox"].ios-switch + div {
  position: relative;
  width: 36px !important;
  height: 20px !important;
  margin: 0 !important;
  background: #aeb4bd;
  border: 0;
  border-radius: 999px;
  box-shadow: none;
  transition: background-color .15s;
  pointer-events: none;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .input-switch input.switch[type="checkbox"].ios-switch + div > div {
  position: absolute;
  top: 2px;
  left: 2px;
  float: none;
  width: 16px !important;
  height: 16px !important;
  margin: 0 !important;
  background: #fff;
  border-radius: 50%;
  box-shadow: 0 1px 2px rgba(20, 24, 32, .18);
  transition: transform .15s;
  pointer-events: none;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .input-switch input.switch[type="checkbox"].ios-switch:checked + div {
  background: #03C75A;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .input-switch input.switch[type="checkbox"].ios-switch:checked + div > div {
  transform: translateX(16px);
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .input-switch input.switch[type="checkbox"]:disabled,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .form-wrap:is(.plan-upgrade, .not-support) .input-switch > label {
  cursor: default;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .input-switch input.switch[type="checkbox"].ios-switch:disabled + div,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .form-wrap:is(.plan-upgrade, .not-support) .input-switch input.switch[type="checkbox"].ios-switch + div {
  background: #d6d9dc !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .input-switch input.switch[type="checkbox"].ios-switch:disabled + div > div,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .form-wrap:is(.plan-upgrade, .not-support) .input-switch input.switch[type="checkbox"].ios-switch + div > div {
  background: #f5f6f8;
  box-shadow: none;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > .form-wrap.culture-benefit {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  min-height: 40px !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > .form-wrap.culture-benefit::after {
  content: none !important;
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > .form-wrap.culture-benefit > .form-group {
  display: flex !important;
  align-items: center !important;
  flex: var(--cl-product-toggle-group-flex, 0 0 152px) !important;
  width: var(--cl-product-toggle-group-width, 152px) !important;
  min-width: var(--cl-product-toggle-group-width, 152px) !important;
  min-height: 40px !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > .form-wrap.culture-benefit .form-label.culture-benefit {
  display: flex !important;
  align-items: center !important;
  flex: 0 0 var(--cl-product-label-width, 132px) !important;
  width: var(--cl-product-label-width, 132px) !important;
  min-width: var(--cl-product-label-width, 132px) !important;
  min-height: 20px !important;
  margin: var(--cl-product-label-margin, 0 20px 0 0) !important;
  line-height: 20px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > .form-wrap.culture-benefit .form-label.culture-benefit .cl-icon.cl_icon_info {
  align-self: center !important;
  margin-top: 0 !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > .form-wrap.culture-benefit > .culture-benefit-text {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > .form-wrap.culture-benefit > .input-switch {
  position: static !important;
  top: auto !important;
  right: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 36px !important;
  width: 36px !important;
  height: 20px !important;
  min-height: 20px !important;
  margin: var(--cl-product-toggle-margin, 0) !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > .form-wrap.culture-benefit > .input-switch > label {
  display: block !important;
  width: 36px !important;
  height: 20px !important;
  margin: var(--cl-product-toggle-margin, 0) !important;
  line-height: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > .form-wrap.culture-benefit:is(.plan-upgrade, .not-support) .input-switch input.switch[type="checkbox"].ios-switch:checked + div > div {
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing.disabled .unit-pricing-toggle {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing:not(.disabled) {
  height: auto !important;
  min-height: 248px;
  padding-bottom: 10px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing:not(.disabled) .unit-pricing-toggle {
  display: block !important;
  width: calc(100% - var(--cl-unit-pricing-indent, 151px));
  margin: 12px 0 0 var(--cl-unit-pricing-indent, 151px) !important;
  padding: 0 !important;
  border-top: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .unit-pricing-toggle > div:first-child {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .unit-pricing-toggle .grid {
  display: flex !important;
  flex-direction: column;
  align-items: flex-start;
  width: var(--cl-unit-pricing-width, 310px);
  margin: 0 !important;
  padding: 0 !important;
  color: #696c71;
  font-size: 14px;
  row-gap: 0;
  column-gap: 0;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .unit-pricing-toggle .grid > div {
  display: flex !important;
  align-items: center;
  width: 100%;
  min-height: 30px;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .unit-pricing-toggle .grid > div:nth-child(1) {
  order: 1;
  justify-content: space-between;
  min-height: 20px;
  margin-bottom: 7px !important;
  color: #222428;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .unit-pricing-toggle .grid > div:nth-child(3) {
  order: 2;
  margin-bottom: 13px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .unit-pricing-toggle .grid > div:nth-child(2) {
  order: 3;
  position: relative;
  min-height: 20px;
  margin-bottom: 7px !important;
  color: #222428;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .unit-pricing-toggle .grid > div:nth-child(4) {
  order: 4;
  margin-bottom: 13px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .unit-pricing-toggle .grid > div:nth-child(5) {
  order: 5;
  min-height: 20px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .unit-pricing-toggle .grid > div:last-child {
  margin-top: 0 !important;
  color: #222428;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .unit-pricing-toggle .grid .disp-total-unit {
  margin-left: auto;
  color: #222428;
  font-size: 14px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .unit-pricing-toggle .grid .disp-total-unit-value {
  color: var(--cl-green-text);
  font-weight: 700;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .unit-pricing-toggle .grid .disp-unit-value {
  margin-left: 6px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .unit-pricing-toggle input {
  width: var(--cl-unit-pricing-input-width, 120px) !important;
  min-width: var(--cl-unit-pricing-input-width, 120px);
  max-width: var(--cl-unit-pricing-input-width, 120px);
  height: 40px !important;
  margin: 0 !important;
  padding: 0 8px !important;
  border: 1px solid #dbdcdf !important;
  border-radius: 5px !important;
  background: #fff !important;
  background-image: none !important;
  color: #222428;
  font-size: 15px !important;
  line-height: 38px;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .unit-pricing-toggle input[name="total_unit_bundle"] {
  width: var(--cl-unit-pricing-bundle-width, 79px) !important;
  min-width: var(--cl-unit-pricing-bundle-width, 79px);
  max-width: var(--cl-unit-pricing-bundle-width, 79px);
  padding-right: 23px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .unit-pricing-toggle input[readonly],
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .unit-pricing-toggle input:read-only,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .unit-pricing-toggle input[disabled],
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .unit-pricing-toggle input:disabled {
  background: #f3f4f5 !important;
  background-color: #f3f4f5 !important;
  background-image: none !important;
  color: #8d919a !important;
  opacity: 1 !important;
  -webkit-text-fill-color: #8d919a;
  cursor: default;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .unit-pricing-toggle .dropdown.bootstrap-select {
  width: var(--cl-unit-pricing-select-width, 79px) !important;
  height: 40px;
  margin: 0 0 0 8px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .unit-pricing-toggle .dropdown.bootstrap-select > button,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .unit-pricing-toggle .dropdown.bootstrap-select button.btn {
  width: var(--cl-unit-pricing-select-width, 79px) !important;
  height: 40px !important;
  padding: 0 24px 0 10px !important;
  border: 1px solid #dbdcdf !important;
  border-radius: 5px !important;
  background: #fff !important;
  background-image: none !important;
  color: #8d919a !important;
  font-size: 15px !important;
  line-height: 38px !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .unit-pricing-toggle .dropdown.bootstrap-select.disabled > button,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .unit-pricing-toggle .dropdown.bootstrap-select.disabled button.btn,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .unit-pricing-toggle .dropdown.bootstrap-select select[disabled] + button,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .unit-pricing-toggle .dropdown.bootstrap-select button.btn.disabled,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .unit-pricing-toggle .dropdown.bootstrap-select button.btn[disabled],
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .unit-pricing-toggle .dropdown.bootstrap-select button.btn[aria-disabled="true"] {
  background: #f3f4f5 !important;
  background-color: #f3f4f5 !important;
  background-image: none !important;
  border-color: #dbdcdf !important;
  color: #8d919a !important;
  opacity: 1 !important;
  cursor: default !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .unit-pricing-toggle .dropdown.bootstrap-select.disabled .filter-option,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .unit-pricing-toggle .dropdown.bootstrap-select select[disabled] + button .filter-option,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .unit-pricing-toggle .dropdown.bootstrap-select button.btn.disabled .filter-option,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .unit-pricing-toggle .dropdown.bootstrap-select button.btn[disabled] .filter-option,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .unit-pricing-toggle .dropdown.bootstrap-select button.btn[aria-disabled="true"] .filter-option {
  color: #222428 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .unit-pricing-toggle .dropdown.bootstrap-select .filter-option {
  padding-right: 0;
  color: #222428;
  font-size: 15px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .unit-pricing-toggle .dropdown.bootstrap-select .dropdown-toggle .caret {
  right: 9px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .unit-pricing-toggle .cl-prod-info.basic-unit-info {
  top: 50%;
  left: 75px;
  transform: translateY(-50%);
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .unit-pricing-toggle .cl-prod-info.basic-unit-info::after {
  top: calc(50% - 4px);
  bottom: auto;
  left: -4px;
  transform: rotate(135deg);
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .unit-pricing-toggle .dropdown.bootstrap-select .dropdown-menu {
  padding: 0;
  border-radius: 0;
  margin-top: -1px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .unit-pricing-toggle .dropdown.bootstrap-select .dropdown-menu li {
  text-align: left;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .unit-pricing-toggle .dropdown.bootstrap-select .dropdown-menu li.divider {
  background-color: transparent;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .unit-pricing-toggle .dropdown.bootstrap-select .dropdown-menu li.dropdown-header {
  height: 32px;
  padding: 5px 10px;
  background-color: #f5f6f7;
  color: #696c71;
  font-size: 14px;
  font-weight: 500;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .unit-pricing-toggle .dropdown.bootstrap-select .dropdown-menu > li > a {
  display: flex;
  align-items: center;
  height: 32px;
  padding: 5px 15px;
  color: #8d919a;
  font-size: 15px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .unit-pricing-toggle .dropdown.bootstrap-select .dropdown-menu > li.active > a {
  background-color: #f1f6fc;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .unit-pricing-toggle svg {
  flex: 0 0 auto;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #status-product-box > .product-padding-box > .form-group > .product-state-box {
  display: flex !important;
  align-items: center !important;
  flex: 1 1 auto;
  flex-wrap: nowrap !important;
  gap: 0 !important;
  width: auto !important;
  min-height: var(--cl-product-status-label-height, 40px) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #status-product-box > .product-padding-box > .form-group > .product-state-box > div {
  display: var(--cl-product-status-item-display, block) !important;
  align-items: center;
  flex: var(--cl-product-status-item-flex, 1 1 0);
  float: none !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #status-product-box > .product-padding-box > .form-group > .product-state-box input[type="radio"] {
  position: absolute !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #status-product-box > .product-padding-box > .form-group > .product-state-box label {
  position: relative !important;
  z-index: 0;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: var(--cl-product-status-label-width, 100%) !important;
  min-width: 0 !important;
  height: var(--cl-product-status-label-height, 40px) !important;
  margin: var(--cl-product-status-label-margin, 0 0 0 -1px) !important;
  padding: var(--cl-product-status-label-padding, 0 16px) !important;
  border: var(--cl-product-status-label-border, 1px solid #dbdcdf) !important;
  border-radius: 0 !important;
  background: #fff !important;
  box-sizing: border-box !important;
  color: #b1b3b7 !important;
  cursor: pointer;
  font-size: var(--cl-product-status-label-size, 15px) !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  text-align: center !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #status-product-box > .product-padding-box > .form-group > .product-state-box > div:first-child label {
  margin-left: 0 !important;
  border-radius: var(--cl-product-status-label-radius, 5px 0 0 5px) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #status-product-box > .product-padding-box > .form-group > .product-state-box > div:last-child label {
  border-radius: var(--cl-product-status-label-radius, 0 5px 5px 0) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #status-product-box > .product-padding-box > .form-group > .product-state-box input:checked + label,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #status-product-box > .product-padding-box > .form-group > .product-state-box label.active {
  z-index: 1;
  border-color: #03C75A !important;
  color: var(--cl-green-text) !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #status-product-box > .product-padding-box > .form-group > .product-state-box input:checked + label::before,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #status-product-box > .product-padding-box > .form-group > .product-state-box label.active::before {
  content: "";
  flex: 0 0 13px;
  width: 13px;
  height: 10px;
  margin-right: var(--cl-product-status-check-gap, 8px);
  background: var(--cl-green) !important;
  color: var(--cl-green) !important;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13 10'%3E%3Cpath d='M11.59.29 5 6.88 1.41 3.29 0 4.7l5 5 8-7.99L11.59.3Z'/%3E%3C/svg%3E") center / 13px 10px no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13 10'%3E%3Cpath d='M11.59.29 5 6.88 1.41 3.29 0 4.7l5 5 8-7.99L11.59.3Z'/%3E%3C/svg%3E") center / 13px 10px no-repeat;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > #status-product-box {
  height: auto !important;
  min-height: 40px;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible;
  background: #fff !important;
  border-radius: 0;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > #status-product-box > .product-padding-box {
  height: auto !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > #status-product-box > .product-padding-box > .form-group {
  position: relative !important;
  display: flex;
  align-items: center;
  min-height: 40px;
  margin: 0;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > #status-product-box .form-label.product-label {
  position: static !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  flex: 0 0 var(--cl-product-label-width, 132px);
  width: var(--cl-product-label-width, 132px) !important;
  min-width: var(--cl-product-label-width, 132px);
  margin: var(--cl-product-label-margin, 0 20px 0 0) !important;
  padding: 0 !important;
  float: none !important;
  color: #222428 !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 18px !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > #status-product-box:has(#sale:checked) > #status-append,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > #status-product-box:has(#not-sale:checked) > #status-append {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > #status-product-box:has(#limited-sale:checked) > #status-append {
  display: block !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > #status-product-box:has(#limited-sale:checked) #sale-calendar {
  display: block !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > #status-product-box > #status-append {
  margin: 12px 0 0 !important;
  padding: 12px 0 0 !important;
  background: transparent !important;
  border-top: 1px solid #eef0f4 !important;
  border-radius: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body #sale-calendar {
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  color: #222428 !important;
  font-size: 14px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar {
  position: relative !important;
  float: none !important;
  width: 100% !important;
  min-height: 40px !important;
  margin: 20px 0 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #222428 !important;
  font-size: 14px !important;
  line-height: 20px !important;
  box-shadow: none !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box {
  position: relative !important;
  left: auto !important;
  top: auto !important;
  display: grid !important;
  grid-template-columns: 132px minmax(0, 1fr) !important;
  column-gap: 20px !important;
  align-items: center !important;
  width: 100% !important;
  min-height: 40px !important;
  height: auto !important;
  margin: 0 0 20px !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.hide {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box:last-of-type {
  margin-bottom: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box > .title {
  position: static !important;
  display: flex !important;
  align-items: center !important;
  flex: 0 0 var(--cl-product-label-width, 132px) !important;
  width: var(--cl-product-label-width, 132px) !important;
  min-width: var(--cl-product-label-width, 132px) !important;
  min-height: 40px !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  color: #222428 !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 18px !important;
  text-align: left !important;
  white-space: normal !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box > .etc-content {
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  color: #222428 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box > .etc-content > div:not(.setting-text) {
  position: static !important;
  display: flex !important;
  align-items: center !important;
  float: none !important;
  min-width: 0 !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box:not(.etc-setting) > .etc-content {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  align-items: center !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 40px !important;
  gap: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box:not(.etc-setting) > .etc-content > div {
  display: block !important;
  min-width: 0 !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box:not(.etc-setting) .cl_etc_state_check {
  position: relative !important;
  z-index: 0;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 40px !important;
  min-height: 40px !important;
  margin: 0 0 0 -1px !important;
  padding: 0 16px !important;
  border: 1px solid #dbdcdf !important;
  border-radius: 0 !important;
  background: #fff !important;
  box-sizing: border-box !important;
  color: #b1b3b7 !important;
  cursor: pointer !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  text-align: center !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box:not(.etc-setting) > .etc-content > div:first-of-type .cl_etc_state_check {
  margin-left: 0 !important;
  border-radius: 5px 0 0 5px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box:not(.etc-setting) > .etc-content > div:last-of-type .cl_etc_state_check {
  border-radius: 0 5px 5px 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box:not(.etc-setting) .cl_etc_state_check.active,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box:not(.etc-setting) .cl_etc_state_check:hover {
  z-index: 1;
  border-color: #03C75A !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box:not(.etc-setting) .cl_etc_state_check.active {
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box:not(.etc-setting) .cl_etc_state_check.active::before {
  content: "";
  flex: 0 0 13px;
  width: 13px;
  height: 10px;
  margin-right: 8px;
  background: var(--cl-green) !important;
  color: var(--cl-green) !important;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13 10'%3E%3Cpath d='M11.59.29 5 6.88 1.41 3.29 0 4.7l5 5 8-7.99L11.59.3Z'/%3E%3C/svg%3E") center / 13px 10px no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13 10'%3E%3Cpath d='M11.59.29 5 6.88 1.41 3.29 0 4.7l5 5 8-7.99L11.59.3Z'/%3E%3C/svg%3E") center / 13px 10px no-repeat;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.etc-setting {
  align-items: center !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.etc-setting > .title {
  align-self: center !important;
  box-sizing: border-box !important;
  padding-left: 16px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.etc-setting > .etc-content {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  min-height: 40px !important;
  gap: 30px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.term-setting > .etc-content {
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: center !important;
  gap: 10px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.etc-setting .setting-etc-radio {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  width: auto !important;
  min-height: 20px !important;
  height: auto !important;
  margin: 0 !important;
  gap: 30px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.etc-setting .newcheckbox {
  display: inline-flex !important;
  align-items: center !important;
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #222428 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.etc-setting .newcheckbox label,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.etc-setting .cl_etc_status_check {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 20px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #222428 !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  text-align: left !important;
  white-space: nowrap !important;
  cursor: pointer !important;
}

/* 날짜 유형 문구에 남아 있는 레거시 달력 버튼(32px) 스타일을 초기화한다. */
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.etc-setting .newcheckbox label > span {
  display: inline-block !important;
  float: none !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: inherit !important;
  font: inherit !important;
  line-height: inherit !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.etc-setting .cl_etc_status_check.active,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.etc-setting .newcheckbox label:has(input[type="radio"]:checked) {
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.etc-setting .newcheckboxSvgRadio {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 18px !important;
  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
  margin: 0 10px 0 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.etc-setting .newcheckboxSvgRadio::before {
  content: "" !important;
  display: block !important;
  box-sizing: border-box !important;
  width: 18px !important;
  height: 18px !important;
  border: 1px solid #dbdcdf !important;
  border-radius: 50% !important;
  background: #fff !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.etc-setting .newcheckboxSvgRadio::after {
  content: "" !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  display: none !important;
  width: 10px !important;
  height: 10px !important;
  border-radius: 50% !important;
  background: var(--cl-green, #03C75A) !important;
  transform: translate(-50%, -50%) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.etc-setting .cl_etc_status_check.active .newcheckboxSvgRadio::before,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.etc-setting .newcheckboxSvgRadio:has(input[type="radio"]:checked)::before {
  border-color: var(--cl-green, #03C75A) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.etc-setting .cl_etc_status_check.active .newcheckboxSvgRadio::after,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.etc-setting .newcheckboxSvgRadio:has(input[type="radio"]:checked)::after {
  display: block !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.etc-setting .newcheckboxSvgRadio input[type="radio"] {
  position: absolute !important;
  inset: 0 !important;
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
  opacity: 0 !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.etc-setting .newcheckboxSvgRadio svg {
  position: absolute !important;
  inset: 0 !important;
  display: none !important;
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
  fill: #dbdcdf !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.etc-setting .newcheckboxSvgRadio svg.active {
  display: none !important;
  fill: var(--cl-green, #03C75A) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.etc-setting .newcheckboxSvgRadio svg.active path,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.etc-setting .newcheckboxSvgRadio svg.active circle {
  fill: var(--cl-green, #03C75A) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.etc-setting .cl_etc_status_check.active .newcheckboxSvgRadio svg:not(.active),
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.etc-setting .newcheckboxSvgRadio input[type="radio"]:checked ~ svg:not(.active) {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.etc-setting .cl_etc_status_check.active .newcheckboxSvgRadio svg.active,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.etc-setting .newcheckboxSvgRadio input[type="radio"]:checked ~ svg.active {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.etc-setting .setting-text {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  box-sizing: border-box !important;
  width: 300px !important;
  max-width: 100% !important;
  height: 40px !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 38px 0 14px !important;
  overflow: visible !important;
  border: 1px solid #dbdcdf !important;
  border-radius: 5px !important;
  background: #fff !important;
  color: #222428 !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 38px !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.etc-setting .setting-text.hide {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.etc-setting .setting-text .content,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.etc-setting .setting-text .content-start,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.etc-setting .setting-text .content-end {
  flex: 1 1 auto !important;
  display: block !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
  color: inherit !important;
  line-height: 38px !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.etc-setting .setting-text .content:empty::before {
  content: "날짜를 선택해 주세요.";
  color: #b1b3b7 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.etc-setting .setting-text .setting-date-etc,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.etc-setting .setting-text .setting-time-etc {
  position: absolute !important;
  top: 50% !important;
  right: 12px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-green-text) !important;
  line-height: 1 !important;
  transform: translateY(-50%) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.etc-setting .setting-text :is(.setting-date-etc, .setting-time-etc)[data-tooltip]::before,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.etc-setting .setting-text :is(.setting-date-etc, .setting-time-etc)[data-tooltip]::after {
  position: absolute !important;
  left: 50% !important;
  z-index: 30 !important;
  display: none !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.etc-setting .setting-text :is(.setting-date-etc, .setting-time-etc)[data-tooltip]::before {
  content: attr(data-tooltip) !important;
  bottom: calc(100% + 8px) !important;
  box-sizing: border-box !important;
  width: max-content !important;
  max-width: 120px !important;
  padding: 6px 9px !important;
  border: 1px solid var(--cl-border, #e5e7eb) !important;
  border-radius: 8px !important;
  background: #fff !important;
  box-shadow: 0 4px 12px rgba(20, 24, 32, .16) !important;
  color: var(--cl-text, #222428) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 16px !important;
  white-space: nowrap !important;
  transform: translateX(-50%) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.etc-setting .setting-text :is(.setting-date-etc, .setting-time-etc)[data-tooltip]::after {
  content: "" !important;
  bottom: calc(100% + 4px) !important;
  width: 8px !important;
  height: 8px !important;
  border-right: 1px solid var(--cl-border, #e5e7eb) !important;
  border-bottom: 1px solid var(--cl-border, #e5e7eb) !important;
  background: #fff !important;
  transform: translateX(-50%) rotate(45deg) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.etc-setting .setting-text :is(.setting-date-etc, .setting-time-etc)[data-tooltip]:hover::before,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.etc-setting .setting-text :is(.setting-date-etc, .setting-time-etc)[data-tooltip]:hover::after {
  display: block !important;
}

body.cl-dashboard-redesign-page .cl-etc-product-date-value-tooltip {
  position: absolute !important;
  z-index: 1000006 !important;
  display: none;
  box-sizing: border-box !important;
  max-width: min(420px, calc(100vw - 24px)) !important;
  padding: 8px 11px !important;
  border: 1px solid var(--cl-border, #e5e7eb) !important;
  border-radius: 8px !important;
  background: #fff !important;
  box-shadow: 0 4px 12px rgba(20, 24, 32, .16) !important;
  color: var(--cl-text, #222428) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 18px !important;
  text-align: left !important;
  white-space: normal !important;
  word-break: break-all !important;
  overflow: visible !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .cl-etc-product-date-value-tooltip.is-visible {
  display: block !important;
}

body.cl-dashboard-redesign-page .cl-etc-product-date-value-tooltip::before,
body.cl-dashboard-redesign-page .cl-etc-product-date-value-tooltip::after {
  content: "" !important;
  position: absolute !important;
  display: block !important;
  width: 0 !important;
  height: 0 !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .cl-etc-product-date-value-tooltip[data-placement="right"]::before {
  top: 50% !important;
  left: -7px !important;
  margin-top: -7px !important;
  border-top: 7px solid transparent !important;
  border-right: 7px solid var(--cl-border, #e5e7eb) !important;
  border-bottom: 7px solid transparent !important;
}

body.cl-dashboard-redesign-page .cl-etc-product-date-value-tooltip[data-placement="right"]::after {
  top: 50% !important;
  left: -6px !important;
  margin-top: -6px !important;
  border-top: 6px solid transparent !important;
  border-right: 6px solid #fff !important;
  border-bottom: 6px solid transparent !important;
}

body.cl-dashboard-redesign-page .cl-etc-product-date-value-tooltip[data-placement="top"]::before {
  bottom: -7px !important;
  left: 24px !important;
  border-top: 7px solid var(--cl-border, #e5e7eb) !important;
  border-right: 7px solid transparent !important;
  border-left: 7px solid transparent !important;
}

body.cl-dashboard-redesign-page .cl-etc-product-date-value-tooltip[data-placement="top"]::after {
  bottom: -6px !important;
  left: 25px !important;
  border-top: 6px solid #fff !important;
  border-right: 6px solid transparent !important;
  border-left: 6px solid transparent !important;
}

body.cl-dashboard-redesign-page .cl-etc-product-date-value-tooltip[data-placement="bottom"]::before {
  top: -7px !important;
  left: 24px !important;
  border-right: 7px solid transparent !important;
  border-bottom: 7px solid var(--cl-border, #e5e7eb) !important;
  border-left: 7px solid transparent !important;
}

body.cl-dashboard-redesign-page .cl-etc-product-date-value-tooltip[data-placement="bottom"]::after {
  top: -6px !important;
  left: 25px !important;
  border-right: 6px solid transparent !important;
  border-bottom: 6px solid #fff !important;
  border-left: 6px solid transparent !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.etc-setting .setting-text .setting-date-etc svg,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.etc-setting .setting-text .setting-time-etc svg,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.etc-setting .setting-text svg {
  display: block !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body #sale-calendar .sale-calendar-box {
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  min-height: 40px !important;
  margin: 0 0 10px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body #sale-calendar .sale-calendar-box:last-child {
  margin-bottom: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body #sale-calendar .title {
  display: flex !important;
  align-items: center !important;
  flex: 0 0 var(--cl-product-label-width, 132px);
  width: var(--cl-product-label-width, 132px) !important;
  min-width: var(--cl-product-label-width, 132px) !important;
  min-height: 0 !important;
  margin: var(--cl-product-label-margin, 0 20px 0 0) !important;
  padding: 0 !important;
  color: #222428 !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 18px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body #sale-calendar .sale-content {
  display: flex !important;
  align-items: center !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body #sale-calendar .sale-setting:not(.term-setting) .sale-content {
  gap: var(--cl-product-sale-date-gap, 15px);
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body #sale-calendar .sale-setting:not(.term-setting) .setting-text {
  position: relative;
  box-sizing: border-box;
  width: var(--cl-product-sale-date-width, 255px) !important;
  height: 40px !important;
  padding: 0 34px 0 10px !important;
  overflow: visible;
  border: 1px solid #dbdcdf;
  border-radius: 5px;
  background: #fff !important;
  color: #222428 !important;
  font-size: 15px !important;
  line-height: 38px !important;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body #sale-calendar .sale-setting:not(.term-setting) .setting-text .content-start,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body #sale-calendar .sale-setting:not(.term-setting) .setting-text .content-end {
  display: block;
  overflow: hidden;
  line-height: 38px;
  pointer-events: none;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body #sale-calendar .sale-setting:not(.term-setting) .setting-text .content-start:empty::before,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body #sale-calendar .sale-setting:not(.term-setting) .setting-text .content-end:empty::before {
  content: "날짜와 시간을 선택해 주세요";
  color: #b1b3b7;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body #sale-calendar .sale-setting:not(.term-setting) .setting-text + div {
  margin: 0 8px !important;
  color: #8d919a !important;
  font-size: 13px !important;
  line-height: 40px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body #sale-calendar .setting-sale-datetime {
  position: absolute !important;
  top: 50% !important;
  right: 4px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 28px !important;
  height: 28px !important;
  padding-top: 0 !important;
  border-radius: 5px !important;
  cursor: pointer !important;
  line-height: 28px !important;
  overflow: visible !important;
  pointer-events: auto !important;
  transform: translateY(-50%) !important;
  z-index: 2 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body #sale-calendar .setting-sale-datetime:not(.disabled):hover {
  background: #fafafa !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body #sale-calendar .setting-sale-datetime svg {
  fill: #03C75A !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body #sale-calendar .term-setting .product-state-box {
  display: flex !important;
  align-items: center !important;
  flex-wrap: var(--cl-product-row-wrap, nowrap) !important;
  gap: 32px !important;
  width: auto !important;
  min-height: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body #sale-calendar .term-setting .product-state-box > div {
  display: flex !important;
  align-items: center !important;
  flex: 0 0 auto !important;
  float: none !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body #sale-calendar .term-setting .product-state-box input[type="radio"] {
  position: absolute !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body #sale-calendar .term-setting .product-state-box label {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  width: auto !important;
  min-width: 0 !important;
  height: 24px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #222428 !important;
  cursor: pointer !important;
  font-size: 15px !important;
  font-weight: 400 !important;
  line-height: 24px !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body #sale-calendar .term-setting .product-state-box input:checked + label {
  border: 0 !important;
  color: var(--cl-green-text) !important;
  font-weight: 600 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body #sale-calendar .term-setting .product-state-box label::before {
  content: none !important;
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body #sale-calendar .term-setting .newcheckboxSvgRadio {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 18px;
  width: 18px !important;
  height: 18px !important;
  margin: 0 6px 0 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body #sale-calendar .term-setting .newcheckboxSvgRadio svg {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  display: block !important;
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
  fill: #dbdcdf !important;
  transition: opacity .18s ease;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body #sale-calendar .term-setting .newcheckboxSvgRadio svg.active {
  opacity: 0;
  fill: #03C75A !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body #sale-calendar .term-setting .product-state-box input:checked + label .newcheckboxSvgRadio svg:not(.active),
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body #sale-calendar .term-setting .product-state-box input:not(:checked) + label:hover .newcheckboxSvgRadio svg:not(.active) {
  opacity: 0;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body #sale-calendar .term-setting .product-state-box input:checked + label .newcheckboxSvgRadio svg.active,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body #sale-calendar .term-setting .product-state-box input:not(:checked) + label:hover .newcheckboxSvgRadio svg.active {
  opacity: 1;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body #sale-calendar .term-setting .product-state-box input:checked + label .newcheckboxSvgRadio svg.active path,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body #sale-calendar .term-setting .product-state-box input:checked + label .newcheckboxSvgRadio svg.active circle {
  fill: #03C75A !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body #sale-calendar .term-setting .product-state-box input:not(:checked) + label:hover .newcheckboxSvgRadio svg.active path {
  fill: #cdefdd !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body #sale-calendar .term-setting .product-state-box input:not(:checked) + label:hover .newcheckboxSvgRadio svg.active circle {
  fill: #eefaf4 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body #sale-calendar .term-setting .product-state-box label > span {
  float: none !important;
  display: inline-block !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #222428 !important;
  font-size: 15px !important;
  font-weight: 400 !important;
  line-height: 24px !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body #sale-calendar .term-setting .product-state-box input:checked + label > span {
  color: var(--cl-green-text) !important;
  font-weight: 600 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .form-wrap:has(.switch-quantity),
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .form-wrap.option-toggle {
  position: relative !important;
  display: var(--cl-product-quantity-display, flex) !important;
  align-items: center !important;
  min-height: 40px !important;
  margin: 20px 0 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #fff !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .form-wrap:has(.switch-quantity) > .form-group,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .form-wrap.option-toggle > .form-group {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  width: 100%;
  min-height: 40px !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .form-wrap:has(.switch-quantity) > .form-group {
  display: contents !important;
  flex: 0 0 auto;
  width: auto;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .form-wrap:has(.switch-quantity) .form-label.quantity-label,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .form-wrap.option-toggle .form-label.product-state {
  position: static !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  flex: 0 0 var(--cl-product-label-width, 132px);
  width: var(--cl-product-label-width, 132px) !important;
  min-width: var(--cl-product-label-width, 132px) !important;
  margin: var(--cl-product-label-margin, 0 20px 0 0) !important;
  padding: 0 !important;
  float: none !important;
  color: #222428 !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 18px !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body .form-label .cl-icon.cl_icon_info {
  position: relative !important;
  top: .5px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 13px;
  width: 13px !important;
  height: 13px !important;
  margin: 0 0 0 4px !important;
  color: #03C75A !important;
  fill: #03C75A !important;
  line-height: 1 !important;
  vertical-align: middle !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body .form-label .cl-icon.cl_icon_info svg {
  display: block !important;
  width: 13px !important;
  height: 13px !important;
  margin: 0 !important;
  fill: currentColor !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body .form-label .cl-icon.cl_icon_info svg path,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body .form-label .cl-icon.cl_icon_info svg rect {
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .form-wrap:has(.switch-quantity) > .input-switch {
  position: static !important;
  top: auto !important;
  right: auto !important;
  order: 2;
  flex: 0 0 36px;
  width: 36px !important;
  margin: var(--cl-product-toggle-margin, 0 48px 0 0) !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .form-wrap:has(.switch-quantity) .form-label.quantity-label {
  order: 1;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .form-wrap:has(.switch-quantity) #prod-quantity.hide,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .form-wrap:has(.switch-quantity) #prod-quantity.hide + .prod-quantity-unit {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .form-wrap:has(.switch-quantity) #prod-quantity:not(.hide) {
  order: 3;
  flex: 0 0 80px;
  display: inline-block !important;
  width: 80px !important;
  height: 40px !important;
  padding: 0 8px !important;
  border: 1px solid #dbdcdf !important;
  border-radius: 5px !important;
  background: #fff !important;
  color: #222428 !important;
  font-size: 15px !important;
  line-height: 38px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .form-wrap:has(.switch-quantity) #prod-quantity:not(.hide) + .prod-quantity-unit {
  order: 4;
  flex: 0 0 auto;
  display: inline-flex !important;
  align-items: center !important;
  margin-left: 8px !important;
  color: #222428 !important;
  font-size: 14px !important;
  line-height: 40px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .form-wrap.option-toggle .option-state-box {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  display: var(--cl-product-option-display, flex) !important;
  align-items: center !important;
  flex: 1 1 auto;
  flex-wrap: var(--cl-product-row-wrap, nowrap) !important;
  gap: var(--cl-product-option-gap, 8px) !important;
  width: auto !important;
  min-height: 40px !important;
  float: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .form-wrap.option-toggle .option-state-box > .newcheckbox {
  position: static !important;
  display: flex !important;
  align-items: center !important;
  flex: 0 0 auto !important;
  float: none !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .form-wrap.option-toggle .option-state-box > .newcheckbox.hide,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .form-wrap.option-toggle .option-state-box > .newcheckbox[style*="display: none"] {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .form-wrap.option-toggle .option-state-box > .newcheckbox.options-config {
  margin-left: auto !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .form-wrap.option-toggle .option-state-box input[type="checkbox"] {
  position: absolute !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .form-wrap.option-toggle .option-state-box label {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: var(--cl-product-option-width, auto) !important;
  min-width: var(--cl-product-option-min-width, 110px) !important;
  height: var(--cl-product-option-height, 36px) !important;
  margin: 0 !important;
  padding: var(--cl-product-option-padding, 0 18px) !important;
  border: 1px solid #dbdcdf !important;
  border-radius: 18px !important;
  background: #fff !important;
  color: #b1b3b7 !important;
  box-sizing: border-box !important;
  cursor: pointer;
  font-size: var(--cl-product-option-font-size, 15px) !important;
  font-weight: 600 !important;
  line-height: 34px !important;
  text-align: center !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .form-wrap.option-toggle .option-state-box input:checked + label,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .form-wrap.option-toggle .option-state-box .newcheckbox.active label {
  border-color: #03C75A !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .form-wrap.option-toggle .option-state-box label::before,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .form-wrap.option-toggle .option-state-box input:checked + label::before {
  content: none !important;
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .form-wrap.option-toggle .option-state-box .options-config label {
  min-width: var(--cl-product-option-min-width, 90px) !important;
  border-radius: 5px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > #product-state {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  min-height: 0 !important;
  margin: 14px 0 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state > input[type="file"] {
  position: fixed !important;
  top: -99999px !important;
  left: -99999px !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state #add-upload-check {
  position: relative !important;
  left: auto !important;
  top: auto !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 20px !important;
  width: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .product-upload,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .download-setting {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 132px minmax(0, 1fr) !important;
  column-gap: 20px !important;
  row-gap: 20px !important;
  align-items: center !important;
  width: 100% !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #222428 !important;
  font-size: 14px !important;
  line-height: 20px !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .product-upload > .title,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .download-setting > .title,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .download-setting .input-box > .title {
  position: static !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  width: var(--cl-product-label-width, 132px) !important;
  min-width: var(--cl-product-label-width, 132px) !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  color: #222428 !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 18px !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .download-setting > .title {
  grid-column: 1;
  grid-row: 1;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .download-setting > .title br {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .product-upload > .download-contents {
  grid-column: 2;
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 8px 12px !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  color: #222428 !important;
  font-size: 14px !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .download-setting > #download-contents,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .download-setting > .download-contents,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .download-setting > #download-contents > .input-box,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .download-setting > .download-contents > .input-box {
  display: contents !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .download-setting .input-box:first-child > .title {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .download-setting .input-box:first-child > .textbox {
  grid-column: 2;
  grid-row: 1;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .download-setting .input-box:last-child > .title {
  grid-column: 1;
  grid-row: 2;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .download-setting .input-box:last-child > .textbox {
  grid-column: 2;
  grid-row: 2;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .download-setting .textbox {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  width: auto !important;
  min-width: 0 !important;
  height: 40px !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .download-input {
  position: static !important;
  display: inline-block !important;
  flex: 1 1 auto !important;
  width: auto !important;
  min-width: 0 !important;
  height: 38px !important;
  min-height: 38px !important;
  margin: 0 !important;
  padding: 0 10px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #fff !important;
  box-shadow: none !important;
  color: #222428 !important;
  font-size: 15px !important;
  line-height: 38px !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .download-input[type="number"] {
  appearance: textfield !important;
  -moz-appearance: textfield !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .download-input[type="number"]::-webkit-inner-spin-button,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .download-input[type="number"]::-webkit-outer-spin-button {
  display: none !important;
  margin: 0 !important;
  -webkit-appearance: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .download-number-control {
  position: relative !important;
  display: inline-flex !important;
  align-items: stretch !important;
  flex: 0 0 92px !important;
  width: 92px !important;
  height: 40px !important;
  margin: 0 8px 0 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 1px solid #dbdcdf !important;
  border-radius: 5px !important;
  background: #fff !important;
  box-sizing: border-box !important;
  vertical-align: top !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .download-stepper {
  position: static !important;
  display: flex !important;
  flex-direction: column !important;
  flex: 0 0 24px !important;
  width: 24px !important;
  height: 38px !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #fff !important;
  overflow: hidden !important;
  z-index: auto !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .download-stepper-btn {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  flex: 1 1 50% !important;
  height: 19px !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #fff !important;
  color: #222428 !important;
  cursor: pointer !important;
  font-size: 0 !important;
  line-height: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .download-stepper-btn + .download-stepper-btn {
  border-top: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .download-stepper-btn:hover {
  background: #fff !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .download-stepper-btn:disabled,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .download-stepper-btn[aria-disabled="true"],
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .download-stepper-btn:disabled:hover,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .download-stepper-btn[aria-disabled="true"]:hover {
  background: #fff !important;
  color: #c8ccd2 !important;
  cursor: default !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .download-stepper-btn::before {
  content: "" !important;
  display: block !important;
  width: 0 !important;
  height: 0 !important;
  border-right: 4px solid transparent !important;
  border-left: 4px solid transparent !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .download-stepper-up::before {
  border-bottom: 5px solid currentColor !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .download-stepper-down::before {
  border-top: 5px solid currentColor !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .download-input:focus,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .download-input:focus-visible {
  border-color: transparent !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .download-number-control:focus-within {
  border-color: #03C75A !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .download-setting .textbox > span {
  position: static !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  width: auto !important;
  height: 40px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #222428 !important;
  font-size: 14px !important;
  line-height: 40px !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .cl_icon_upload02 {
  position: static !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 104px !important;
  height: 36px !important;
  margin: 0 !important;
  padding: 0 14px !important;
  float: none !important;
  border: 1px solid #03C75A !important;
  border-radius: 5px !important;
  background: #fff !important;
  box-shadow: none !important;
  color: #03C75A !important;
  cursor: pointer !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  line-height: 34px !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .cl_icon_upload02:hover {
  border-color: #02b351 !important;
  background: #eaf9f1 !important;
  color: #02b351 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .cl_icon_upload02::before {
  content: none !important;
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state #none-option-file,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .file-box-list {
  display: flex !important;
  align-items: center !important;
  flex: 1 1 auto !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  min-width: 0 !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .file-name,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .none-file-name {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  max-width: 100% !important;
  min-height: 28px !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-green-text) !important;
  font-size: 13px !important;
  line-height: 18px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .file-name-detail,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .none-file-name-detail {
  display: inline-block !important;
  overflow: hidden !important;
  max-width: 220px !important;
  margin: 0 !important;
  color: var(--cl-green-text) !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .file-size,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .none-file-size {
  margin: 0 !important;
  color: #8a8f98 !important;
  font-size: 12px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .real-file-name,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .none-real-file-name,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .file-url,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .none-file-url {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .cl_icon_close {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 18px !important;
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
  color: #e5484d !important;
  cursor: pointer !important;
  font-size: 0 !important;
  line-height: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .cl_icon_close::before,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .cl_icon_close::after {
  content: "" !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  width: 10px !important;
  height: 1.5px !important;
  border-radius: 999px !important;
  background: currentColor !important;
  transform-origin: center !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .cl_icon_close::before {
  transform: translate(-50%, -50%) rotate(45deg) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .cl_icon_close::after {
  transform: translate(-50%, -50%) rotate(-45deg) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .product-status {
  display: block !important;
  width: 100% !important;
  min-height: 40px !important;
  margin: 8px 0 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .product-status .product-state-box {
  position: relative !important;
  left: auto !important;
  top: auto !important;
  display: block !important;
  width: 100% !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .product-status .product-upload {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 132px minmax(0, 1fr) !important;
  column-gap: 20px !important;
  align-items: center !important;
  width: 100% !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .product-status .product-upload > .title {
  position: static !important;
  display: flex !important;
  align-items: center !important;
  width: var(--cl-product-label-width, 132px) !important;
  min-width: var(--cl-product-label-width, 132px) !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  color: #222428 !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 18px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .product-upload > .title,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .product-status .product-upload > .title {
  visibility: hidden !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .product-status .download-contents {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 8px 12px !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .product-status .cl_icon_upload02 {
  position: static !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 104px !important;
  height: 36px !important;
  margin: 0 !important;
  padding: 0 14px !important;
  float: none !important;
  border: 1px solid #03C75A !important;
  border-radius: 5px !important;
  background: #fff !important;
  color: #03C75A !important;
  cursor: pointer !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  line-height: 34px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .product-status .cl_icon_upload02:hover {
  border-color: #02b351 !important;
  background: #eaf9f1 !important;
  color: #02b351 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .product-status .cl_icon_upload02::before {
  content: none !important;
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .product-status .file-box-list,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .product-status .file-name {
  display: inline-flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  width: auto !important;
  max-width: 100% !important;
  min-height: 28px !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-green-text) !important;
  font-size: 13px !important;
  line-height: 18px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .product-status .file-name-detail {
  overflow: hidden !important;
  max-width: 220px !important;
  margin: 0 !important;
  color: var(--cl-green-text) !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .product-status .file-size {
  margin: 0 !important;
  color: #8a8f98 !important;
  font-size: 12px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .product-status .real-file-name,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .product-status .file-url {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .product-status .cl_icon_close {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 18px !important;
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
  color: #e5484d !important;
  cursor: pointer !important;
  font-size: 0 !important;
  line-height: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .product-status .cl_icon_close::before,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .product-status .cl_icon_close::after {
  content: "" !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  width: 10px !important;
  height: 1.5px !important;
  border-radius: 999px !important;
  background: currentColor !important;
  transform-origin: center !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .product-status .cl_icon_close::before {
  transform: translate(-50%, -50%) rotate(45deg) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .product-status .cl_icon_close::after {
  transform: translate(-50%, -50%) rotate(-45deg) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab {
  margin: 18px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: #fff !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option {
  position: relative !important;
  --cl-option-row-w: var(--cl-option-responsive-row-w, 531px);
  --cl-option-move-w: 44px;
  --cl-option-price-w: 136px;
  --cl-option-quantity-w: 80px;
  --cl-option-status-w: 58px;
  --cl-option-grid-stock: var(--cl-option-move-w) minmax(var(--cl-option-title-min, 0px), 1fr) var(--cl-option-price-w) var(--cl-option-quantity-w) var(--cl-option-status-w);
  --cl-option-grid-no-stock: var(--cl-option-move-w) minmax(var(--cl-option-title-min, 0px), 1fr) var(--cl-option-price-w) var(--cl-option-status-w);
  --cl-option-grid-text: var(--cl-option-move-w) minmax(0, 1fr);
  --cl-option-head-tail-stock: var(--cl-option-price-w) var(--cl-option-quantity-w) var(--cl-option-status-w);
  --cl-option-head-tail-no-stock: var(--cl-option-price-w) var(--cl-option-status-w);
  min-height: 78px;
  margin: 0 !important;
  padding: var(--cl-product-option-padding, 0 0 0 151px) !important;
  background: #fff !important;
  text-align: left !important;
  cursor: default !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option + .prod-option {
  margin-top: 20px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option.hide {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .option-head-title {
  position: var(--cl-product-option-title-position, absolute) !important;
  top: 30px !important;
  left: 0 !important;
  display: flex !important;
  align-items: center !important;
  width: var(--cl-product-label-width, 132px) !important;
  min-height: 48px;
  margin: 0 !important;
  padding: 0 !important;
  color: #696c71 !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 18px !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option[data-option_mode="normal"] > .option-head-title {
  font-size: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option[data-option_mode="normal"] > .option-head-title .option-head-str::before {
  content: "일반 옵션";
  color: #696c71 !important;
  font-size: 14px;
  font-weight: 600 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option[data-option_mode="text"]::before {
  content: "입력형 옵션";
  position: absolute;
  top: 30px;
  left: 0;
  display: flex;
  align-items: center;
  width: var(--cl-product-label-width, 132px);
  min-height: 48px;
  color: #696c71 !important;
  font-size: 14px;
  font-weight: 600 !important;
  line-height: 18px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .option-head-title .edit-info {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .option-head {
  display: grid !important;
  grid-template-columns: var(--cl-option-grid-stock) !important;
  align-items: center !important;
  width: 100% !important;
  max-width: var(--cl-option-row-w) !important;
  min-height: 24px !important;
  margin: 0 0 6px !important;
  padding: 0 !important;
  color: #8a8f98 !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 18px !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .option-head .option-type-title,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .option-head .option-type-title3 {
  display: block !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  color: inherit !important;
  font: inherit !important;
  line-height: inherit !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option[data-option_mode="normal"] > .option-head .option-type-title.tp1,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option[data-option_mode="additional"] > .option-head .option-type-title3.tp1 {
  grid-column: 2;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option[data-option_mode="normal"] > .option-head .option-type-title.tp2,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option[data-option_mode="normal"] > .option-head .option-type-title.tp3,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option[data-option_mode="additional"] > .option-head .option-type-title3.tp2 {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .option-head > div {
  grid-column: 3 / 6 !important;
  display: grid !important;
  grid-template-columns: var(--cl-option-head-tail-stock) !important;
  align-items: center !important;
  justify-items: stretch !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  color: inherit !important;
  font: inherit !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .option-head .plus-price,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .option-head .plus-quantity,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .option-head .plus-status {
  position: static !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  padding: 0 !important;
  font-size: 13px !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option[data-option_mode="normal"] > .option-head .plus-price,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option[data-option_mode="additional"] > .option-head .plus-price {
  flex: 0 0 var(--cl-option-price-w) !important;
  width: var(--cl-option-price-w) !important;
  min-width: var(--cl-option-price-w) !important;
  max-width: var(--cl-option-price-w) !important;
  justify-content: flex-end !important;
  padding-right: 12px !important;
  box-sizing: border-box !important;
  text-align: right !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option[data-option_mode="normal"] > .option-head .plus-quantity,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option[data-option_mode="additional"] > .option-head .plus-quantity {
  flex: 0 0 var(--cl-option-quantity-w) !important;
  width: var(--cl-option-quantity-w) !important;
  min-width: var(--cl-option-quantity-w) !important;
  max-width: var(--cl-option-quantity-w) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option[data-option_mode="normal"] > .option-head .plus-status,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option[data-option_mode="additional"] > .option-head .plus-status {
  flex: 0 0 var(--cl-option-status-w) !important;
  width: var(--cl-option-status-w) !important;
  min-width: var(--cl-option-status-w) !important;
  max-width: var(--cl-option-status-w) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option:not([data-option_mode="additional"]) > .option-head .plus-quantity.hide {
  display: none !important;
}

/* 제목은 실제 문구로 표시하고 레거시 6px 장식용 점은 제거한다. */
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option[data-option_mode="text"] > .option-head.editable::after,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .option-head .option-type-title.editable::after,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .option-head .option-type-title3.editable::after,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .option-head .plus-price::before,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .option-head .plus-quantity::before,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .option-head .plus-status::before,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .option-head .plus-price::after,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .option-head .plus-quantity::after,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .option-head .plus-status::after {
  content: none !important;
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option:not([data-option_mode="additional"]) > .option-head:has(.plus-quantity.hide) {
  grid-template-columns: var(--cl-option-grid-no-stock) !important;
  max-width: var(--cl-option-row-w) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option:not([data-option_mode="additional"]) > .option-head:has(.plus-quantity.hide) > div {
  grid-column: 3 / 5 !important;
  grid-template-columns: var(--cl-option-head-tail-no-stock) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .option-head:not(:has(.plus-quantity.hide)) .plus-price {
  grid-column: 1 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .option-head:not(:has(.plus-quantity.hide)) .plus-quantity {
  grid-column: 2 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .option-head:not(:has(.plus-quantity.hide)) .plus-status {
  grid-column: 3 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option:not([data-option_mode="additional"]) > .option-head:has(.plus-quantity.hide) .plus-price {
  grid-column: 1 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option:not([data-option_mode="additional"]) > .option-head:has(.plus-quantity.hide) .plus-status {
  grid-column: 2 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option[data-option_mode="text"] > .option-head {
  grid-template-columns: var(--cl-option-grid-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option[data-option_mode="text"] > .option-head .option-type-title3.tp1 {
  grid-column: 2;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-list {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-list > li {
  position: relative !important;
  width: 100% !important;
  min-height: 48px;
  margin: 0 0 8px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #222428 !important;
  font-size: 14px !important;
  line-height: 18px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option[data-option_mode="normal"] > .prod-option-list > li:first-child {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-list > li.err {
  border: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-list > li > .prod-option-item:not(.hide),
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap {
  position: relative !important;
  display: grid !important;
  grid-template-columns: var(--cl-option-grid-stock) !important;
  grid-auto-columns: 0 !important;
  column-gap: 0 !important;
  align-items: center !important;
  width: 100% !important;
  max-width: var(--cl-option-row-w) !important;
  height: 48px !important;
  min-height: 48px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 5px !important;
  background: #fff !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap {
  border-color: #03C75A !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-list > li.err > .prod-option-item:not(.hide),
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-list > li.err > .prod-option-edit:not(.hide) > .form-wrap {
  border-color: #e5484d !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option[data-option_mode="normal"] > .prod-option-list > li:has(> .product-status) {
  width: 100% !important;
  max-width: var(--cl-option-row-w) !important;
  min-height: 92px !important;
  margin-bottom: 8px !important;
  border: 0 !important;
  border-radius: 5px !important;
  background: #fff !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option[data-option_mode="normal"] > .prod-option-list > li:has(> .product-status)::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 4 !important;
  display: block !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 5px !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option[data-option_mode="normal"] > .prod-option-list > li:has(> .product-status)::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  right: -54px !important;
  z-index: 3 !important;
  display: block !important;
  width: 54px !important;
  height: 100% !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option[data-option_mode="normal"] > .prod-option-list > li:has(> .product-status):has(> .prod-option-edit:not(.hide))::after {
  border-color: #03C75A !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option[data-option_mode="normal"] > .prod-option-list > li.err:has(> .product-status)::after {
  border-color: #e5484d !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option[data-option_mode="normal"] > .prod-option-list > li:has(> .product-status) > .prod-option-item:not(.hide),
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option[data-option_mode="normal"] > .prod-option-list > li:has(> .product-status) > .prod-option-edit:not(.hide) > .form-wrap {
  position: static !important;
  width: 100% !important;
  max-width: 100% !important;
  border: 0 !important;
  border-radius: 0 !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option[data-option_mode="normal"] > .prod-option-list > li:has(> .product-status) .prod-option-move {
  position: absolute !important;
  top: 50% !important;
  left: 0 !important;
  z-index: 5 !important;
  height: 20px !important;
  transform: translateY(-50%) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option[data-option_mode="normal"] > .prod-option-list > li:has(> .product-status) .edit-option-delete {
  top: 50% !important;
  z-index: 5 !important;
  transform: translateY(-50%) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option[data-option_mode="normal"] > .prod-option-list > li:has(> .product-status) > .product-status {
  width: 100% !important;
  min-height: 42px !important;
  margin: 0 !important;
  padding: 0 0 8px var(--cl-option-move-w) !important;
  border: 0 !important;
  background: transparent !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option[data-option_mode="normal"] > .prod-option-list > li:has(> .product-status) > .product-status .product-state-box {
  width: 100% !important;
  min-height: 36px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option[data-option_mode="normal"] > .prod-option-list > li:has(> .product-status) > .product-status .product-upload {
  display: flex !important;
  grid-template-columns: none !important;
  align-items: center !important;
  width: 100% !important;
  min-height: 36px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option[data-option_mode="normal"] > .prod-option-list > li:has(> .product-status) > .product-status .product-upload > .title {
  display: none !important;
  width: 0 !important;
  min-width: 0 !important;
  min-height: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option[data-option_mode="normal"] > .prod-option-list > li:has(> .product-status) > .product-status .download-contents {
  min-height: 36px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-list > li > .prod-option-item.hide,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-list > li > .prod-option-edit.hide {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option .prod-option-move {
  grid-column: 1;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 44px !important;
  height: 46px !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #c8ccd2 !important;
  line-height: 1 !important;
  cursor: move !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transition: opacity .12s ease, color .12s ease;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-list > li:hover .prod-option-move:not(.invisible),
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-list > li:focus-within .prod-option-move:not(.invisible),
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-list > li.ui-sortable-helper .prod-option-move:not(.invisible) {
  color: #c8ccd2 !important;
  fill: #c8ccd2 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option .prod-option-move.invisible {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-list > li:hover .prod-option-move:not(.invisible) {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option .prod-option-move svg {
  display: block !important;
  width: 20px !important;
  height: 20px !important;
  margin: 0 !important;
  color: #c8ccd2 !important;
  fill: #c8ccd2 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option .prod-option-move svg * {
  fill: #c8ccd2 !important;
  stroke: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option .prod-option-title,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option .edit-option-title {
  grid-column: 2 !important;
  min-width: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option .prod-option-price,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option .edit-option-price {
  grid-column: 3 !important;
  justify-self: stretch !important;
  width: var(--cl-option-price-w) !important;
  min-width: var(--cl-option-price-w) !important;
  max-width: var(--cl-option-price-w) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option .prod-option-price {
  justify-content: flex-end !important;
  padding-right: 12px !important;
  text-align: right !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option .prod-option-quantity,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option .edit-option-quantity {
  width: var(--cl-option-quantity-w) !important;
  min-width: var(--cl-option-quantity-w) !important;
  max-width: var(--cl-option-quantity-w) !important;
  justify-self: stretch !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option .prod-option-quantity,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option .edit-option-quantity {
  grid-column: 4 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option .prod-option-status,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option .edit-option-select {
  grid-column: 5 !important;
  justify-self: stretch !important;
  width: var(--cl-option-status-w) !important;
  min-width: var(--cl-option-status-w) !important;
  max-width: var(--cl-option-status-w) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .option-head .plus-quantity,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .option-head .plus-status,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option .prod-option-quantity,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option .prod-option-status,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option .edit-option-quantity,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option .edit-option-select {
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .option-head:not(:has(.plus-quantity.hide)) .plus-quantity {
  justify-self: center !important;
  padding-right: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option:not([data-option_mode="additional"]) > .option-head:has(.plus-quantity.hide) .plus-status {
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option:not([data-option_mode="additional"]) > .prod-option-list > li > .prod-option-item:not(.hide):is(:has(> .prod-option-quantity[style*="display:none"]), :has(> .prod-option-quantity[style*="display: none"])),
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option:not([data-option_mode="additional"]) > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap:is(:has(> .edit-option-quantity[style*="display:none"]), :has(> .edit-option-quantity[style*="display: none"])) {
  grid-template-columns: var(--cl-option-grid-no-stock) !important;
  max-width: var(--cl-option-row-w) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option:not([data-option_mode="additional"]) > .prod-option-list > li > .prod-option-item:not(.hide):is(:has(> .prod-option-quantity[style*="display:none"]), :has(> .prod-option-quantity[style*="display: none"])) .prod-option-status,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option:not([data-option_mode="additional"]) > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap:is(:has(> .edit-option-quantity[style*="display:none"]), :has(> .edit-option-quantity[style*="display: none"])) .edit-option-select {
  grid-column: 4 !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option[data-option_mode="additional"] > .prod-option-list > li > .prod-option-item:not(.hide),
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option[data-option_mode="additional"] > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap {
  grid-template-columns: var(--cl-option-grid-stock) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option[data-option_mode="text"] > .prod-option-list > li > .prod-option-item:not(.hide),
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option[data-option_mode="text"] > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap {
  grid-template-columns: var(--cl-option-grid-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option[data-option_mode="text"] .prod-option-title,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option[data-option_mode="text"] .edit-option-title {
  grid-column: 2;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option[data-option_mode="text"] .prod-option-require {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option .edit-option-delete {
  position: absolute !important;
  top: 0 !important;
  right: -42px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 32px !important;
  height: 46px !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #e5484d !important;
  fill: currentColor !important;
  line-height: 1 !important;
  cursor: pointer !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option .edit-option-delete.hide {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option .edit-option-delete.invisible {
  visibility: hidden !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-list > li:hover .edit-option-delete:not(.hide):not(.invisible),
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-list > li:focus-within .edit-option-delete:not(.hide):not(.invisible) {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap:has(> .edit-option-delete:not(.hide):not(.invisible)) {
  padding-right: 0 !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-list > li > .prod-option-item:not(.hide):has(> .edit-option-delete:not(.hide):not(.invisible)) {
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option .edit-option-delete:hover {
  color: #e5484d !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option .edit-option-delete svg {
  display: block !important;
  width: 12px !important;
  height: 13px !important;
  margin: 0 !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option .edit-option-delete::before {
  content: "삭제";
  position: absolute;
  left: 50%;
  bottom: calc(50% + 12px);
  z-index: 60;
  display: block;
  padding: 5px 9px;
  border: 1px solid #dbdcdf;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 2px 6px rgba(34, 36, 40, .12);
  color: #222428;
  font-size: 12px;
  font-weight: 500;
  line-height: 16px;
  white-space: nowrap;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateX(-50%);
  transition: opacity .12s ease, visibility .12s ease;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option .edit-option-delete::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: calc(50% + 8px);
  z-index: 61;
  display: block;
  width: 8px;
  height: 8px;
  border-right: 1px solid #dbdcdf;
  border-bottom: 1px solid #dbdcdf;
  background: #fff;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateX(-50%) rotate(45deg);
  transition: opacity .12s ease, visibility .12s ease;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option .edit-option-delete:hover::before,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option .edit-option-delete:hover::after,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option .edit-option-delete:focus::before,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option .edit-option-delete:focus::after {
  opacity: 1;
  visibility: visible;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option .prod-option-item > span {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 0;
  height: 46px;
  margin: 0 !important;
  padding: 0 8px !important;
  overflow: hidden;
  color: #222428 !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  text-align: center !important;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option .prod-option-item > .prod-option-title {
  justify-content: flex-start !important;
  width: calc(100% - 8px) !important;
  height: 34px !important;
  padding: 0 8px 0 4px !important;
  box-sizing: border-box !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option .prod-option-item > .prod-option-price {
  position: relative !important;
  justify-content: flex-end !important;
  height: 34px !important;
  padding: 0 25px 0 8px !important;
  box-sizing: border-box !important;
  text-align: right !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option .prod-option-price::before {
  content: none !important;
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option .prod-option-price.minus::before {
  content: "-" !important;
  display: inline-block !important;
  margin-right: 1px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option .prod-option-price::after {
  content: "원" !important;
  position: absolute !important;
  top: 50% !important;
  right: 9px !important;
  display: inline-block !important;
  margin-left: 0 !important;
  transform: translateY(-50%) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option .prod-option-item > .prod-option-quantity {
  display: grid !important;
  grid-template-columns: 44px auto !important;
  column-gap: 3px !important;
  align-items: center !important;
  justify-content: center !important;
  height: 34px !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  text-align: right !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option .prod-option-quantity::after {
  content: "개" !important;
  display: inline-block !important;
  margin-left: 0 !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option .prod-option-item > .prod-option-status {
  width: calc(100% - 8px) !important;
  height: 34px !important;
  padding: 0 14px 0 4px !important;
  box-sizing: border-box !important;
  justify-content: center !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap > .form-group {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  width: auto !important;
  min-width: 0 !important;
  height: 46px !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap > .edit-option-price {
  width: var(--cl-option-price-w) !important;
  min-width: var(--cl-option-price-w) !important;
  max-width: var(--cl-option-price-w) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap > .edit-option-quantity {
  width: var(--cl-option-quantity-w) !important;
  min-width: var(--cl-option-quantity-w) !important;
  max-width: var(--cl-option-quantity-w) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap:not(:is(:has(> .edit-option-quantity[style*="display:none"]), :has(> .edit-option-quantity[style*="display: none"]))) > .edit-option-quantity {
  justify-content: center !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap > .edit-option-select {
  width: var(--cl-option-status-w) !important;
  min-width: var(--cl-option-status-w) !important;
  max-width: var(--cl-option-status-w) !important;
  justify-content: center !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-list > li > .prod-option-item:not(.hide) > .prod-option-title {
  grid-column: 2 !important;
  justify-self: stretch !important;
  align-self: center !important;
  min-width: 0 !important;
  max-width: none !important;
  overflow: hidden !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap > .edit-option-title {
  grid-column: 2 !important;
  justify-self: stretch !important;
  align-self: center !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  overflow: hidden !important;
  flex: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap > .edit-option-price,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap > .edit-option-quantity,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap > .edit-option-select {
  align-self: center !important;
  margin: 0 !important;
  padding: 0 !important;
  flex: none !important;
  float: none !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option:not([data-option_mode="additional"]) > .prod-option-list > li > .prod-option-item:not(.hide) > .prod-option-quantity[style*="display:none"],
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option:not([data-option_mode="additional"]) > .prod-option-list > li > .prod-option-item:not(.hide) > .prod-option-quantity[style*="display: none"],
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option:not([data-option_mode="additional"]) > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap > .edit-option-quantity[style*="display:none"],
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option:not([data-option_mode="additional"]) > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap > .edit-option-quantity[style*="display: none"] {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-list > li > .prod-option-edit:not(.hide) input {
  width: 100% !important;
  height: 34px !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 8px !important;
  border: 0 !important;
  border-radius: 3px !important;
  background: transparent !important;
  color: #222428 !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 34px !important;
  outline: 0 !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-list > li > .prod-option-edit:not(.hide) .edit-option-title input {
  flex: 0 1 auto !important;
  width: calc(100% - 8px) !important;
  min-width: 0 !important;
  max-width: calc(100% - 8px) !important;
  padding-left: 4px !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option[data-option_mode="text"] .prod-option-item > .prod-option-title,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option[data-option_mode="text"] > .prod-option-list > li > .prod-option-edit:not(.hide) .edit-option-title input {
  width: calc(100% - 8px) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-list > li > .prod-option-edit:not(.hide) input:hover,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-list > li > .prod-option-edit:not(.hide) input:focus {
  background: #f4f5f8 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-list > li > .prod-option-edit:not(.hide) .edit-option-price input,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-list > li > .prod-option-edit:not(.hide) .edit-option-quantity input {
  padding-right: 25px !important;
  text-align: right !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-list > li > .prod-option-edit:not(.hide) .edit-option-price::after,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-list > li > .prod-option-edit:not(.hide) .edit-option-quantity::after {
  position: absolute;
  top: 50%;
  right: 9px;
  color: #222428;
  font-size: 14px;
  line-height: 18px;
  transform: translateY(-50%);
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-list > li > .prod-option-edit:not(.hide) .edit-option-price::after {
  content: "원";
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-list > li > .prod-option-edit:not(.hide) .edit-option-quantity::after {
  content: "개";
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap:not(:is(:has(> .edit-option-quantity[style*="display:none"]), :has(> .edit-option-quantity[style*="display: none"]))) .edit-option-quantity input {
  flex: 0 1 auto !important;
  width: 44px !important;
  min-width: 44px !important;
  max-width: 44px !important;
  padding: 0 !important;
  background: transparent !important;
  text-align: right !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap:not(:is(:has(> .edit-option-quantity[style*="display:none"]), :has(> .edit-option-quantity[style*="display: none"]))) .edit-option-quantity input:hover,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap:not(:is(:has(> .edit-option-quantity[style*="display:none"]), :has(> .edit-option-quantity[style*="display: none"]))) .edit-option-quantity input:focus {
  background: #f4f5f8 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap:not(:is(:has(> .edit-option-quantity[style*="display:none"]), :has(> .edit-option-quantity[style*="display: none"]))) .edit-option-quantity::after {
  position: static !important;
  display: inline-block !important;
  flex: 0 0 auto !important;
  margin-left: 3px !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option[data-option_mode="additional"] > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap .edit-option-quantity {
  display: grid !important;
  grid-template-columns: 44px auto !important;
  column-gap: 2px !important;
  align-items: center !important;
  justify-content: end !important;
  justify-items: end !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option[data-option_mode="additional"] > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap .edit-option-quantity input {
  flex: 0 1 auto !important;
  width: 44px !important;
  min-width: 44px !important;
  max-width: 44px !important;
  padding: 0 !important;
  background: transparent !important;
  text-align: right !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option[data-option_mode="additional"] > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap .edit-option-quantity input:hover,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option[data-option_mode="additional"] > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap .edit-option-quantity input:focus {
  background: #f4f5f8 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option[data-option_mode="additional"] > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap .edit-option-quantity::after {
  position: static !important;
  display: inline-block !important;
  flex: 0 0 auto !important;
  margin-left: 0 !important;
  justify-self: start !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .option-head:not(:has(.plus-quantity.hide)) .plus-quantity:not(.hide) {
  justify-content: flex-end !important;
  justify-self: stretch !important;
  padding: 0 17px 0 0 !important;
  text-align: right !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-list > li > .prod-option-item:not(.hide) > .prod-option-quantity:not([style*="display:none"]):not([style*="display: none"]) {
  display: grid !important;
  grid-template-columns: 44px auto !important;
  column-gap: 2px !important;
  align-items: center !important;
  justify-content: end !important;
  justify-items: end !important;
  width: var(--cl-option-quantity-w) !important;
  min-width: var(--cl-option-quantity-w) !important;
  max-width: var(--cl-option-quantity-w) !important;
  padding: 0 17px 0 0 !important;
  box-sizing: border-box !important;
  text-align: right !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-list > li > .prod-option-item:not(.hide) > .prod-option-quantity:not([style*="display:none"]):not([style*="display: none"])::after {
  flex: 0 0 auto !important;
  margin-left: 0 !important;
  justify-self: start !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap:not(:is(:has(> .edit-option-quantity[style*="display:none"]), :has(> .edit-option-quantity[style*="display: none"]))) > .edit-option-quantity {
  display: grid !important;
  grid-template-columns: 44px auto !important;
  column-gap: 2px !important;
  align-items: center !important;
  justify-content: end !important;
  justify-items: end !important;
  width: var(--cl-option-quantity-w) !important;
  min-width: var(--cl-option-quantity-w) !important;
  max-width: var(--cl-option-quantity-w) !important;
  padding: 0 17px 0 0 !important;
  box-sizing: border-box !important;
  text-align: right !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap:not(:is(:has(> .edit-option-quantity[style*="display:none"]), :has(> .edit-option-quantity[style*="display: none"]))) > .edit-option-quantity::after {
  flex: 0 0 auto !important;
  margin-left: 0 !important;
  justify-self: start !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option .option-price-status-str {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: calc(100% - 8px) !important;
  height: 34px !important;
  padding: 0 14px 0 4px !important;
  border-radius: 3px !important;
  background: transparent !important;
  box-sizing: border-box !important;
  color: #222428 !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 34px !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option .option-price-status-str:hover,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option .option-price-status-str.open {
  background: #f4f5f8 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option .option-price-status-str::after {
  content: "" !important;
  position: absolute !important;
  top: 50% !important;
  right: 7px !important;
  width: 0 !important;
  height: 0 !important;
  margin-top: -2px !important;
  padding: 0 !important;
  border-top: 4px solid currentColor !important;
  border-right: 4px solid transparent !important;
  border-left: 4px solid transparent !important;
  font-family: inherit !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option .option-price-status-select {
  position: absolute !important;
  top: 46px !important;
  right: 0 !important;
  left: auto !important;
  z-index: 20 !important;
  display: none;
  width: 72px !important;
  margin: 0 !important;
  padding: 6px 0 !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 6px !important;
  background: #fff !important;
  box-shadow: 0 8px 22px rgba(20, 24, 32, .12);
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option .option-price-status-select > li {
  height: 30px !important;
  margin: 0 !important;
  padding: 0 12px !important;
  color: #222428 !important;
  font-size: 13px !important;
  line-height: 30px !important;
  text-align: left !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option .option-price-status-select > li:hover {
  background: #eaf9f1 !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-add {
  position: relative !important;
  z-index: 2 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  float: none !important;
  width: 100% !important;
  max-width: var(--cl-option-row-w) !important;
  min-height: 24px !important;
  margin: 2px 0 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: var(--cl-green-text) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 20px !important;
  text-align: right !important;
  cursor: pointer !important;
  pointer-events: auto !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-add.hide {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option:has(> .option-head .plus-quantity.hide) > .prod-option-add {
  max-width: var(--cl-option-row-w) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-add > span {
  order: 2;
  margin: 0 !important;
  vertical-align: baseline !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-add > svg {
  order: 1;
  flex: 0 0 13px;
  width: 13px !important;
  height: 13px !important;
  margin: 0 7px 0 0 !important;
  fill: currentColor !important;
  vertical-align: baseline !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab .prod-option > .prod-option-add.disabled {
  color: #b4b8bf !important;
  cursor: default !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option {
  --cl-option-title-grid-2: minmax(0, 1fr) minmax(0, 1fr);
  --cl-option-title-grid-3: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
  --cl-option-advanced-grid-stock-2: var(--cl-option-title-grid-2) var(--cl-option-price-w) var(--cl-option-quantity-w) var(--cl-option-status-w);
  --cl-option-advanced-grid-stock-3: var(--cl-option-title-grid-3) var(--cl-option-price-w) var(--cl-option-quantity-w) var(--cl-option-status-w);
  --cl-option-advanced-grid-no-stock-2: var(--cl-option-title-grid-2) var(--cl-option-price-w) var(--cl-option-status-w);
  --cl-option-advanced-grid-no-stock-3: var(--cl-option-title-grid-3) var(--cl-option-price-w) var(--cl-option-status-w);
  --cl-option-grid-text: minmax(0, 1fr);
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option .prod-option-move {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"] > .option-head-title {
  font-size: 14px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"] > .option-head-title .option-head-str {
  color: #696c71 !important;
  font-size: 14px !important;
  font-weight: 600 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"] > .option-head-title .option-head-str::before {
  content: none !important;
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option > .option-head-title,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="text"]::before {
  position: absolute !important;
  top: 30px !important;
  left: 0 !important;
  display: flex !important;
  align-items: center !important;
  width: var(--cl-product-label-width, 132px) !important;
  min-height: 48px !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #696c71 !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 18px !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"] > .option-head,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="additional"] > .option-head,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"] > .prod-option-list > li > .prod-option-item:not(.hide),
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"] > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="additional"] > .prod-option-list > li > .prod-option-item:not(.hide),
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="additional"] > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap {
  grid-template-columns: var(--cl-option-advanced-grid-stock-2) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"] > .option-head:has(.option-type-title.tp3:not(:empty)) {
  grid-template-columns: var(--cl-option-advanced-grid-stock-3) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"] > .option-head:has(.plus-quantity.hide),
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"] > .prod-option-list > li > .prod-option-item:not(.hide):is(:has(> .prod-option-quantity[style*="display:none"]), :has(> .prod-option-quantity[style*="display: none"])),
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"] > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap:is(:has(> .edit-option-quantity[style*="display:none"]), :has(> .edit-option-quantity[style*="display: none"])) {
  grid-template-columns: var(--cl-option-advanced-grid-no-stock-2) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"] > .option-head:has(.plus-quantity.hide):has(.option-type-title.tp3:not(:empty)) {
  grid-template-columns: var(--cl-option-advanced-grid-no-stock-3) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="text"] > .option-head,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="text"] > .prod-option-list > li > .prod-option-item:not(.hide),
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="text"] > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap {
  grid-template-columns: var(--cl-option-grid-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"] > .option-head .option-type-title.tp1,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="additional"] > .option-head .option-type-title3.tp1,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="text"] > .option-head .option-type-title3.tp1,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option .prod-option-title,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option .edit-option-title {
  grid-column: 1 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"] > .option-head .option-type-title.tp2:not(.hide),
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="additional"] > .option-head .option-type-title3.tp2:not(.hide) {
  grid-column: 2 !important;
  display: block !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"] > .option-head .option-type-title.tp3:not(.hide) {
  grid-column: 3 !important;
  display: block !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"] > .option-head .option-type-title.tp2.hide,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"] > .option-head .option-type-title.tp3.hide,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="additional"] > .option-head .option-type-title3.tp2.hide {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"] > .option-head .option-type-title.tp3:empty {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"] > .option-head > div,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="additional"] > .option-head > div {
  grid-column: 3 / 6 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"] > .option-head:has(.option-type-title.tp3:not(:empty)) > div {
  grid-column: 4 / 7 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"] > .option-head:has(.plus-quantity.hide) > div {
  grid-column: 3 / 5 !important;
  grid-template-columns: var(--cl-option-head-tail-no-stock) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"] > .option-head:has(.plus-quantity.hide):has(.option-type-title.tp3:not(:empty)) > div {
  grid-column: 4 / 6 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="additional"] > .option-head:has(.plus-quantity.hide),
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="additional"] > .prod-option-list > li > .prod-option-item:not(.hide):is(:has(> .prod-option-quantity[style*="display:none"]), :has(> .prod-option-quantity[style*="display: none"])),
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="additional"] > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap:is(:has(> .edit-option-quantity[style*="display:none"]), :has(> .edit-option-quantity[style*="display: none"])) {
  grid-template-columns: var(--cl-option-advanced-grid-no-stock-2) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="additional"] > .option-head:has(.plus-quantity.hide) > div {
  grid-column: 3 / 5 !important;
  grid-template-columns: var(--cl-option-head-tail-no-stock) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"] .prod-option-title:has(> .owidth),
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="additional"] .prod-option-title:has(> .owidth),
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"] .edit-option-title:has(> .owidth),
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="additional"] .edit-option-title:has(> .owidth) {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option .prod-option-title > .owidth,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option .edit-option-title > .owidth {
  display: block !important;
  flex: 1 1 0 !important;
  min-width: 0 !important;
  width: auto !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"] .prod-option-title:has(> .owidth),
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"] .edit-option-title:has(> .owidth) {
  grid-column: 1 / 3 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="additional"] .prod-option-title,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="additional"] .edit-option-title {
  grid-column: 1 / 3 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"] .prod-option-price,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"] .edit-option-price,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="additional"] .prod-option-price,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="additional"] .edit-option-price {
  grid-column: 3 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"] .prod-option-quantity,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"] .edit-option-quantity,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="additional"] .prod-option-quantity,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="additional"] .edit-option-quantity {
  grid-column: 4 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"] .prod-option-status,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"] .edit-option-select,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="additional"] .prod-option-status,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="additional"] .edit-option-select {
  grid-column: 5 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"] > .prod-option-list > li > .prod-option-item:not(.hide):is(:has(> .prod-option-quantity[style*="display:none"]), :has(> .prod-option-quantity[style*="display: none"])) .prod-option-status,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"] > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap:is(:has(> .edit-option-quantity[style*="display:none"]), :has(> .edit-option-quantity[style*="display: none"])) .edit-option-select {
  grid-column: 4 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="additional"] > .prod-option-list > li > .prod-option-item:not(.hide):is(:has(> .prod-option-quantity[style*="display:none"]), :has(> .prod-option-quantity[style*="display: none"])) .prod-option-status,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="additional"] > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap:is(:has(> .edit-option-quantity[style*="display:none"]), :has(> .edit-option-quantity[style*="display: none"])) .edit-option-select {
  grid-column: 4 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="text"] .prod-option-title,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="text"] .edit-option-title {
  grid-column: 1 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"] .prod-option-title,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"] .edit-option-title {
  grid-column: 1 / 3 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"]:has(> .option-head .option-type-title.tp3:not(:empty)) > .prod-option-list > li > .prod-option-item:not(.hide),
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"]:has(> .option-head .option-type-title.tp3:not(:empty)) > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap {
  grid-template-columns: var(--cl-option-advanced-grid-stock-3) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"]:has(> .option-head .option-type-title.tp3:not(:empty)) > .prod-option-list > li > .prod-option-item:not(.hide):is(:has(> .prod-option-quantity[style*="display:none"]), :has(> .prod-option-quantity[style*="display: none"])),
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"]:has(> .option-head .option-type-title.tp3:not(:empty)) > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap:is(:has(> .edit-option-quantity[style*="display:none"]), :has(> .edit-option-quantity[style*="display: none"])) {
  grid-template-columns: var(--cl-option-advanced-grid-no-stock-3) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"]:has(> .option-head .option-type-title.tp3:not(:empty)) .prod-option-title,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"]:has(> .option-head .option-type-title.tp3:not(:empty)) .edit-option-title {
  grid-column: 1 / 4 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"]:has(> .option-head .option-type-title.tp3:not(:empty)) .prod-option-price,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"]:has(> .option-head .option-type-title.tp3:not(:empty)) .edit-option-price {
  grid-column: 4 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"]:has(> .option-head .option-type-title.tp3:not(:empty)) .prod-option-quantity,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"]:has(> .option-head .option-type-title.tp3:not(:empty)) .edit-option-quantity {
  grid-column: 5 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"]:has(> .option-head .option-type-title.tp3:not(:empty)) .prod-option-status,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"]:has(> .option-head .option-type-title.tp3:not(:empty)) .edit-option-select {
  grid-column: 6 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"]:has(> .option-head .option-type-title.tp3:not(:empty)) > .prod-option-list > li > .prod-option-item:not(.hide):is(:has(> .prod-option-quantity[style*="display:none"]), :has(> .prod-option-quantity[style*="display: none"])) .prod-option-status,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"]:has(> .option-head .option-type-title.tp3:not(:empty)) > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap:is(:has(> .edit-option-quantity[style*="display:none"]), :has(> .edit-option-quantity[style*="display: none"])) .edit-option-select {
  grid-column: 5 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"] > .prod-option-list > li:has(> .product-status) > .product-status {
  padding-left: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap > .form-group.edit-option-title {
  align-self: center !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 32px !important;
  min-height: 32px !important;
  margin: 4px 0 !important;
  padding: 0 12px !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  background: transparent !important;
  line-height: 32px !important;
  text-align: left !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"] > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap > .form-group.edit-option-title.option-combination,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"] > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap > .form-group.edit-option-title:has(> .owidth),
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="additional"] > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap > .form-group.edit-option-title.option-combination,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="additional"] > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap > .form-group.edit-option-title:has(> .owidth) {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap > .form-group.edit-option-title > .owidth {
  flex: 1 1 0 !important;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap > .form-group.edit-option-title input {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 32px !important;
  padding: 0 !important;
  background: transparent !important;
  font-size: 15px !important;
  line-height: 32px !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"] > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap > .form-group.edit-option-price,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="additional"] > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap > .form-group.edit-option-price {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  column-gap: 5px !important;
  align-items: center !important;
  width: var(--cl-option-price-w) !important;
  min-width: var(--cl-option-price-w) !important;
  max-width: var(--cl-option-price-w) !important;
  height: 32px !important;
  margin: 4px 0 4px 4px !important;
  padding: 0 10px 0 0 !important;
  box-sizing: border-box !important;
  line-height: 32px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"] > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap > .form-group.edit-option-quantity,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="additional"] > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap > .form-group.edit-option-quantity {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  column-gap: 5px !important;
  align-items: center !important;
  width: var(--cl-option-quantity-w) !important;
  min-width: var(--cl-option-quantity-w) !important;
  max-width: var(--cl-option-quantity-w) !important;
  height: 32px !important;
  margin: 4px 0 4px 4px !important;
  padding: 0 12px 0 0 !important;
  box-sizing: border-box !important;
  line-height: 32px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"] > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap > .form-group.edit-option-price input,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"] > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap > .form-group.edit-option-quantity input,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="additional"] > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap > .form-group.edit-option-price input,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="additional"] > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap > .form-group.edit-option-quantity input {
  width: 100% !important;
  min-width: 0 !important;
  height: 32px !important;
  padding: 0 !important;
  font-size: 15px !important;
  line-height: 32px !important;
  text-align: right !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"] > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap > .form-group.edit-option-price::after,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="normal"] > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap > .form-group.edit-option-quantity::after,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="additional"] > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap > .form-group.edit-option-price::after,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option[data-option_mode="additional"] > .prod-option-list > li > .prod-option-edit:not(.hide) > .form-wrap > .form-group.edit-option-quantity::after {
  position: static !important;
  top: auto !important;
  right: auto !important;
  margin: 0 !important;
  font-size: 14px !important;
  line-height: 32px !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option .prod-option-item > .prod-option-title:hover,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option > .prod-option-list > li > .prod-option-edit:not(.hide) .edit-option-title,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option > .prod-option-list > li > .prod-option-edit:not(.hide) .edit-option-title:hover,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option > .prod-option-list > li > .prod-option-edit:not(.hide) .edit-option-title input,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option > .prod-option-list > li > .prod-option-edit:not(.hide) .edit-option-title input:hover,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .prod-option-tab.advanced-mode .prod-option > .prod-option-list > li > .prod-option-edit:not(.hide) .edit-option-title input:focus {
  background: transparent !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-product-option-delete-confirm) {
  position: fixed !important;
  inset: 0 !important;
  z-index: 1000003 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100vw !important;
  height: 100vh !important;
  padding: 24px !important;
  overflow: auto !important;
  background: rgba(0, 0, 0, .45) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-product-option-delete-confirm) + .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-product-option-delete-confirm) + .modal-backdrop.fade,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-product-option-delete-confirm) + .modal-backdrop.in {
  display: none !important;
  opacity: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default:has(.modal-dialog.cl-product-option-delete-confirm) {
  position: static !important;
  inset: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: auto !important;
  min-height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default:has(.modal-dialog.cl-product-option-delete-confirm) > .cl-mobile-btn.close {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-product-option-delete-confirm {
  width: calc(100vw - 48px) !important;
  max-width: 420px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  border: 0 !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-product-option-delete-confirm .modal-content {
  position: relative;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  overflow: visible !important;
  padding: 30px 32px 26px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: var(--cl-radius-lg) !important;
  box-shadow: 0 24px 64px rgba(0, 0, 0, .28) !important;
  color: var(--cl-text) !important;
  font-family: var(--cl-source-font) !important;
  letter-spacing: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-product-option-delete-confirm .modal-content > .modal-body,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-product-option-delete-confirm .modal-content > .modal-footer {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  margin-right: auto !important;
  margin-left: auto !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-product-option-delete-confirm .modal-body {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  color: var(--cl-text-sub) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 22px !important;
  letter-spacing: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-product-option-delete-confirm .modal-title {
  margin: 0 32px 10px !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-size: 20px !important;
  font-weight: 800 !important;
  line-height: 28px !important;
  letter-spacing: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-product-option-delete-confirm .product-option-delete-message {
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 22px !important;
  letter-spacing: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-product-option-delete-confirm .modal-content > .close.close-button-dialog {
  position: absolute !important;
  top: 18px !important;
  right: 18px !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub) !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-product-option-delete-confirm .modal-content > .close.close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-product-option-delete-confirm .modal-content > .close.close-button-dialog:focus {
  background: #f1f2f5 !important;
  color: var(--cl-text) !important;
  outline: 0 !important;
  transform: rotate(90deg) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-product-option-delete-confirm .modal-content > .close.close-button-dialog svg {
  display: block;
  width: 9px !important;
  height: 9px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-product-option-delete-confirm .modal-footer {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  gap: 10px !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 24px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-product-option-delete-confirm .modal-footer::before,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-product-option-delete-confirm .modal-footer::after {
  display: none !important;
  content: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-product-option-delete-confirm .modal-footer > .btn {
  float: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 44px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  border-radius: 9px !important;
  box-shadow: none !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-product-option-delete-confirm .modal-footer > .btn + .btn {
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-product-option-delete-confirm .modal-footer .ok-button-dialog,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-product-option-delete-confirm .modal-footer .ok-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-product-option-delete-confirm .modal-footer .ok-button-dialog:focus {
  order: 1;
  background: var(--cl-danger) !important;
  border: 1px solid var(--cl-danger) !important;
  color: #fff !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-product-option-delete-confirm .modal-footer .close-button-dialog {
  order: 2;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-download-limit-alert) {
  position: fixed !important;
  inset: 0 !important;
  z-index: 1000003 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100vw !important;
  height: 100vh !important;
  padding: 24px !important;
  overflow: auto !important;
  background: rgba(0, 0, 0, .45) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-download-limit-alert) + .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-download-limit-alert) + .modal-backdrop.fade,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-download-limit-alert) + .modal-backdrop.in {
  display: none !important;
  opacity: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default:has(.modal-dialog.cl-download-limit-alert) {
  position: static !important;
  inset: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: auto !important;
  min-height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default:has(.modal-dialog.cl-download-limit-alert) > .cl-mobile-btn.close {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-download-limit-alert {
  width: calc(100vw - 48px) !important;
  max-width: 420px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  border: 0 !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-download-limit-alert .modal-content {
  position: relative;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  overflow: visible !important;
  padding: 34px 32px 28px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border, #e5e7eb) !important;
  border-radius: var(--cl-radius-lg, 14px) !important;
  box-shadow: 0 24px 64px rgba(0, 0, 0, .28) !important;
  color: var(--cl-text, #222428) !important;
  font-family: var(--cl-source-font) !important;
  letter-spacing: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-download-limit-alert .modal-content > .modal-body,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-download-limit-alert .modal-content > .modal-footer {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  margin-right: auto !important;
  margin-left: auto !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-download-limit-alert .modal-body {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  color: var(--cl-text-sub, #696c71) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 22px !important;
  letter-spacing: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-download-limit-alert .modal-title {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-download-limit-alert .download-limit-alert-message {
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text-sub, #696c71) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 22px !important;
  letter-spacing: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-download-limit-alert .modal-content > .close.close-button-dialog {
  position: absolute !important;
  top: 18px !important;
  right: 18px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub, #696c71) !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-download-limit-alert .modal-content > .close.close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-download-limit-alert .modal-content > .close.close-button-dialog:focus {
  background: #f1f2f5 !important;
  color: var(--cl-text, #222428) !important;
  outline: 0 !important;
  transform: rotate(90deg) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-download-limit-alert .modal-content > .close.close-button-dialog svg {
  display: block;
  width: 9px !important;
  height: 9px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-download-limit-alert .modal-footer {
  display: flex !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 24px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-download-limit-alert .modal-footer::before,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-download-limit-alert .modal-footer::after {
  display: none !important;
  content: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-download-limit-alert .modal-footer > .btn,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-download-limit-alert .modal-footer > .btn:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-download-limit-alert .modal-footer > .btn:focus {
  float: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 44px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  background: var(--cl-green, #03C75A) !important;
  border: 1px solid var(--cl-green, #03C75A) !important;
  border-radius: 9px !important;
  box-shadow: none !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-download-limit-alert .modal-footer > .btn:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-download-limit-alert .modal-footer > .btn:focus {
  background: var(--cl-green-hover, #02b351) !important;
  border-color: var(--cl-green-hover, #02b351) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .cl-prod-info {
  display: none;
  position: absolute !important;
  z-index: 9999 !important;
  width: 360px;
  max-height: none;
  overflow: visible;
  padding: 10px 15px;
  background: #fff;
  border: 1px solid #b1b3b7;
  border-radius: 3px;
  box-shadow: none;
  color: #222428;
  font-family: var(--cl-source-font);
  font-size: 12px;
  font-weight: 300;
  line-height: 1.5;
  letter-spacing: -.4px;
  text-align: left;
  word-break: keep-all;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .cl-prod-info::after {
  content: "";
  position: absolute;
  left: calc(50% - 5px);
  bottom: -4px;
  display: inline-block;
  width: 8px;
  height: 8px;
  background: #fff;
  border-right: 1px solid #b1b3b7 !important;
  border-bottom: 1px solid #b1b3b7 !important;
  border-left: 1px solid transparent !important;
  border-top: 0 !important;
  transform: rotate(45deg);
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .cl-prod-info > div {
  overflow: hidden;
  margin-bottom: 15px;
  line-height: 1.5;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .cl-prod-info > div:last-child {
  margin-bottom: 0;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .cl-prod-info > div > span {
  float: left;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .cl-prod-info > div > div {
  float: left;
  width: calc(100% - 10px);
  margin-left: 3px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #status-product-box .cl-prod-info.status-info {
  top: auto !important;
  right: auto !important;
  bottom: calc(100% - 2px) !important;
  left: -117px !important;
  z-index: 9999 !important;
  width: 360px !important;
  max-height: none !important;
  overflow: visible !important;
  padding: 10px 15px !important;
  background: #fff !important;
  border: 1px solid #b1b3b7 !important;
  border-radius: 3px !important;
  box-shadow: none !important;
  color: #222428 !important;
  font-family: var(--cl-source-font) !important;
  font-size: 12px !important;
  font-weight: 300 !important;
  line-height: 1.5 !important;
  letter-spacing: -.4px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .form-wrap.option-toggle .cl-prod-info.option-info {
  top: auto !important;
  right: auto !important;
  bottom: calc(100% - 2px) !important;
  left: -143px !important;
  z-index: 9999 !important;
  width: 360px !important;
  max-height: none !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #status-product-box .cl-prod-info.status-info::after {
  top: auto !important;
  right: auto !important;
  bottom: -4px !important;
  left: calc(50% - 5px) !important;
  display: inline-block !important;
  width: 8px !important;
  height: 8px !important;
  background: #fff !important;
  border-top: 0 !important;
  border-right: 1px solid #b1b3b7 !important;
  border-bottom: 1px solid #b1b3b7 !important;
  border-left: 1px solid transparent !important;
  transform: rotate(45deg) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .form-wrap.option-toggle .cl-prod-info.option-info::after {
  top: auto !important;
  right: auto !important;
  bottom: -4px !important;
  left: calc(50% - 5px) !important;
  display: inline-block !important;
  width: 8px !important;
  height: 8px !important;
  background: #fff !important;
  border-top: 0 !important;
  border-right: 1px solid #b1b3b7 !important;
  border-bottom: 1px solid #b1b3b7 !important;
  border-left: 1px solid transparent !important;
  transform: rotate(45deg) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > .form-wrap.delivery-template .option-delivery-template-str {
  position: relative !important;
  display: block !important;
  flex: 0 0 230px !important;
  width: 230px !important;
  min-width: 230px !important;
  max-width: 230px !important;
  height: 40px !important;
  margin: 0 !important;
  padding: 0 34px 0 10px !important;
  overflow: hidden !important;
  border: 1px solid #dbdcdf !important;
  border-radius: 5px !important;
  background: #fff !important;
  color: #222428 !important;
  font-size: 15px !important;
  font-weight: 400 !important;
  line-height: 38px !important;
  text-align: left !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  word-break: keep-all !important;
  box-sizing: border-box !important;
  cursor: pointer !important;
  float: none !important;
  clear: none !important;
}

@media (max-width: 415px) {
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > .form-wrap.delivery-template .option-delivery-template-str {
    flex: 1 1 0 !important;
    width: auto !important;
    min-width: 0 !important;
  }
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > .form-wrap.delivery-template .option-delivery-template-str + .custom-caret {
  position: relative !important;
  top: auto !important;
  right: 24px !important;
  flex: 0 0 16px !important;
  width: 16px !important;
  height: 16px !important;
  margin: 0 -16px 0 0 !important;
  color: #222428 !important;
  cursor: pointer !important;
  line-height: 16px !important;
  text-align: center !important;
  z-index: 2 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > .form-wrap.delivery-template .option-delivery-template-str + .custom-caret::before {
  content: "";
  display: inline-block;
  width: 0;
  height: 0;
  border-top: 4px solid currentColor;
  border-right: 4px solid transparent;
  border-left: 4px solid transparent;
  vertical-align: middle;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > .form-wrap.delivery-template .form-group:has(> .option-delivery-template-str + .custom-caret:hover) > .option-delivery-template-str:not(.open) {
  border-color: #cdefdd !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > .form-wrap.delivery-template .option-delivery-template-str.open + .custom-caret {
  top: auto !important;
  color: #03C75A !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > .form-wrap.delivery-template .option-delivery-template-str.open + .custom-caret::before {
  border-top: 0 !important;
  border-bottom: 4px solid currentColor !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > .form-wrap.delivery-template .option-delivery-template-str + .custom-caret svg {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > .form-wrap.delivery-template > .form-group {
  position: relative !important;
  display: flex !important;
  flex-wrap: var(--cl-product-row-wrap, nowrap) !important;
  align-items: center !important;
  width: 100% !important;
  min-width: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > .form-wrap.delivery-template .form-label {
  flex: 0 0 var(--cl-product-label-width, 132px) !important;
  width: var(--cl-product-label-width, 132px) !important;
  min-width: var(--cl-product-label-width, 132px) !important;
  max-width: var(--cl-product-label-width, 132px) !important;
  margin: var(--cl-product-label-margin, 0 20px 0 0) !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > .form-wrap.delivery-template .option-delivery-template-str .template-name,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > .form-wrap.delivery-template .option-delivery-template-str .template-desc {
  position: static !important;
  display: inline !important;
  float: none !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  color: inherit !important;
  font-size: inherit !important;
  line-height: inherit !important;
  text-align: left !important;
  white-space: nowrap !important;
  word-break: keep-all !important;
  vertical-align: baseline !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > .form-wrap.delivery-template .option-delivery-template-str .template-name {
  font-weight: 500 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > .form-wrap.delivery-template .option-delivery-template-str .template-desc {
  font-weight: 400 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > .form-wrap.delivery-template .delivery-template-setting-wrap {
  flex: 0 0 auto !important;
  margin-left: var(--cl-product-delivery-action-margin, 32px) !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > .form-wrap.delivery-template .delivery-template-setting-wrap .btn-delivery-template-setting {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--cl-green-text) !important;
  fill: var(--cl-green) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 30px !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > .form-wrap.delivery-template .delivery-template-setting-wrap .btn-delivery-template-setting:hover,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > .form-wrap.delivery-template .delivery-template-setting-wrap .btn-delivery-template-setting:focus {
  color: var(--cl-green-text) !important;
  text-decoration: none !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > .form-wrap.delivery-template .delivery-template-setting-wrap .btn-delivery-template-setting svg {
  display: block !important;
  flex: 0 0 16px !important;
  width: 16px !important;
  height: 16px !important;
  margin: 0 !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > .form-wrap.delivery-template .delivery-template-list {
  position: absolute !important;
  top: 46px !important;
  right: auto !important;
  left: 152px !important;
  z-index: 80 !important;
  width: min(560px, calc(100% - 152px)) !important;
  min-width: 360px !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 8px !important;
  background: #fff !important;
  box-shadow: 0 12px 34px rgba(20, 24, 32, .17) !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > .form-wrap.delivery-template .delivery-template-list-area {
  padding: 8px 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > .form-wrap.delivery-template .option-delivery-template-select {
  max-height: 280px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > .form-wrap.delivery-template .option-delivery-template-select > li {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 18px minmax(0, 1fr) !important;
  column-gap: 8px !important;
  align-items: start !important;
  width: 100% !important;
  min-height: 42px !important;
  margin: 0 !important;
  padding: 10px 12px !important;
  background: #fff !important;
  color: #222428 !important;
  box-sizing: border-box !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > .form-wrap.delivery-template .option-delivery-template-select > li:hover,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > .form-wrap.delivery-template .option-delivery-template-select > li:has(input:checked) {
  background: #eaf9f1 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > .form-wrap.delivery-template .option-delivery-template-select > li > input[type="radio"] {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > .form-wrap.delivery-template .option-delivery-template-select > li > svg {
  grid-column: 1 !important;
  grid-row: 1 !important;
  display: block !important;
  width: 18px !important;
  height: 18px !important;
  margin: 1px 0 0 !important;
  fill: #dbdcdf !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > .form-wrap.delivery-template .option-delivery-template-select > li > input[type="radio"] + svg + svg {
  display: none !important;
  fill: #03C75A !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > .form-wrap.delivery-template .option-delivery-template-select > li > input[type="radio"]:checked + svg {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > .form-wrap.delivery-template .option-delivery-template-select > li > input[type="radio"]:checked + svg + svg {
  display: block !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > .form-wrap.delivery-template .option-delivery-template-select > li > label {
  /* 그리드가 간격을 담당하므로 레거시 left: -26px 이동을 제거한다. */
  position: static !important;
  left: auto !important;
  grid-column: 2 !important;
  grid-row: 1 !important;
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #222428 !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 18px !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > .form-wrap.delivery-template .option-delivery-template-select .template-name {
  display: block !important;
  margin: 0 !important;
  color: #222428 !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  line-height: 19px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > .form-wrap.delivery-template .option-delivery-template-select .template-desc {
  display: block !important;
  margin: 3px 0 0 !important;
  color: #8a8f98 !important;
  font-size: 12.5px !important;
  font-weight: 400 !important;
  line-height: 18px !important;
  white-space: normal !important;
  word-break: keep-all !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > #pccc-yn {
  display: flex !important;
  flex-wrap: var(--cl-product-row-wrap, nowrap) !important;
  align-items: center !important;
  min-height: 40px !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > #pccc-yn > .form-group {
  display: flex !important;
  align-items: center !important;
  flex: var(--cl-product-toggle-group-flex, 0 0 152px) !important;
  width: var(--cl-product-toggle-group-width, 152px) !important;
  min-width: var(--cl-product-toggle-group-width, 152px) !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > #pccc-yn .form-label.pccc-label {
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > #pccc-yn .form-label.pccc-label br {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > #pccc-yn .cl-icon.cl-pccc-info {
  position: static !important;
  top: auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 13px !important;
  height: 13px !important;
  margin-left: 4px !important;
  color: #03C75A !important;
  fill: currentColor !important;
  vertical-align: middle !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > #pccc-yn .cl-icon.cl-pccc-info svg {
  display: block !important;
  width: 13px !important;
  height: 13px !important;
  fill: currentColor !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > #pccc-yn > .input-switch {
  position: relative !important;
  top: auto !important;
  right: auto !important;
  flex: 0 0 auto !important;
  margin: var(--cl-product-toggle-margin, 0) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .shipping-info-section > .shipping-info-section-body > #pccc-yn .cl-prod-info.pccc-info {
  top: auto !important;
  right: auto !important;
  bottom: calc(100% + 6px) !important;
  left: -72px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .form-group:has(> .cl-prod-info),
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .check-sale:has(> .cl-prod-info),
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > #mng-prd-info .mng-prd-box:has(> .cl-prod-info),
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .prod-info-box:has(> .cl-prod-info),
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .unit-pricing-toggle .grid > div:has(> .cl-prod-info),
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .prod-option-tab .prod-option:has(> .cl-prod-info) {
  position: relative !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .cl-prod-info {
  --cl-prod-info-left: -117px;
  --cl-prod-info-width: 360px;
  --cl-prod-info-arrow-left: calc(50% - 5px);
  top: auto !important;
  right: auto !important;
  bottom: calc(100% - 2px) !important;
  left: var(--cl-prod-info-left) !important;
  width: var(--cl-prod-info-width) !important;
  max-width: min(360px, calc(100vw - 64px)) !important;
  overflow: visible !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .cl-prod-info::after {
  top: auto !important;
  right: auto !important;
  bottom: -4px !important;
  left: var(--cl-prod-info-arrow-left) !important;
  display: inline-block !important;
  width: 8px !important;
  height: 8px !important;
  background: #fff !important;
  border-top: 0 !important;
  border-right: 1px solid #b1b3b7 !important;
  border-bottom: 1px solid #b1b3b7 !important;
  border-left: 1px solid transparent !important;
  transform: rotate(45deg) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .cl-prod-info.discount-info {
  --cl-prod-info-left: -120px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .cl-prod-info.npay-button-info {
  --cl-prod-info-left: -36px;
  --cl-prod-info-width: 280px;
  bottom: calc(100% + 6px) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .cl-prod-info.unit-pricing-info {
  --cl-prod-info-left: -89px;
  --cl-prod-info-width: 300px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .cl-prod-info.basic-unit-info {
  --cl-prod-info-left: -116px;
  --cl-prod-info-width: 320px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .cl-prod-info.status-info {
  --cl-prod-info-left: -117px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .cl-prod-info.option-info {
  --cl-prod-info-left: -143px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .cl-prod-info.text-option-info {
  --cl-prod-info-left: -104px;
  --cl-prod-info-width: 320px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .cl-prod-info.prd-code-info {
  --cl-prod-info-left: -80px;
  --cl-prod-info-width: 320px;
  bottom: calc(100% - 8px) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .cl-prod-info.mng-prd-code-info {
  --cl-prod-info-left: -77px;
  --cl-prod-info-width: 320px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .cl-prod-info.pccc-info {
  --cl-prod-info-left: -72px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .cl-prod-info.culture-benefit-info {
  --cl-prod-info-left: -76px;
  --cl-prod-info-arrow-left: calc(50% - 10px);
  bottom: calc(100% - 8px) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .cl-prod-info.cl-prod-info-notice {
  --cl-prod-info-left: -60px;
  --cl-prod-info-arrow-left: calc(50% - 14px);
  bottom: calc(100% + 6px) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .cl-prod-info.use-review-img-upload-info {
  --cl-prod-info-left: -63px;
  --cl-prod-info-width: max-content;
  --cl-prod-info-arrow-left: calc(50% - 5px);
  bottom: 35px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .cl-prod-info.photo-review-info {
  --cl-prod-info-left: 205px;
  --cl-prod-info-width: max-content;
  --cl-prod-info-arrow-left: 92px;
  bottom: 35px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .cl-prod-info.discount-info,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .cl-prod-info.npay-button-info,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .cl-prod-info.unit-pricing-info,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .cl-prod-info.basic-unit-info,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .cl-prod-info.status-info,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .cl-prod-info.option-info,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .cl-prod-info.text-option-info,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .cl-prod-info.prd-code-info,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .cl-prod-info.mng-prd-code-info,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .cl-prod-info.pccc-info,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .cl-prod-info.culture-benefit-info,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .cl-prod-info.cl-prod-info-notice,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .cl-prod-info.use-review-img-upload-info,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .cl-prod-info.photo-review-info {
  --cl-prod-info-width: 360px;
  --cl-prod-info-arrow-left: calc(50% - 5px);
}

@layer cl-product-help-popover {
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .cl-prod-info {
    box-sizing: border-box !important;
    width: 300px !important;
    min-width: 0 !important;
    max-width: calc(100vw - 32px) !important;
    padding: 14px 16px 13px !important;
    background: #fff !important;
    border: 1px solid var(--cl-border, #e5e7eb) !important;
    border-radius: 10px !important;
    box-shadow: 0 8px 24px rgba(20, 24, 32, .14) !important;
    color: var(--cl-text-sub, #8a8f98) !important;
    font-family: var(--cl-source-font) !important;
    font-size: 12.5px !important;
    font-weight: 500 !important;
    line-height: 1.55 !important;
    letter-spacing: 0 !important;
    text-align: left !important;
    white-space: normal !important;
    word-break: keep-all !important;
    overflow-wrap: anywhere !important;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .cl-prod-info > div {
    margin: 0 0 9px !important;
    line-height: inherit !important;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .cl-prod-info > div:last-child {
    margin-bottom: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .cl-prod-info > div:has(> span + div) {
    display: flex !important;
    align-items: flex-start !important;
    gap: 6px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .cl-prod-info > div > span {
    float: none !important;
    flex: none !important;
    line-height: inherit !important;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .cl-prod-info > div > div {
    float: none !important;
    flex: 1 !important;
    min-width: 0 !important;
    width: auto !important;
    margin: 0 !important;
    line-height: inherit !important;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .cl-prod-info::after {
    top: auto !important;
    bottom: -5px !important;
    left: var(--cl-prod-info-arrow-left, calc(50% - 5px)) !important;
    width: 8px !important;
    height: 8px !important;
    background: #fff !important;
    border: 0 !important;
    border-right: 1px solid var(--cl-border, #e5e7eb) !important;
    border-bottom: 1px solid var(--cl-border, #e5e7eb) !important;
    transform: rotate(45deg) !important;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .cl-prod-info.cl-prod-info-below::after {
    top: -5px !important;
    bottom: auto !important;
    transform: rotate(225deg) !important;
  }
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info {
  display: block !important;
  width: 100% !important;
  min-height: 40px !important;
  text-align: left !important;
  --cl-prod-info-label-width: var(--cl-product-label-width, 132px);
  --cl-prod-info-control-gap: 20px;
  --cl-prod-info-toggle-inset: var(--cl-product-notice-inset, calc(var(--cl-prod-info-label-width) + var(--cl-prod-info-control-gap)));
  --cl-prod-info-toggle-gap: 28px;
  --cl-prod-info-control-width: var(--cl-product-notice-control-width, 230px);
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info > .prod-info-notice {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: #fff !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .prod-info-notice > .prod-info-box {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  flex-wrap: var(--cl-product-row-wrap, nowrap) !important;
  width: 100% !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .prod-info-notice > .prod-info-box::after {
  content: none !important;
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .prod-info-notice > .prod-info-box > .prod-info-notice-title {
  position: static !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  flex: 0 0 var(--cl-product-label-width, 132px) !important;
  width: var(--cl-product-label-width, 132px) !important;
  min-width: var(--cl-product-label-width, 132px) !important;
  margin: var(--cl-product-label-margin, 0 20px 0 0) !important;
  padding: 0 !important;
  color: #222428 !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  line-height: 18px !important;
  text-align: left !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .prod-info-notice > .prod-info-box > .prod-info-notice-content.info-selected {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .prod-info-notice > .prod-info-box > .input-switch {
  position: static !important;
  top: auto !important;
  right: auto !important;
  display: block !important;
  flex: 0 0 auto !important;
  margin: var(--cl-product-toggle-margin, 0) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .prod-info-toggle {
  position: static !important;
  display: none !important;
  width: calc(100% - var(--cl-prod-info-toggle-inset)) !important;
  max-width: none !important;
  margin: 13px 0 0 var(--cl-prod-info-toggle-inset) !important;
  padding: 0 !important;
  float: none !important;
  clear: none !important;
  border-top: 0 !important;
  background: #fff !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .prod-info-toggle.open {
  display: block !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .prod-info-toggle > .prod-info-box {
  display: grid !important;
  grid-template-columns: var(--cl-product-notice-columns, var(--cl-prod-info-label-width) minmax(0, 1fr)) !important;
  column-gap: var(--cl-prod-info-toggle-gap) !important;
  row-gap: var(--cl-product-notice-label-gap, 0px);
  align-items: center !important;
  justify-items: start !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  clear: none !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .prod-info-toggle > .prod-info-box.cate {
  margin-bottom: 8px !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .prod-info-toggle > .prod-info-box.use {
  position: relative !important;
  min-height: 40px !important;
  margin-bottom: 40px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .prod-info-toggle > .prod-info-box.use::after {
  content: "" !important;
  position: absolute !important;
  right: 0 !important;
  bottom: -20px !important;
  left: 0 !important;
  display: block !important;
  width: 100% !important;
  height: 1px !important;
  clear: none !important;
  background: #eef0f4 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .prod-info-toggle > .prod-info-box > .prod-info-notice-title {
  grid-column: 1 !important;
  justify-self: start !important;
  width: var(--cl-prod-info-label-width) !important;
  min-width: 0 !important;
  max-width: var(--cl-prod-info-label-width) !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  color: #696c71 !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 18px !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .prod-info-toggle > .prod-info-box > .prod-info-notice-content {
  grid-column: var(--cl-product-notice-control-column, 2) !important;
  justify-self: start !important;
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  float: none !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .prod-info-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  height: 40px !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 12px !important;
  border: 1px solid #dbdcdf !important;
  border-radius: 5px !important;
  background: #fff !important;
  color: #222428 !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 38px !important;
  text-align: left !important;
  box-shadow: none !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .prod-info-btn.use-btn-box {
  position: relative !important;
  width: var(--cl-prod-info-control-width) !important;
  min-width: var(--cl-prod-info-control-width) !important;
  max-width: var(--cl-prod-info-control-width) !important;
  padding-right: 34px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .prod-info-select {
  position: relative !important;
  width: var(--cl-prod-info-control-width) !important;
  min-width: var(--cl-prod-info-control-width) !important;
  max-width: var(--cl-prod-info-control-width) !important;
  padding-right: 34px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .prod-info-btn.use-btn-box::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 12px;
  width: 0;
  height: 0;
  margin-top: -2px;
  border-top: 4px solid #222428;
  border-right: 4px solid transparent;
  border-left: 4px solid transparent;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .prod-info-btn.use-btn-disable::after {
  border-top-color: #b1b3b7;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .prod-use-title,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .prod-select-title {
  display: block !important;
  overflow: hidden !important;
  width: 100% !important;
  margin: 0 !important;
  color: #222428 !important;
  font-size: 14px !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .use-btn-disable .prod-use-title,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .prod-select-title:not(.has-value) {
  color: #b1b3b7 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .prod-info-btn.use-btn-box.open,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .prod-info-select.open {
  border-color: #03C75A !important;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .12) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .use-select,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .info-select {
  position: absolute !important;
  top: calc(100% + 6px) !important;
  right: auto !important;
  left: 0 !important;
  z-index: 1000 !important;
  width: 100% !important;
  max-height: 240px !important;
  margin: 0 !important;
  padding: 6px 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  border: 1px solid #dbdcdf !important;
  border-radius: 6px !important;
  background: #fff !important;
  box-shadow: 0 12px 34px rgba(20, 24, 32, .17) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .info-select > div,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .use-select > div {
  display: flex !important;
  align-items: center !important;
  min-height: 34px !important;
  margin: 0 !important;
  padding: 7px 12px !important;
  color: #222428 !important;
  font-size: 14px !important;
  line-height: 18px !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .info-select > div span,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .use-select > div span,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .use-select span.prod_save_btn {
  font-size: 14px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .info-select > div:hover,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .use-select > div:hover,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .use-select > div.active {
  background: #eaf9f1 !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .use-select span.prod_save_btn {
  display: block !important;
  flex: 1 1 auto !important;
  overflow: hidden !important;
  width: auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .use-select > div > div {
  position: static !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  flex: 0 0 auto !important;
  margin-left: 8px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .prod-info-select > svg {
  position: absolute !important;
  top: 50% !important;
  right: 12px !important;
  display: block !important;
  width: 8px !important;
  height: 4px !important;
  fill: #222428 !important;
  transform: translateY(-50%) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .prod-info-notice-content.cate > .toggle-icon {
  position: static !important;
  display: none !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 0 !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .prod-info-notice-content.cate {
  gap: 8px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .prod-info-notice-content.cate > .toggle-icon svg {
  position: static !important;
  display: block !important;
  width: 10px !important;
  height: 10px !important;
  fill: currentColor !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .prod-info-notice-content.cate > .toggle-icon.open svg {
  transform: rotate(180deg) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .prod-info-list-box {
  display: none !important;
  width: 100% !important;
  margin: 8px 0 0 !important;
  padding: 0 !important;
  border-radius: 6px !important;
  background: transparent !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .prod-info-toggle.open > .prod-info-list-box,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .prod-info-list-box.open {
  display: block !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .prod-info-list-box .prod-info-btn.all-btn {
  display: inline-flex !important;
  width: auto !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 0 16px var(--cl-product-field-indent, calc(var(--cl-prod-info-label-width) + var(--cl-prod-info-toggle-gap))) !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #696c71 !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 18px !important;
  text-decoration: underline !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .prod-info-list-box .prod-info-btn.all-btn::after {
  content: none !important;
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .prod-info-list-box .prod-lists > div {
  display: grid !important;
  grid-template-columns: 120px minmax(0, 1fr);
  column-gap: 12px;
  align-items: center !important;
  width: 100% !important;
  margin: 0 0 12px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .prod-info-list-box .prod-lists > div > label.info-label {
  grid-column: 1;
  grid-row: 1;
  flex: 0 0 120px !important;
  width: 120px !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #222428 !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 18px !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .prod-info-list-box .prod-lists > div > div {
  display: contents;
  flex: 1 1 auto !important;
  width: auto !important;
  min-width: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .prod-info-list-box .prod-lists .prod-input-value {
  grid-column: 2;
  grid-row: 1;
  display: block;
  box-sizing: border-box;
  width: 100%;
  min-height: 40px;
  border: 0;
  border-bottom: 1px solid #e3e7ee;
  border-radius: 0;
  font-size: 14px;
  line-height: 40px;
  color: #222428;
  overflow-wrap: anywhere;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .prod-info-list-box .prod-lists .prod-input-value:empty:before {
  content: attr(data-placeholder);
  color: #b1b3b7;
  pointer-events: none;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .prod-info-list-box .prod-lists .prod-input-value:focus {
  border-bottom-color: #03C75A;
  outline: 0;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-info-list-box .prod-lists .value-empty {
  grid-column: 2;
  grid-row: 2;
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 6px 0 0;
  padding: 0;
  color: var(--cl-danger);
  font-size: 12.5px;
  font-weight: 500;
  line-height: 18px;
  overflow-wrap: anywhere;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-info-list-box .prod-lists .value-empty svg {
  flex: 0 0 13px;
  display: block;
  width: 13px;
  height: 13px;
  margin: 0;
  transform: none;
  fill: currentColor;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .prod-info-list-save {
  display: block !important;
  width: 100% !important;
  margin: 8px 0 0 !important;
  padding: 0 !important;
  background: transparent !important;
  text-align: right !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .prod-info-list-save span.prod-info-save {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 0 !important;
  height: 36px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  border: 1px solid #03C75A !important;
  border-radius: 5px !important;
  background: #fff !important;
  color: var(--cl-green-text) !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  line-height: 34px !important;
  letter-spacing: 0 !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .prod-info-list-save span.prod-info-save:hover {
  border-color: #02b351 !important;
  background: #eaf9f1 !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .prod-info-list-save span.prod-info-save > svg {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .prod-info-list-box.open .prod-info-list-save {
  display: block !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info .prod-info-toggle.open > .prod-info-list-box .prod-info-list-save {
  display: block !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info::before,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .legal-notice-section > .legal-notice-section-body > #state-product-box.prod-info::after,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > .form-wrap.product-seo-row::before,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > .form-wrap.product-seo-row::after,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > .form-wrap.npay-button::before,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > .form-wrap.npay-button::after,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > .form-wrap.brand::before,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > .form-wrap.brand::after,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > #require-navershop::after,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > #mng-prd-info::after {
  content: none !important;
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > .form-wrap.npay-button .npay-button-status {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > .form-wrap.npay-button .npay-button-label {
  min-height: 20px !important;
  line-height: 20px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > .form-wrap.npay-button .npay-button-box > .input-switch {
  align-self: center !important;
  height: 20px !important;
  margin: var(--cl-product-toggle-margin, 0) !important;
  transform: var(--cl-product-toggle-transform, translateY(-4px)) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > #mng-prd-info .mng-prd-wrap {
  display: flex !important;
  flex: 1 1 auto !important;
  flex-wrap: wrap !important;
  width: 100% !important;
  min-width: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > #mng-prd-info .mng-prd-box {
  justify-content: flex-start !important;
  flex: 0 0 100% !important;
  width: 100% !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > #mng-prd-info .mng-prd-box > .input-switch {
  flex: 0 0 36px !important;
  width: 36px !important;
  margin: var(--cl-product-toggle-margin, 0) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > #mng-prd-info .mng-prd-info-toggle {
  flex: 0 0 100% !important;
  width: 100% !important;
  margin: 12px 0 0 !important;
  padding: 0 !important;
  background: #fff !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > #mng-prd-info .mng-prd-info-toggle.hide {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > #mng-prd-info .mng-prd-info-toggle:not(.hide) {
  display: block !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > #mng-prd-info .mng-prd-info-box {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  width: 100% !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > #mng-prd-info .mng-prd-info-box .form-group {
  display: flex !important;
  align-items: center !important;
  flex: 0 0 auto !important;
  width: var(--cl-product-field-width, calc(100% - 152px)) !important;
  min-height: 40px !important;
  margin: var(--cl-product-field-margin, 0 0 0 152px) !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > #mng-prd-info .mng-prd-info-box .form-group.form-mng-prd-code {
  margin-top: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > #mng-prd-info .prod-input.prod-mngprd {
  flex: 1 1 auto !important;
  width: auto !important;
  min-width: 0 !important;
  height: 40px !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-bottom: 1px solid #e3e7ee !important;
  border-radius: 0 !important;
  background: #fff !important;
  color: #696c71 !important;
  font-size: 15px !important;
  line-height: 40px !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > #mng-prd-info .prod-input.prod-mngprd:focus,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > #mng-prd-info .prod-input.prod-mngprd:focus-visible {
  border-bottom-color: #03C75A !important;
  box-shadow: none !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > #mng-prd-info .mng-prd-info-box .form-group:focus-within .mng-prd-info-title,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > #mng-prd-info .mng-prd-info-box .form-group:has(.prod-input.prod-mngprd:focus) .mng-prd-info-title,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > #mng-prd-info .mng-prd-info-box .form-group:has(.prod-input.prod-mngprd:focus-visible) .mng-prd-info-title {
  color: #222428 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > #mng-prd-info .mng-prd-info-box .form-group:focus-within .mng-prd-info-title .cl-icon,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > #mng-prd-info .mng-prd-info-box .form-group:focus-within .mng-prd-info-title .cl-icon svg {
  color: #03C75A !important;
  fill: #03C75A !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > #mng-prd-info:not(.disabled) ~ .form-wrap.brand {
  margin-top: 50px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > .form-wrap.brand .form-group.prod-brand-modify {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  width: 100% !important;
  min-height: 40px !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > .form-wrap.brand .prod-brand {
  flex: 1 1 var(--cl-product-field-width, calc(100% - 152px)) !important;
  width: var(--cl-product-field-width, calc(100% - 152px)) !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 40px !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 10px !important;
  border: 1px solid #dbdcdf !important;
  border-radius: 5px !important;
  background: #fff !important;
  color: #222428 !important;
  font-size: 15px !important;
  line-height: 38px !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > .form-wrap.brand .brand-desc {
  display: flex !important;
  align-items: center !important;
  flex: 0 0 var(--cl-product-field-width, calc(100% - 152px)) !important;
  width: var(--cl-product-field-width, calc(100% - 152px)) !important;
  min-width: 0 !important;
  margin: 8px 0 0 var(--cl-product-field-indent, 152px) !important;
  color: #8e9095 !important;
  font-size: 12px !important;
  font-weight: 300 !important;
  line-height: 18px !important;
  white-space: normal !important;
  word-break: keep-all !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .etc-section > .etc-section-body > .form-wrap.brand .brand-desc svg {
  position: static !important;
  flex: 0 0 12px !important;
  width: 12px !important;
  height: 12px !important;
  margin: 0 2px 0 0 !important;
  fill: currentColor !important;
}

@media (max-width: 900px) {
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-header {
    right: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-header > .prod-header-wrap h1.prod-title {
    padding: var(--cl-product-title-padding, 22px 120px 22px 20px) !important;
    font-size: var(--cl-product-title-size, 20px) !important;
    text-align: var(--cl-product-title-align, left) !important;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-header > .prod-header-wrap ul.prod-button {
    top: 16px !important;
    right: 16px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-header > .prod-header-wrap ul.prod-button > li.modal-close {
    padding: var(--cl-product-action-padding, 8px 12px) !important;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-header > .prod-header-wrap ul.prod-button > li.modal-save {
    padding: var(--cl-product-action-padding, 8px 12px) !important;
    font-size: var(--cl-product-action-size, 13px) !important;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .product-wrap {
    width: 100% !important;
    padding: var(--cl-product-page-padding, 96px 16px 56px) !important;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-image-wrap,
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap {
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    padding-right: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap {
    margin-top: 24px;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-header {
    height: auto;
    min-height: 56px;
    padding-right: 52px;
    flex-wrap: wrap;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-header::before {
    flex: 0 0 100%;
    margin: 0;
    padding-top: 16px;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-header > #state-product-box:not(.prod-info) {
    padding: 8px 0 14px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box {
    grid-template-columns: 1fr !important;
    row-gap: 8px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box > .title {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 20px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box:not(.etc-setting) > .etc-content {
    max-width: none !important;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap:has(#prod-title) > .form-group,
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap:has(#prod-desc) > .form-group,
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 > .form-group {
    align-items: flex-start;
    flex-direction: var(--cl-product-field-direction, column);
    gap: 8px;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap:has(#prod-title) .form-label,
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap:has(#prod-desc) .form-label,
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .form-label {
    flex: 0 0 auto;
    width: 100% !important;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap #prod-title,
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap #prod-desc {
    width: 100% !important;
  }
}

#cl-shopping-product-page .cl-source-product-card-list {
  display: none;
}

#cl-shopping-product-page .cl-source-product-pager,
#cl-shopping-order-page .cl-source-product-pager,
#cl-shopping-order-search-page .cl-source-product-pager,
#cl-shopping-inquiry-page .cl-source-product-pager {
  margin-top: 28px;
}

#cl-shopping-product-page .shop-pager,
#cl-shopping-order-page .shop-pager,
#cl-shopping-order-search-page .shop-pager,
#cl-shopping-inquiry-page .shop-pager {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  width: 100%;
  padding: 0 !important;
  border-top: 0 !important;
}

#cl-shopping-product-page .shop-pager .pg,
#cl-shopping-order-page .shop-pager .pg,
#cl-shopping-order-search-page .shop-pager .pg,
#cl-shopping-inquiry-page .shop-pager .pg {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 30px;
  height: 30px;
  margin: 0;
  padding: 0 8px;
  appearance: none;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 6px;
  color: var(--cl-text-sub);
  font-size: 13px;
  font-weight: 400;
  cursor: pointer;
  text-decoration: none;
  transition: background-color .12s, border-color .12s, color .12s;
}

#cl-shopping-product-page .shop-pager .pg.active,
#cl-shopping-order-page .shop-pager .pg.active,
#cl-shopping-order-search-page .shop-pager .pg.active,
#cl-shopping-inquiry-page .shop-pager .pg.active {
  background: #e4f7ec;
  border-color: var(--cl-green);
  color: var(--cl-green-text);
  font-weight: 700;
}

#cl-shopping-product-page .shop-pager .pg:hover:not(.active),
#cl-shopping-order-page .shop-pager .pg:hover:not(.active),
#cl-shopping-order-search-page .shop-pager .pg:hover:not(.active),
#cl-shopping-inquiry-page .shop-pager .pg:hover:not(.active) {
  background: #f1fbf5;
  color: var(--cl-green-text);
}

#cl-shopping-product-page .shop-pager .pg:disabled,
#cl-shopping-product-page .shop-pager .pg:disabled:hover,
#cl-shopping-order-page .shop-pager .pg:disabled,
#cl-shopping-order-page .shop-pager .pg:disabled:hover,
#cl-shopping-order-search-page .shop-pager .pg:disabled,
#cl-shopping-order-search-page .shop-pager .pg:disabled:hover,
#cl-shopping-inquiry-page .shop-pager .pg:disabled,
#cl-shopping-inquiry-page .shop-pager .pg:disabled:hover {
  background: transparent;
  color: var(--cl-text-muted);
  cursor: default;
  opacity: .45;
}

#cl-shopping-product-page .shop-pager .pg.nav,
#cl-shopping-order-page .shop-pager .pg.nav,
#cl-shopping-order-search-page .shop-pager .pg.nav,
#cl-shopping-inquiry-page .shop-pager .pg.nav {
  color: var(--cl-text-muted);
}

#cl-shopping-product-page .shop-pager .pg.nav svg,
#cl-shopping-order-page .shop-pager .pg.nav svg,
#cl-shopping-order-search-page .shop-pager .pg.nav svg,
#cl-shopping-inquiry-page .shop-pager .pg.nav svg {
  display: block;
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
}

@media (max-width: 1024px) {
  #cl-shopping-product-page .cl-source-product-main-head {
    flex-wrap: wrap;
  }

  #cl-shopping-product-page .cl-source-product-tools {
    flex: 1 1 100%;
  }

  #cl-shopping-product-page .cl-source-product-search {
    flex: 1;
    min-width: 0;
  }

  #cl-shopping-product-page .cl-source-product-search input {
    width: 100%;
  }

  body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-status-tabs {
    gap: 18px;
  }
}

@media (min-width: 769px) and (max-width: 900px) {
  #cl-shopping-product-page {
    margin-right: var(--cl-source-app-gutter);
    margin-left: var(--cl-source-app-gutter);
  }
}

@media (max-width: 768px) {
  #cl-shopping-product-page {
    margin-left: var(--cl-source-app-gutter);
    padding: 20px 16px 40px;
  }

  #cl-shopping-product-page .cl-source-product-head {
    align-items: flex-start;
    flex-direction: column;
  }

  #cl-shopping-product-page .cl-source-product-actions {
    width: 100%;
  }

  #cl-shopping-product-page .cl-source-product-actions button {
    flex: 1;
    width: auto;
  }

  #cl-shopping-product-page .cl-source-product-panel {
    flex-direction: column;
  }

  body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-gallery-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
    min-height: 60px;
    padding: 12px 16px;
    border: 0;
    border-bottom: 1px solid var(--cl-border);
    background: var(--cl-surface);
    color: var(--cl-text);
    font: 700 20px/1.4 var(--cl-source-font);
    text-align: left;
    cursor: pointer;
  }

  body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-gallery-current {
    min-width: 0;
    overflow-wrap: anywhere;
  }

  body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-gallery-toggle svg {
    flex: none;
    width: 20px;
    height: 20px;
    color: var(--cl-text-sub);
    transition: transform .18s ease;
  }

  body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-gallery-toggle[aria-expanded="true"] svg {
    transform: rotate(180deg);
  }

  body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-gallery-toggle:focus-visible {
    outline: 2px solid var(--cl-green);
    outline-offset: -3px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-side {
    display: grid;
    grid-template-rows: 0fr;
    width: 100%;
    flex-basis: auto;
    padding: 0;
    border-right: 0;
    border-bottom: 0;
    visibility: hidden;
    transition: grid-template-rows .18s ease, padding .18s ease, visibility .18s;
  }

  body.cl-dashboard-redesign-page #cl-shopping-product-page .cl-source-product-side > .cl-source-product-nav {
    min-height: 0;
    overflow: hidden;
  }

  body.cl-dashboard-redesign-page #cl-shopping-product-page .is-gallery-menu-open .cl-source-product-side {
    grid-template-rows: 1fr;
    padding: 12px 0;
    border-bottom: 1px solid var(--cl-border);
    visibility: visible;
  }

  body.cl-dashboard-redesign-page #cl-shopping-product-page #clProductGalleryName {
    display: none;
  }

  @media (prefers-reduced-motion: reduce) {
    body.cl-dashboard-redesign-page #cl-shopping-product-page :is(.cl-source-product-side, .cl-source-product-gallery-toggle svg) {
      transition: none;
    }
  }

  #cl-shopping-product-page .cl-source-product-main {
    padding: 20px 16px 26px;
  }

  #cl-shopping-product-page .cl-source-product-gallery-name {
    font-size: 20px;
  }

  #cl-shopping-product-page .cl-source-product-bulkbar {
    width: 100%;
    min-width: 0;
    padding-right: 0;
    padding-left: 0;
    overflow: hidden;
  }

  #cl-shopping-product-page .cl-source-product-bulk-actions {
    flex: 1 1 auto;
    flex-wrap: nowrap;
    max-width: calc(100% - 50px);
    padding: 0 8px 1px 0;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }

  #cl-shopping-product-page .cl-source-product-bulk-actions::-webkit-scrollbar {
    display: none;
    width: 0;
    height: 0;
  }
}

/* ===== Shopping order manager ===== */
#cl-shopping-order-page {
  width: auto;
  max-width: none;
  margin-top: 0;
  margin-right: var(--cl-source-app-gutter);
  margin-left: calc(var(--cl-source-app-gutter) + var(--cl-source-sidebar-w));
  padding: 28px 32px 60px;
  background: transparent;
  color: var(--cl-text);
}

#cl-shopping-order-page,
#cl-shopping-order-page * {
  box-sizing: border-box;
}

#cl-shopping-order-page > .cl-source-shopping-order-shell,
#cl-shopping-order-page .cl-source-order-content,
#cl-shopping-order-page .dashbottom-wrap,
#cl-shopping-order-page .dashbottom-container {
  float: none !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 0;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent;
  border: 0;
  box-shadow: none;
}

#cl-shopping-order-page .dashbottom-container {
  display: block;
  position: relative;
}

#cl-shopping-order-page .cl-source-order-panel > .dashbottom-wrap,
#cl-shopping-order-page .cl-source-order-panel > .dashbottom-wrap > .dashbottom-container {
  width: 100% !important;
  max-width: none !important;
  margin-right: 0 !important;
  margin-left: 0 !important;
  transform: none !important;
}

#cl-shopping-order-page .mobile-title {
  display: none !important;
}

#cl-shopping-order-page #section-top-menu {
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  overflow: visible;
  overflow-x: visible;
}

body.cl-dashboard-redesign-page #cl-shopping-order-page #section-top-menu .new-nav-container {
  display: flex;
  float: none !important;
  align-items: flex-end;
  justify-content: flex-start;
  width: 100% !important;
  max-width: none !important;
  height: auto;
  margin: 0 !important;
  padding: 6px 0 0;
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--cl-border);
  box-shadow: none;
  overflow: visible;
  overflow-x: visible;
  overflow-y: visible;
}

body.cl-dashboard-redesign-page #cl-shopping-order-page #section-top-menu .sub-navbar {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: flex-start;
  gap: 2px;
  float: none;
  min-width: 0;
  margin: 0;
  padding: 0;
  list-style: none;
  overflow: visible;
}

body.cl-dashboard-redesign-page #cl-shopping-order-page #section-top-menu .sub-navbar.f-right {
  display: none;
}

body.cl-dashboard-redesign-page #cl-shopping-order-page .cl-source-order-top-right {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  align-self: center;
  gap: 18px;
  margin-left: auto;
}

body.cl-dashboard-redesign-page #cl-shopping-order-page .cl-source-order-naverpay-mobile-slot {
  display: none;
}

#cl-shopping-order-page #section-top-menu .sub-navbar li {
  flex: 0 0 auto;
  float: none;
  min-width: 0;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
}

#cl-shopping-order-page #section-top-menu .sub-navbar a {
  display: inline-flex;
  align-items: center;
  height: auto;
  margin: 0 0 -1px;
  padding: 14px 20px;
  background: transparent;
  border: 0;
  border-bottom: 2px solid transparent;
  color: var(--cl-text-sub);
  font-size: 15px;
  font-weight: 700;
  line-height: 20px;
  text-decoration: none;
  white-space: nowrap;
  transition: color .12s, border-color .12s;
}

#cl-shopping-order-page #section-top-menu .sub-navbar a:hover {
  color: var(--cl-text);
}

#cl-shopping-order-page #section-top-menu .sub-navbar li.active a {
  color: var(--cl-green-text);
  border-bottom-color: var(--cl-green);
}

#cl-shopping-order-page #section-top-menu .subnav-title {
  color: inherit;
  font: inherit;
  line-height: inherit;
}

#cl-shopping-order-page .cl-source-order-head {
  margin: 0 0 18px;
}

#cl-shopping-order-page .cl-source-order-breadcrumb {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  color: var(--cl-text);
  font-size: 20px;
  font-weight: 700;
  line-height: 1.35;
}

#cl-shopping-order-page .cl-source-order-breadcrumb .sep {
  color: var(--cl-text-muted);
  font-size: 23px;
  font-weight: 400;
  line-height: 1;
}

#cl-shopping-order-page .cl-source-order-breadcrumb .current {
  color: var(--cl-text-sub);
  font-weight: 700;
}

#cl-shopping-order-page .cl-source-order-desc {
  margin: 10px 0 0;
  color: var(--cl-text-sub);
  font-size: 13px;
  font-weight: 400;
  line-height: 1.45;
}

#cl-shopping-order-page .cl-source-order-panel {
  overflow: hidden;
  width: 100%;
  min-height: 420px;
  padding: 0 24px 26px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 14px;
  box-shadow: 0 2px 6px rgba(24, 39, 75, .04);
}

#cl-shopping-order-page #submenu-anchor {
  display: none;
}

#cl-shopping-order-page .submenu_navWrap {
  position: relative !important;
  /* 고정 탭의 레거시 레이어가 위로 열린 필터 메뉴를 덮지 않게 한다. */
  z-index: auto;
  display: block;
  width: 100% !important;
  max-width: none !important;
  height: 48px;
  left: auto;
  transform: none;
  margin: 0 !important;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
  overflow: visible;
  overflow-x: visible;
}

#cl-shopping-order-page .submenu_nav {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
  width: 100% !important;
  max-width: none !important;
  height: 48px;
  margin: 0 !important;
  padding: 0;
  border-top: 0;
  border-right: 0;
  border-bottom: 1px solid var(--cl-border);
  border-left: 0;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow-x: auto;
  overflow-y: hidden;
}

#cl-shopping-order-page .submenu_nav ul {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 24px;
  width: auto;
  height: 48px;
  min-width: 0;
  margin: 0;
  padding: 0;
  list-style: none;
  border-radius: 0;
  overflow: visible;
  overflow-x: visible;
}

#cl-shopping-order-page .submenu_nav > ul:first-child {
  flex: 0 0 auto;
  flex-wrap: nowrap;
  overflow: visible;
  overflow-x: visible;
}

#cl-shopping-order-page .submenu_nav ul.f-right {
  flex: 0 0 auto;
  position: absolute;
  top: -48px;
  right: 0;
  align-self: auto;
  margin-left: 0;
}

#cl-shopping-order-page .submenu_nav li {
  display: flex;
  align-items: stretch;
  flex: 0 0 auto;
  float: none;
  min-width: 0;
  height: 48px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

#cl-shopping-order-page .submenu_nav .sub-menu {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  box-sizing: border-box;
  height: 48px;
  min-width: 0;
  margin: 0;
  padding: 0;
  color: var(--cl-text-sub);
  border: 0;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  background: transparent;
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
  white-space: nowrap;
  text-decoration: none;
  transition: color .12s, border-color .12s;
}

#cl-shopping-order-page .submenu_nav .sub-menu:hover {
  color: var(--cl-text);
}

#cl-shopping-order-page .submenu_nav .sub-menu.active {
  color: var(--cl-green-text);
  border-bottom-color: var(--cl-green);
  font-weight: 700;
}

#cl-shopping-order-page .submenu_nav .order-number {
  display: inline;
  min-width: 0;
  height: auto;
  margin: 0;
  padding: 0;
  background: transparent;
  color: var(--cl-text-muted);
  border: 0;
  border-radius: 0;
  font-size: inherit;
  font-weight: 800;
  line-height: inherit;
}

#cl-shopping-order-page .submenu_nav .sub-menu.active .order-number {
  color: var(--cl-green-text);
}

#cl-shopping-order-page .submenu_nav li.search {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  box-sizing: border-box;
  height: 48px;
  margin: 0;
  padding: 0;
  color: var(--cl-text-sub);
  border-bottom: 2px solid transparent;
  border-radius: 0;
  background: transparent;
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
  cursor: pointer;
  white-space: nowrap;
}

#cl-shopping-order-page .submenu_nav li.search:hover {
  color: var(--cl-text);
}

#cl-shopping-order-page .submenu_nav li.search .cl-icon {
  width: 15px;
  height: 15px;
  color: var(--cl-text-sub);
}

#cl-shopping-order-page .btn-naverpay-sync {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  height: 32px;
  margin: 0;
  padding: 0 12px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  color: var(--cl-text-sub);
  font-size: 12.5px;
  font-weight: 600;
  line-height: 30px;
  box-shadow: none;
}

#cl-shopping-order-page .btn-naverpay-sync:hover {
  background: #fafbfc;
  border-color: #d5d9e0;
  color: var(--cl-text);
}

#cl-shopping-order-page .cl-source-order-top-right .btn-naverpay-sync,
#cl-shopping-order-page .cl-source-order-top-right .btn-naverpay-sync.shopping_disabled,
#cl-shopping-order-page .cl-source-order-top-right .btn-naverpay-sync.ss_user_noActive,
#cl-shopping-order-page .cl-source-order-top-right .btn-naverpay-sync:hover,
#cl-shopping-order-page .cl-source-order-top-right .btn-naverpay-sync.shopping_disabled:hover,
#cl-shopping-order-page .cl-source-order-top-right .btn-naverpay-sync.ss_user_noActive:hover {
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  color: var(--cl-text-sub) !important;
  opacity: 1;
}

#cl-shopping-order-page .cl-source-order-top-right .btn-naverpay-sync:hover,
#cl-shopping-order-page .cl-source-order-top-right .btn-naverpay-sync.shopping_disabled:hover,
#cl-shopping-order-page .cl-source-order-top-right .btn-naverpay-sync.ss_user_noActive:hover {
  background: #fafbfc !important;
  border-color: #d5d9e0 !important;
  color: var(--cl-text) !important;
}

#cl-shopping-order-page .btn-naverpay-sync .ico-naverpay {
  flex: none;
  width: 16px;
  height: 16px;
  fill: #03c75a;
}

#cl-shopping-order-page .cl-source-order-naver-badge {
  display: inline-flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  border-radius: 3px;
  background: #03c75a;
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  line-height: 16px;
}

#cl-shopping-order-page .popover {
  z-index: 1400 !important;
  max-width: min(360px, calc(100vw - 32px));
  padding: 0;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 10px;
  box-shadow: var(--cl-shadow-tip);
  color: var(--cl-text-sub);
  font-family: var(--cl-source-font);
}

#cl-shopping-order-page .popover-title {
  display: none;
}

#cl-shopping-order-page .popover-content {
  padding: 12px 14px;
  color: var(--cl-text-sub);
  font-size: 12.5px;
  font-weight: 400;
  line-height: 1.65;
  word-break: keep-all;
}

#cl-shopping-order-page .popover.top > .arrow {
  border-top-color: var(--cl-border);
}

#cl-shopping-order-page .popover.top > .arrow::after {
  border-top-color: #fff;
}

#cl-shopping-order-page .popover.right > .arrow {
  border-right-color: var(--cl-border);
}

#cl-shopping-order-page .popover.right > .arrow::after {
  border-right-color: #fff;
}

#cl-shopping-order-page .popover.bottom > .arrow {
  border-bottom-color: var(--cl-border);
}

#cl-shopping-order-page .popover.bottom > .arrow::after {
  border-bottom-color: #fff;
}

#cl-shopping-order-page .popover.left > .arrow {
  border-left-color: var(--cl-border);
}

#cl-shopping-order-page .popover.left > .arrow::after {
  border-left-color: #fff;
}

body.cl-dashboard-redesign-page #cl-shopping-order-page .btn-util-section {
  height: auto;
  min-height: 0;
  position: static !important;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100% !important;
  margin: 18px 0 14px;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}

#cl-shopping-order-page .btn-batch-group,
#cl-shopping-order-page .btn-option-group {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  margin: 0;
  padding: 0;
}

#cl-shopping-order-page .btn-batch-group:empty,
#cl-shopping-order-page .btn-batch-group.is-empty {
  display: none;
}

body.cl-dashboard-redesign-page #cl-shopping-order-page .btn-option-group {
  flex-wrap: nowrap;
  justify-content: flex-start;
  margin-left: auto;
}

#cl-shopping-order-page .btn-batch-proc,
#cl-shopping-order-page .download-option,
#cl-shopping-order-page .tracking-option {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 32px;
  min-width: 0;
  margin: 0;
  padding: 0 14px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  color: var(--cl-text);
  font-size: 12.5px;
  font-weight: 600;
  line-height: 30px;
  box-shadow: none;
  cursor: pointer;
  white-space: nowrap;
  transition: background-color .12s, border-color .12s, color .12s;
  appearance: none;
}

#cl-shopping-order-page .btn-batch-proc:hover,
#cl-shopping-order-page .download-option:hover,
#cl-shopping-order-page .tracking-option:hover {
  background: #fafbfc;
  border-color: #d5d9e0;
}

#cl-shopping-order-page .btn-batch-proc.primary,
#cl-shopping-order-page .tracking-option {
  background: var(--cl-green);
  border-color: var(--cl-green);
  color: #fff;
}

#cl-shopping-order-page .btn-batch-proc.primary:hover,
#cl-shopping-order-page .tracking-option:hover {
  background: var(--cl-green-hover);
  border-color: var(--cl-green-hover);
  color: #fff;
}

#cl-shopping-order-page .btn-batch-proc.shopping_disabled,
#cl-shopping-order-page .download-option.shopping_disabled,
#cl-shopping-order-page .tracking-option.shopping_disabled,
#cl-shopping-order-page .btn-naverpay-sync.shopping_disabled,
#cl-shopping-order-page .btn-batch-proc.ss_user_noActive,
#cl-shopping-order-page .download-option.ss_user_noActive,
#cl-shopping-order-page .tracking-option.ss_user_noActive,
#cl-shopping-order-page .btn-naverpay-sync.ss_user_noActive {
  box-shadow: none;
  cursor: default;
}

#cl-shopping-order-page .btn-batch-proc.primary.shopping_disabled,
#cl-shopping-order-page .tracking-option.shopping_disabled,
#cl-shopping-order-page .btn-batch-proc.primary.ss_user_noActive,
#cl-shopping-order-page .tracking-option.ss_user_noActive {
  background: var(--cl-green) !important;
  border-color: var(--cl-green) !important;
  color: #fff !important;
  opacity: .35;
}

#cl-shopping-order-page .btn-batch-proc:not(.primary).shopping_disabled,
#cl-shopping-order-page .download-option.shopping_disabled,
#cl-shopping-order-page .btn-naverpay-sync.shopping_disabled,
#cl-shopping-order-page .btn-batch-proc:not(.primary).ss_user_noActive,
#cl-shopping-order-page .download-option.ss_user_noActive,
#cl-shopping-order-page .btn-naverpay-sync.ss_user_noActive {
  background: #fff !important;
  border-color: var(--cl-border) !important;
  color: var(--cl-text) !important;
  opacity: .35;
  box-shadow: none;
  cursor: default;
}

#cl-shopping-order-page .btn-batch-proc.shopping_disabled:hover,
#cl-shopping-order-page .download-option.shopping_disabled:hover,
#cl-shopping-order-page .tracking-option.shopping_disabled:hover,
#cl-shopping-order-page .btn-naverpay-sync.shopping_disabled:hover,
#cl-shopping-order-page .btn-batch-proc.ss_user_noActive:hover,
#cl-shopping-order-page .download-option.ss_user_noActive:hover,
#cl-shopping-order-page .tracking-option.ss_user_noActive:hover,
#cl-shopping-order-page .btn-naverpay-sync.ss_user_noActive:hover {
  box-shadow: none !important;
}

#cl-shopping-order-page .btn-batch-proc.primary.shopping_disabled:hover,
#cl-shopping-order-page .tracking-option.shopping_disabled:hover,
#cl-shopping-order-page .btn-batch-proc.primary.ss_user_noActive:hover,
#cl-shopping-order-page .tracking-option.ss_user_noActive:hover {
  background: var(--cl-green) !important;
  border-color: var(--cl-green) !important;
  color: #fff !important;
}

#cl-shopping-order-page .btn-batch-proc:not(.primary).shopping_disabled:hover,
#cl-shopping-order-page .download-option.shopping_disabled:hover,
#cl-shopping-order-page .btn-naverpay-sync.shopping_disabled:hover,
#cl-shopping-order-page .btn-batch-proc:not(.primary).ss_user_noActive:hover,
#cl-shopping-order-page .download-option.ss_user_noActive:hover,
#cl-shopping-order-page .btn-naverpay-sync.ss_user_noActive:hover {
  background: #fff !important;
  border-color: var(--cl-border) !important;
  color: var(--cl-text) !important;
}

#cl-shopping-order-page .tracking-option label {
  display: block;
  margin: 0;
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  cursor: inherit;
}

#cl-shopping-order-page .state-option,
#cl-shopping-order-page .list-limit-option {
  position: relative;
  display: inline-flex;
  align-items: center;
  width: auto;
  height: 35px;
  margin: 0;
}

#cl-shopping-order-page .state-option > .only-mobile-block {
  /* 기존 모바일 아이콘 전용 필터의 강제 노출을 해제한다. */
  display: none !important;
}

#cl-shopping-order-page .common-selectbox {
  position: relative;
  display: inline-flex;
  align-items: center;
  width: auto;
  height: 35px;
  min-width: 112px;
  margin: 0;
  padding: 0;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: var(--cl-radius-sm);
  box-shadow: none;
  transition: background-color .12s, border-color .12s;
}

#cl-shopping-order-page .common-selectbox:hover,
#cl-shopping-order-page .common-selectbox:focus-within {
  background: #fafbfc;
  border-color: #d5d9e0;
}

#cl-shopping-order-page .common-selectbox select {
  width: 100%;
  height: 33px;
  min-width: 112px;
  margin: 0;
  padding: 0 30px 0 12px;
  appearance: none;
  -webkit-appearance: none;
  background: transparent;
  border: 0;
  box-shadow: none;
  color: var(--cl-text);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 33px;
  outline: none;
  cursor: pointer;
}

#cl-shopping-order-page .list-limit-option .common-selectbox,
#cl-shopping-order-page .list-limit-option .common-selectbox select {
  min-width: 112px;
}

#cl-shopping-order-page .common-selectbox > .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn) {
  width: 100% !important;
  max-width: none;
  height: 33px;
}

#cl-shopping-order-page .common-selectbox > .bootstrap-select .dropdown-toggle .bs-caret {
  display: none;
}

#cl-shopping-order-page .common-selectbox > .bootstrap-select .btn.btn-default,
#cl-shopping-order-page .common-selectbox > .bootstrap-select .btn.btn-default:hover,
#cl-shopping-order-page .common-selectbox > .bootstrap-select .btn.btn-default:focus,
#cl-shopping-order-page .common-selectbox > .bootstrap-select .btn.btn-default:active,
#cl-shopping-order-page .common-selectbox > .bootstrap-select.open .btn.btn-default {
  width: 100%;
  max-width: none;
  height: 33px;
  min-height: 33px;
  margin: 0;
  padding: 0 30px 0 12px;
  background: transparent !important;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  color: var(--cl-text);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 33px;
  outline: 0 !important;
}

#cl-shopping-order-page .common-selectbox > .bootstrap-select .filter-option,
#cl-shopping-order-page .common-selectbox > .bootstrap-select .filter-option-inner,
#cl-shopping-order-page .common-selectbox > .bootstrap-select .filter-option-inner-inner {
  height: 33px;
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: 33px;
}

#cl-shopping-order-page .common-selectbox > .bootstrap-select > .dropdown-menu {
  top: var(--cl-select-menu-top, calc(100% + 4px));
  min-width: 100%;
  margin: 0;
  padding: 4px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(20, 24, 32, .14);
}

#cl-shopping-order-page .common-selectbox > .bootstrap-select .dropdown-menu.inner {
  position: static;
  min-width: 0;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

#cl-shopping-order-page .common-selectbox > .bootstrap-select .dropdown-menu > li > a {
  min-height: 0;
  padding: 8px 12px;
  border-radius: var(--cl-radius-sm);
  color: var(--cl-text);
  font-size: 12.5px;
  font-weight: 400;
  line-height: 18px;
}

#cl-shopping-order-page .common-selectbox > .bootstrap-select .dropdown-menu > li > a:hover,
#cl-shopping-order-page .common-selectbox > .bootstrap-select .dropdown-menu > li > a:focus,
#cl-shopping-order-page .common-selectbox > .bootstrap-select .dropdown-menu > .active > a,
#cl-shopping-order-page .common-selectbox > .bootstrap-select .dropdown-menu > .active > a:hover,
#cl-shopping-order-page .common-selectbox > .bootstrap-select .dropdown-menu > .active > a:focus {
  background: #e4f7ec;
  color: var(--cl-green-text);
}

#cl-shopping-order-page .common-selectbox > .bootstrap-select .dropdown-menu > .active > a {
  font-weight: 700;
}

#cl-shopping-order-page .common-selectbox > svg {
  display: none;
}

#cl-shopping-order-page .common-selectbox::after,
#cl-shopping-order-page .download-option::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 8px;
  width: 14px;
  height: 14px;
  margin-top: -7px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238A8F98' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 14px;
  pointer-events: none;
}

#cl-shopping-order-page .download-option {
  position: relative;
  height: 35px;
  min-width: 112px;
  padding: 0 30px 0 12px;
  color: var(--cl-text);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 33px;
}

#cl-shopping-order-page .download-option > svg {
  display: none;
}

#cl-shopping-order-page .download-option-items {
  position: absolute;
  top: calc(100% + 4px);
  right: 0;
  z-index: 30;
  display: none;
  min-width: 146px;
  padding: 4px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(20, 24, 32, .14);
}

#cl-shopping-order-page .download-option-item {
  display: flex;
  align-items: center;
  min-height: 0;
  padding: 8px 12px;
  color: var(--cl-text);
  border-radius: var(--cl-radius-sm);
  font-size: 12.5px;
  font-weight: 400;
  line-height: 18px;
  white-space: nowrap;
}

#cl-shopping-order-page .download-option-item:hover {
  background: #e4f7ec;
  color: var(--cl-green-text);
}

#cl-shopping-order-page .order-list-area {
  display: flex;
  flex-wrap: wrap !important;
  align-items: flex-start;
  width: 100% !important;
  max-width: none;
  min-height: 430px;
  margin: 0;
  padding: 0;
  overflow: auto;
  background: #fff;
  border: 0;
}

/* 표의 가로 스크롤과 페이지 이동 영역을 분리한다. */
body.cl-dashboard-redesign-page #cl-shopping-order-page .cl-source-order-scroll-hint {
  display: none;
}

body.cl-dashboard-redesign-page #cl-shopping-order-page .cl-source-order-table-scroll {
  display: flex;
  flex: 0 0 100%;
  align-items: flex-start;
  width: 100%;
  min-width: 0;
}

#cl-shopping-order-page .order-list-area.empty-list {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  min-height: 520px;
  overflow: visible;
}

#cl-shopping-order-page .order-list-area.empty-list .m-list-table {
  height: auto;
}

#cl-shopping-order-page .order-list-area.empty-list .body-div {
  min-height: 394px;
}

#cl-shopping-order-page .order-list-area.empty-list .left-div {
  flex: 0 0 var(--cl-order-left-width, 440px);
}

#cl-shopping-order-page .order-list-area.empty-list .right-div {
  flex: 1 1 0;
  min-width: 0;
}

#cl-shopping-order-page .order-list-area.empty-list .paging {
  flex: 0 0 100%;
}

#cl-shopping-order-page .cl-source-order-empty-message {
  position: absolute;
  top: 45px;
  right: 0;
  bottom: 54px;
  left: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--cl-text-sub);
  font-size: 13px;
  font-weight: 400;
  line-height: 18px;
  text-align: center;
  pointer-events: none;
}

#cl-shopping-order-page .left-div,
#cl-shopping-order-page .right-div {
  float: none;
  min-height: 0;
  margin: 0;
  padding: 0;
  background: #fff;
  border: 0;
}

#cl-shopping-order-page .left-div {
  flex: 0 0 var(--cl-order-left-width, 440px);
  width: var(--cl-order-left-width, 440px);
  min-width: var(--cl-order-left-width, 440px);
}

#cl-shopping-order-page .right-div {
  flex: 1 1 calc(100% - var(--cl-order-left-width, 440px));
  width: calc(100% - var(--cl-order-left-width, 440px));
  min-width: 0;
  max-width: none;
  overflow-x: auto;
}

#cl-shopping-order-page .order-list-area > .paging {
  flex: 0 0 100%;
  width: 100%;
}

#cl-shopping-order-page .product-list,
#cl-shopping-order-page .table-container,
#cl-shopping-order-page .tablecon-wrap {
  float: none;
  width: 100%;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}

#cl-shopping-order-page .head-div {
  position: static !important;
  top: auto !important;
  left: auto !important;
  z-index: auto !important;
  width: 100% !important;
  overflow: hidden;
}

#cl-shopping-order-page .body-div {
  margin-top: 0 !important;
  overflow: visible;
}

#cl-shopping-order-page .list-table {
  width: 100%;
  margin: 0;
  table-layout: fixed;
  border-collapse: collapse;
  border-spacing: 0;
  background: #fff;
  color: var(--cl-text);
  font-size: 13px;
}

body.cl-dashboard-redesign-page #cl-shopping-order-page .list-table > thead,
body.cl-dashboard-redesign-page #cl-shopping-order-page .list-table > tbody,
body.cl-dashboard-redesign-page #cl-shopping-order-page .list-table > tbody > tr {
  border: 0;
}

body.cl-dashboard-redesign-page #cl-shopping-order-page .list-table > tbody::before,
body.cl-dashboard-redesign-page #cl-shopping-order-page .list-table > tbody::after {
  content: none;
  display: none;
}

#cl-shopping-order-page .list-table th,
#cl-shopping-order-page .list-table td {
  height: auto;
  min-height: 0;
  padding: 12px 8px;
  border: 0;
  border-bottom: 1px solid var(--cl-border);
  color: var(--cl-text);
  background: #fff;
  font-size: 13px;
  font-weight: 400;
  line-height: 18px;
  text-align: center;
  vertical-align: middle;
  word-break: keep-all;
}

#cl-shopping-order-page .list-table th {
  background: #f7f8fa;
  color: var(--cl-text-sub);
  border-top: 1px solid var(--cl-border);
  border-right: 0 !important;
  border-left: 0 !important;
  font-size: 12.5px;
  font-weight: 600;
  line-height: 18px;
  white-space: nowrap;
}

#cl-shopping-order-page .body-div .list-table tbody tr {
  height: 62px;
}

#cl-shopping-order-page .body-div .list-table td {
  height: 62px;
  padding-top: 10px;
  padding-bottom: 10px;
}

/* Separate product-level fields without dividing shared order information. */
#cl-shopping-order-page .left-div .body-div .list-table td.imgblock,
#cl-shopping-order-page .right-div .body-div .list-table td:not([rowspan]) {
  border-left: 1px solid var(--cl-border);
}

#cl-shopping-order-page .left-div .body-div .list-table tr > td:last-child {
  box-shadow: inset -1px 0 0 var(--cl-border);
}

#cl-shopping-order-page .right-div .body-div .list-table tr > td:not([rowspan]):not(:last-child) {
  border-right: 1px solid var(--cl-border);
}

/* 주문 공통 정보의 병합 셀도 열 경계를 끊김 없이 표시한다. */
#cl-shopping-order-page .right-div .list-table .cl-source-order-column-divider {
  box-shadow: inset -1px 0 0 var(--cl-border);
}

#cl-shopping-order-page .list-table tbody tr:hover td,
#cl-shopping-order-page .list-table tbody tr.over td {
  background: #fafbfc;
}

#cl-shopping-order-page .left-div .list-table td[rowspan],
#cl-shopping-order-page .right-div .list-table td[rowspan] {
  background: #fff;
}

#cl-shopping-order-page .list-table .cl-source-order-image-col {
  width: 52px;
}

#cl-shopping-order-page .list-table .cl-source-order-name-col {
  width: 158px;
}

#cl-shopping-order-page .list-table .imgblock {
  padding: 9px 6px 9px 11px;
}

#cl-shopping-order-page .list-table .imgblock img {
  display: block;
  width: 34px;
  height: 34px;
  margin: 0 auto;
  object-fit: cover;
  border-radius: 6px;
  background: #e7eaef;
}

body.cl-dashboard-redesign-page #cl-shopping-order-page .list-table .cl-source-order-id-cell {
  overflow: visible;
  color: var(--cl-green-text);
  font-weight: 600;
  text-overflow: clip;
  white-space: nowrap;
  overflow-wrap: normal;
  word-break: normal;
}

body.cl-dashboard-redesign-page #cl-shopping-order-page .cl-source-order-status-point {
  color: var(--cl-green-text);
  font-weight: 600;
}

#cl-shopping-order-page .order-name {
  display: block;
  overflow: hidden;
  color: var(--cl-green-text);
  font-size: 13px;
  font-weight: 500;
  line-height: 18px;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#cl-shopping-order-page .order-mobile-status {
  display: none;
}

#cl-shopping-order-page .ico-naverpay {
  fill: #03c75a;
}

#cl-shopping-order-page .date-td {
  color: var(--cl-text);
  font-size: 12.5px;
  line-height: 17px;
}

#cl-shopping-order-page .c-blue,
#cl-shopping-order-page .st-blue {
  color: var(--cl-green-text);
  font-weight: 600;
}

#cl-shopping-order-page .c-red,
#cl-shopping-order-page .st-red {
  color: #e5484d;
  font-weight: 600;
}

#cl-shopping-order-page .c-black,
#cl-shopping-order-page .st-dark {
  color: var(--cl-text);
  font-weight: 600;
}

#cl-shopping-order-page .st-gray {
  color: var(--cl-text-sub);
}

#cl-shopping-order-page[data-page-check^="cancel"] .submenu_nav .sub-menu.active,
#cl-shopping-order-page[data-page-check^="exchange"] .submenu_nav .sub-menu.active,
#cl-shopping-order-page[data-page-check^="return"] .submenu_nav .sub-menu.active,
#cl-shopping-order-page[data-page-check^="cancel"] #section-top-menu .sub-navbar li.active a,
#cl-shopping-order-page[data-page-check^="exchange"] #section-top-menu .sub-navbar li.active a,
#cl-shopping-order-page[data-page-check^="return"] #section-top-menu .sub-navbar li.active a {
  color: var(--cl-green-text);
  border-bottom-color: var(--cl-green);
}

#cl-shopping-order-page[data-page-check^="cancel"] .btn-util-section,
#cl-shopping-order-page[data-page-check^="exchange"] .btn-util-section,
#cl-shopping-order-page[data-page-check^="return"] .btn-util-section {
  justify-content: flex-end;
}

#cl-shopping-order-page .list-table .cl-source-order-check-cell {
  width: 30px;
  padding-right: 0 !important;
  padding-left: 0 !important;
  overflow: hidden;
  font-size: 0;
  line-height: 0;
  text-align: center !important;
  text-overflow: clip !important;
  white-space: nowrap;
}

#cl-shopping-order-page .cl-source-order-check-cell .newcheckbox {
  margin-right: auto !important;
  margin-left: auto !important;
}

#cl-shopping-order-page .newcheckbox {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  margin: 0 !important;
  overflow: hidden;
  font-size: 0;
  line-height: 0;
}

#cl-shopping-order-page .newcheckbox label {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  margin: 0;
  overflow: hidden;
  cursor: pointer;
}

#cl-shopping-order-page .newcheckbox input {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: 0;
  opacity: 0;
  pointer-events: none;
}

#cl-shopping-order-page .newcheckbox svg {
  display: block;
  width: 16px;
  height: 16px;
  fill: #b9c1cc;
}

#cl-shopping-order-page .newcheckbox svg.active {
  display: none !important;
  fill: var(--cl-green);
}

#cl-shopping-order-page .newcheckbox input:checked ~ svg {
  display: none !important;
}

#cl-shopping-order-page .newcheckbox input:checked ~ svg.active {
  display: block !important;
}

#cl-shopping-order-page .newcheckbox.disabled,
#cl-shopping-order-page .newcheckbox input:disabled ~ svg {
  opacity: .35;
  cursor: default;
}

#cl-shopping-order-page .notice-tr,
#cl-shopping-order-page .notice-tr:hover,
#cl-shopping-order-page .notice-tr.over {
  background: transparent !important;
  transition: none !important;
  pointer-events: none;
}

#cl-shopping-order-page .notice-td,
#cl-shopping-order-page .list-table td.notice-td,
#cl-shopping-order-page .notice-tr:hover .notice-td,
#cl-shopping-order-page .notice-tr.over .notice-td,
#cl-shopping-order-page .list-table tbody tr.notice-tr:hover td,
#cl-shopping-order-page .list-table tbody tr.notice-tr.over td {
  height: 430px !important;
  min-height: 430px !important;
  padding: 0 8px !important;
  background: #fff !important;
  color: var(--cl-text-sub);
  font-size: 13px;
  font-weight: 400;
  text-align: center;
  vertical-align: middle;
  transition: none !important;
}

@media (max-width: 1024px) {
  body.cl-dashboard-redesign-page #cl-shopping-order-page .cl-source-order-top-right {
    margin-left: 0;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page .btn-util-section {
    align-items: flex-start;
    flex-direction: column;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page .btn-option-group {
    flex-wrap: wrap;
    justify-content: flex-start;
    margin-left: 0;
  }
}

@media (min-width: 769px) and (max-width: 900px) {
  body.cl-dashboard-redesign-page #cl-shopping-order-page {
    margin-right: var(--cl-source-app-gutter);
    margin-left: var(--cl-source-app-gutter);
  }
}

@media (max-width: 768px) {
  #cl-shopping-order-page {
    margin-left: var(--cl-source-app-gutter);
    padding: 20px 16px 40px;
  }

  #cl-shopping-order-page .cl-source-order-panel {
    padding: 0 16px 22px;
  }

  #cl-shopping-order-page .submenu_nav {
    overflow-x: auto;
    align-items: center;
    -webkit-overflow-scrolling: touch;
  }

  #cl-shopping-order-page .submenu_nav::-webkit-scrollbar {
    height: 0;
  }

  #cl-shopping-order-page .submenu_nav ul {
    flex: none;
  }

  #cl-shopping-order-page .submenu_nav .sub-menu {
    padding-right: 14px;
    padding-left: 14px;
  }

  /* 레거시 고정 높이와 스크롤이 탭/필터/목록을 겹치지 않게 한다. */
  body.cl-dashboard-redesign-page #cl-shopping-order-page :is(#section-top-menu .sub-navbar, .submenu_nav) {
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page :is(#section-top-menu .sub-navbar, .submenu_nav)::-webkit-scrollbar {
    display: none;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page .btn-util-section {
    height: auto;
    min-height: 0;
    margin: 18px 0 14px;
    gap: 12px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page :is(.btn-batch-group, .btn-option-group) {
    float: none;
    flex-wrap: wrap;
    justify-content: flex-start;
    width: 100%;
    height: auto;
    margin: 0;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page .submenu_nav > ul:first-child {
    flex-wrap: nowrap !important;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page .order-list-area:not(.empty-list) {
    display: block;
    height: auto;
    min-height: 0;
    margin: 0;
    overflow: visible;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page .cl-source-order-scroll-hint {
    display: block;
    margin: 0 0 8px;
    color: var(--cl-text-sub);
    font-size: 12px;
    line-height: 1.5;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page .order-list-area:not(.empty-list) .cl-source-order-table-scroll {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page .order-list-area:not(.empty-list) .left-div {
    flex: 0 0 var(--cl-order-left-width, 440px);
    width: var(--cl-order-left-width, 440px);
    min-width: var(--cl-order-left-width, 440px);
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page .order-list-area:not(.empty-list) .right-div {
    display: flex;
    flex: 0 0 1000px;
    width: 1000px;
    min-width: 1000px;
    overflow: visible;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page .order-list-area:not(.empty-list) :is(.head-div, .body-div) {
    height: auto;
    max-height: none;
    overflow: visible;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page .order-list-area > .paging {
    position: static;
    gap: 2px;
    margin: 24px 0 0;
    background: transparent;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page .shop-pager .pg {
    flex: 0 1 30px;
    width: 30px;
    min-width: 0;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page .order-list-area.empty-list {
    position: relative;
    display: block;
    min-height: 260px;
    overflow: hidden;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page .order-list-area.empty-list .left-div {
    flex: 1 1 100%;
    width: 100%;
    min-width: 0;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page .order-list-area.empty-list .right-div {
    display: none;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page .order-list-area.empty-list .body-div {
    height: 0;
    min-height: 0;
    overflow: hidden;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page .order-list-area.empty-list .cl-source-order-empty-message {
    top: 45px;
    bottom: 46px;
    height: auto;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page .order-list-area.empty-list .paging {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    margin: 0;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page .notice-tr,
  body.cl-dashboard-redesign-page #cl-shopping-order-page .notice-td,
  body.cl-dashboard-redesign-page #cl-shopping-order-page .list-table td.notice-td {
    height: 200px !important;
    min-height: 200px !important;
  }


}

/* Order detail dialog */
body.cl-dashboard-redesign-page .cl-source-order-detail-modal {
  position: fixed;
  inset: 0;
  z-index: 999999;
  width: 100vw;
  height: 100vh;
  overflow: auto;
  overscroll-behavior: contain;
  background: rgba(0, 0, 0, .45);
  color: var(--cl-text);
  font-family: var(--cl-source-font);
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal *,
body.cl-dashboard-redesign-page .cl-source-order-detail-modal *::before,
body.cl-dashboard-redesign-page .cl-source-order-detail-modal *::after {
  box-sizing: border-box;
  letter-spacing: 0;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal .payment-box {
  position: relative;
  top: auto;
  left: auto;
  transform: none;
  width: calc(100% - 48px);
  max-width: 1280px;
  height: calc(100vh - 48px);
  max-height: calc(100vh - 48px);
  margin: 24px auto;
  padding: 0;
  overflow: hidden;
  overscroll-behavior: contain;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 14px;
  box-shadow: 0 24px 64px rgba(20, 24, 32, .24);
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal .close-btn-box {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 16px;
  right: 16px;
  width: 30px;
  height: 30px;
  padding: 0;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--cl-text-sub);
  z-index: 10;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal .close-btn-box svg {
  width: 15px;
  height: 15px;
  fill: currentColor;
  transition: transform .18s ease;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal .close-btn-box:hover,
body.cl-dashboard-redesign-page .cl-source-order-detail-modal .close-btn-box:focus-visible {
  background: #f1f2f5;
  color: var(--cl-text);
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal .close-btn-box:hover svg {
  transform: rotate(90deg);
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal .cl-order-detail-content {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  height: 100%;
  min-height: 0;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal .payment-list-box {
  display: flex;
  flex-direction: column;
  float: none;
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
  padding: 28px;
  overflow: hidden;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal .payment-box-subject {
  flex: none;
  padding: 0 32px 24px;
  color: var(--cl-text);
  font-size: 20px;
  font-weight: 800;
  line-height: 28px;
  text-align: center;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal .payment-table-box {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  height: auto;
  min-height: 0;
  overflow: hidden;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal #payment-list-body {
  flex: 1 1 auto;
  height: auto;
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal .payment-list-head {
  flex: none;
}

@media (min-width: 769px) {
  body.cl-dashboard-redesign-page .cl-source-order-detail-modal .payment-list-box {
    container-type: inline-size;
    container-name: cl-order-list;
  }

  body.cl-dashboard-redesign-page .cl-source-order-detail-modal .payment-table-box {
    --cl-order-check-width: 46px;
    --cl-order-image-width: 60px;
    --cl-order-code-width: 108px;
    --cl-order-count-width: 70px;
    --cl-order-price-width: 130px;
    --cl-order-delivery-width: 120px;
    --cl-order-status-width: 195px;
  }

  body.cl-dashboard-redesign-page .cl-source-order-detail-modal :is(.payment-list-head, #payment-list-body) {
    scrollbar-gutter: stable;
    scrollbar-width: thin;
  }

  body.cl-dashboard-redesign-page .cl-source-order-detail-modal .payment-list-head { overflow: hidden; }
  body.cl-dashboard-redesign-page .cl-source-order-detail-modal :is(.payment-list-head, #payment-list-body)::-webkit-scrollbar { width: 9px; }

  body.cl-dashboard-redesign-page .cl-source-order-detail-modal :is(.payment-table, #payment-list-body > .table) {
    width: 100%;
    table-layout: fixed;
    border-collapse: collapse;
  }

  body.cl-dashboard-redesign-page .cl-source-order-detail-modal :is(.payment-table, #payment-list-body > .table) > colgroup > col.col-responsive-1280:not(.hide):not([width="7"]) { display: table-column !important; }
  body.cl-dashboard-redesign-page .cl-source-order-detail-modal :is(.payment-table, #payment-list-body > .table) > colgroup > col.col-responsive-768,
  body.cl-dashboard-redesign-page .cl-source-order-detail-modal .payment-table > colgroup > col[width="7"],
  body.cl-dashboard-redesign-page .cl-source-order-detail-modal .payment-table-header > td:last-child:empty { display: none !important; }

  body.cl-dashboard-redesign-page .cl-source-order-detail-modal :is(.payment-table, #payment-list-body > .table) > colgroup > col:nth-child(1) { width: var(--cl-order-check-width); }
  body.cl-dashboard-redesign-page .cl-source-order-detail-modal :is(.payment-table, #payment-list-body > .table) > colgroup > col:nth-child(2) { width: var(--cl-order-image-width); }
  body.cl-dashboard-redesign-page .cl-source-order-detail-modal :is(.payment-table, #payment-list-body > .table) > colgroup > col:nth-child(3) { width: auto; }
  body.cl-dashboard-redesign-page .cl-source-order-detail-modal .payment-table .mng_product_code_col { width: var(--cl-order-code-width); }
  body.cl-dashboard-redesign-page .cl-source-order-detail-modal .payment-table .product_cnt_col { width: var(--cl-order-count-width); }
  body.cl-dashboard-redesign-page .cl-source-order-detail-modal .payment-table .product_price_col { width: var(--cl-order-price-width); }
  body.cl-dashboard-redesign-page .cl-source-order-detail-modal .payment-table .product_delivery_price_col,
  body.cl-dashboard-redesign-page .cl-source-order-detail-modal #payment-list-body > .table > colgroup > col:nth-child(4) { width: var(--cl-order-delivery-width); }
  body.cl-dashboard-redesign-page .cl-source-order-detail-modal .payment-table .product_delivery_info_col,
  body.cl-dashboard-redesign-page .cl-source-order-detail-modal #payment-list-body > .table > colgroup > col:nth-child(5) { width: var(--cl-order-status-width); }

  body.cl-dashboard-redesign-page .cl-source-order-detail-modal #payment-list-body .product-desc-box {
    display: grid;
    grid-template-columns: minmax(0, 1fr) var(--cl-order-count-width) var(--cl-order-price-width);
    align-items: center;
    width: 100%;
  }
  body.cl-dashboard-redesign-page .cl-source-order-detail-modal .payment-table-box #payment-list-body .detail-listbox td.product-desc-td { width: auto; }
  body.cl-dashboard-redesign-page .cl-source-order-detail-modal #payment-list-body .desc_mng_prd .product-desc-box {
    grid-template-columns: minmax(0, 1fr) var(--cl-order-code-width) var(--cl-order-count-width) var(--cl-order-price-width);
  }
  body.cl-dashboard-redesign-page .cl-source-order-detail-modal #payment-list-body .product-desc-box > :is(.product-desc, .mngPrCode, .prTotalCount, .prTotalPricePc) {
    width: auto;
    min-width: 0;
    max-width: none;
    margin: 0;
    overflow-wrap: anywhere;
  }

  @container cl-order-list (max-width: 800px) {
    body.cl-dashboard-redesign-page .cl-source-order-detail-modal .payment-table-box {
      --cl-order-check-width: 36px;
      --cl-order-image-width: 60px;
      --cl-order-code-width: 72px;
      --cl-order-count-width: 45px;
      --cl-order-price-width: 90px;
      --cl-order-delivery-width: 70px;
      --cl-order-status-width: 125px;
    }
  }
}

/* Coupon tables need more room than text-only guide popovers. */
body.cl-dashboard-redesign-page .popover.cl-source-help-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover):has(.cl-order-coupon-detail) {
  width: 400px !important;
  max-width: calc(100vw - 32px) !important;
}

body.cl-dashboard-redesign-page .popover .cl-order-coupon-detail > div:first-child {
  padding: 0 !important;
  color: var(--cl-text, #222428);
  font-size: 13px !important;
  font-weight: 700;
}

body.cl-dashboard-redesign-page .popover .cl-order-coupon-detail > div:last-child {
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .popover .cl-order-coupon-detail table {
  width: 100% !important;
  table-layout: fixed !important;
  border-collapse: collapse;
}

body.cl-dashboard-redesign-page .popover .cl-order-coupon-detail :is(th, td) {
  padding: 8px !important;
  border: 1px solid var(--cl-border, #E5E7EB) !important;
  color: var(--cl-text, #222428);
  font-size: 12px;
  font-weight: 400;
  line-height: 18px !important;
  vertical-align: middle;
  white-space: normal;
  overflow-wrap: anywhere;
}

body.cl-dashboard-redesign-page .popover .cl-order-coupon-detail th {
  width: auto !important;
  background: #F7F8FA !important;
  color: var(--cl-text-sub, #8A8F98);
  font-weight: 500 !important;
}

body.cl-dashboard-redesign-page .popover .cl-order-coupon-detail th:first-child { width: 52px !important; }
body.cl-dashboard-redesign-page .popover .cl-order-coupon-detail th:last-child { width: 84px !important; }
body.cl-dashboard-redesign-page .popover .cl-order-coupon-detail .coupon-info { text-align: left; }
body.cl-dashboard-redesign-page .popover .cl-order-coupon-detail .coupon-discount { text-align: right; }

body.cl-dashboard-redesign-page .popover .cl-order-coupon-detail :is(.coupon-info-inner, .product-name, .coupon-name, .coupon-item, .coupon-all) {
  display: block;
  width: auto;
  max-width: none;
  white-space: normal;
  overflow-wrap: anywhere;
}

body.cl-dashboard-redesign-page .popover .cl-order-coupon-detail :is(.coupon-item, .coupon-all) {
  color: var(--cl-text-sub, #8A8F98);
}

body.cl-dashboard-redesign-page .popover .cl-order-coupon-detail tr:last-child td {
  background: #F7F8FA !important;
  font-weight: 600;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal #order-group-number {
  flex: none;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 16px;
  padding: 0 0 16px;
  margin: 0;
  font-size: 13px;
  line-height: 20px;
  overflow-wrap: anywhere;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal .orderDate {
  float: none;
  margin-left: auto;
  color: var(--cl-text-sub);
  font-size: 12px;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal .payment-table-header td {
  height: 40px;
  background: #f7f8fa;
  border-top: 1px solid var(--cl-border);
  border-bottom: 1px solid var(--cl-border);
  color: var(--cl-text-sub);
  font-size: 12px;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal #payment-list-body .detail-listbox td {
  padding-top: 12px;
  padding-bottom: 12px;
  color: var(--cl-text);
  font-size: 13px;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal #payment-list-body .prDeliveryCompany {
  left: 0;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal #payment-list-body .prDeliveryCompany .order-status {
  font-size: 13px;
  line-height: 20px;
  font-weight: 500;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal #payment-list-body .prDeliveryCompany .order-status-F {
  color: var(--cl-green-text);
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal #payment-list-body .prDeliveryCompany .cl-order-delivery-help {
  display: inline-block;
  width: 14px;
  height: 14px;
  margin: 0 0 0 5px;
  vertical-align: middle;
  fill: var(--cl-green);
  color: var(--cl-green);
  cursor: pointer;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal #payment-list-body .prDeliveryCompany .cl-order-delivery-help path {
  fill: currentColor;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal #payment-list-body .prDeliveryCompany .delivery-type:has(.cl-order-delivery-help) {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  text-align: center;
  padding: 0;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal #payment-list-body .prDeliveryCompany .delivery-type > .cl-order-delivery-help {
  flex: 0 0 14px;
  margin: 0;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal #payment-list-body .cl-order-delivery-help:focus-visible {
  outline: 2px solid var(--cl-green);
  outline-offset: 3px;
  border-radius: 50%;
}

body.cl-dashboard-redesign-page:has(#payment-list-body) > .popover.cl-order-delivery-popover {
  z-index: 1000001 !important;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal #payment-list-body .cl-s-delivery-company-selector,
body.cl-dashboard-redesign-page .cl-source-order-detail-modal #payment-list-body .prDeliveryCompany input.hid-delivery-number {
  width: 150px;
  max-width: 100%;
  height: 40px;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  background: #fff;
  color: var(--cl-text);
  font-size: 13px;
  box-shadow: none;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal #payment-list-body .cl-s-delivery-company-selector {
  margin: 6px 0;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal #payment-list-body .prDeliveryCompany input.hid-delivery-number {
  padding: 0 12px;
  text-align: left;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal #payment-list-body .cl-s-delivery-company-selector > .select-box {
  height: 38px;
  padding: 0 30px 0 12px;
  color: inherit;
  font-size: 13px;
  line-height: 38px;
  text-align: left;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal #payment-list-body .selected-option-text {
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal #payment-list-body .selected-option > svg {
  display: none;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal #payment-list-body .cl-s-delivery-company-selector > .select-box::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 10px;
  width: 14px;
  height: 14px;
  transform: translateY(-50%);
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238a8f98' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center / contain no-repeat;
  pointer-events: none;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal #payment-list-body .cl-s-delivery-company-selector:not(.disabled):not(.readonly):is(:hover, .open),
body.cl-dashboard-redesign-page .cl-source-order-detail-modal #payment-list-body .prDeliveryCompany input.hid-delivery-number:enabled:not([readonly]):focus {
  border-color: var(--cl-green);
  outline: none;
  box-shadow: 0 0 0 2px rgba(3, 199, 90, .1);
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal #payment-list-body .cl-s-delivery-company-selector:is(.disabled, .readonly),
body.cl-dashboard-redesign-page .cl-source-order-detail-modal #payment-list-body .prDeliveryCompany input.hid-delivery-number:is(:disabled, [readonly]) {
  background: #f7f8fa !important;
  color: var(--cl-text-sub);
  cursor: default;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal #payment-list-body .cl-s-delivery-company-selector > .option-box {
  top: calc(100% + 4px);
  left: 0;
  width: 100%;
  max-height: 240px;
  margin: 0;
  padding: 4px;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(20, 24, 32, .14);
  text-align: left;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal #payment-list-body .delivery-company-option-box > div {
  min-height: 34px;
  padding: 8px 12px;
  border: 0;
  border-radius: 6px;
  color: var(--cl-text);
  font-size: 12.5px;
  font-weight: 400;
  line-height: 18px;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal #payment-list-body .delivery-company-option-box > div + div {
  margin-top: 2px;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal #payment-list-body .delivery-company-option-box > div:is(:hover, .active) {
  background: #e4f7ec;
  color: var(--cl-green-text);
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal #payment-list-body .delivery-company-option-box > div.active {
  font-weight: 700;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal #payment-list-body :is(.delivery-company-option-box, .selected-option-text) svg {
  width: 16px;
  height: 16px;
  top: 0;
  fill: var(--cl-green);
  vertical-align: middle;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal #payment-list-body :is(.delivery-company-option-box, .selected-option-text) svg path {
  fill: var(--cl-green);
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal #payment-list-body .prDeliveryCompanyMobile :is(.cl-s-delivery-company-selector, input.hid-delivery-number) {
  width: 100%;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal .popup-slide {
  float: none;
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
  margin: 0;
  padding: 76px 24px 24px;
  overflow: auto;
  overscroll-behavior: contain;
  background: #f5f7f9;
  border-left: 1px solid var(--cl-border);
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal .delivery-box {
  overflow: visible;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal .admin-order-delivery-info {
  width: 100%;
  margin-bottom: 24px;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--cl-border);
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal .admin-order-delivery-info > .info-subject {
  height: auto;
  padding: 0;
  margin: 0 0 12px;
  background: transparent;
  color: var(--cl-text);
  font-size: 14px;
  font-weight: 700;
  line-height: 22px;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal .admin-order-delivery-info > .info-body,
body.cl-dashboard-redesign-page .cl-source-order-detail-modal .admin-order-delivery-info > form {
  padding: 15px 16px !important;
  background: #fff;
  border: 0;
  font-size: 13px;
  line-height: 20px;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal #pay-info > .info-body.re_req_price {
  /* Override the legacy mobile delivery panel border reset. */
  border: 1px solid #03C75A !important;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal .info-body p {
  font-size: 13px;
  line-height: 20px;
  overflow-wrap: anywhere;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal .info-title {
  color: var(--cl-text-sub);
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal :is(input[type="text"], input[type="number"], textarea, select, .dropdown-toggle) {
  min-height: 40px;
  max-width: 100%;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  box-shadow: none;
  background: #fff;
  color: var(--cl-text);
  font-size: 13px;
  line-height: 20px;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal :is(input, textarea, select):focus {
  border-color: var(--cl-green);
  outline-color: var(--cl-green);
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal :is(input, textarea, select):disabled {
  background: #f7f8fa;
  color: var(--cl-text-sub);
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal .newcheckbox input[type="checkbox"] {
  position: static;
  display: inline-block;
  width: 16px;
  height: 16px;
  margin: 0;
  padding: 0;
  opacity: 1;
  appearance: none;
  -webkit-appearance: none;
  background: #fff;
  border: 1.5px solid #c9cdd4;
  border-radius: 4px;
  vertical-align: middle;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal .newcheckbox input[type="checkbox"]:checked {
  background: var(--cl-green) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12.5l4.2 4.2L19 6.5' fill='none' stroke='%23ffffff' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 12px 12px no-repeat;
  /* Legacy input:read-only also matches checkboxes. */
  background-color: var(--cl-green) !important;
  border-color: var(--cl-green);
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal .newcheckbox input[type="checkbox"]:focus-visible {
  outline: 2px solid var(--cl-green);
  outline-offset: 2px;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal .newcheckbox input[type="checkbox"]:disabled {
  opacity: .45;
  cursor: not-allowed;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal .newcheckbox svg {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal #popup-total-price {
  flex: none;
  padding: 18px 0;
  gap: 12px;
  flex-wrap: wrap;
  border-top: 1px solid var(--cl-border);
  color: var(--cl-text);
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal #submit-change {
  position: static;
  display: flex;
  flex: none;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 8px;
  width: 100%;
  height: auto;
  max-height: 30%;
  overflow: auto;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal #submit-change > span {
  display: none;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal #submit-change > button {
  position: static;
  float: none;
  flex: none;
  width: 100% !important;
  height: 46px;
  padding: 0 16px;
  margin: 0;
  border: 0;
  border-radius: 8px;
  background: var(--cl-green);
  color: #fff;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal #submit-change > button:hover {
  background: var(--cl-green-hover);
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal #submit-change > button {
  width: auto !important;
  max-width: 100%;
  height: 36px;
  font-size: 13px;
  line-height: 18px;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal #submit-change > :is([data-statustype="C"], #cancel-confirm, .order-wait) {
  background: #e5484d;
  color: #fff;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal #submit-change > button:is(:disabled, .disabled, .btn-disabled) {
  opacity: .45;
  cursor: not-allowed;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal :is(.c-blue, .state-title.blue) {
  color: var(--cl-green-text);
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal .popover {
  z-index: 1000001;
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(20, 24, 32, .16);
}

body.cl-dashboard-redesign-page:has(.cl-source-order-detail-modal[style*="display: block"]) > .flat-modal {
  z-index: 1000000 !important;
}

body.cl-dashboard-redesign-page:has(.cl-source-order-detail-modal[style*="display: block"]) > .popover {
  z-index: 1000001 !important;
}

body.cl-dashboard-redesign-page:has(.cl-source-order-detail-modal[style*="display: block"]) {
  overflow: hidden;
}

@media (max-width: 1000px) {
  body.cl-dashboard-redesign-page .cl-source-order-detail-modal .cl-order-detail-content {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: minmax(0, 1fr) minmax(0, 1fr);
  }

  body.cl-dashboard-redesign-page .cl-source-order-detail-modal .payment-list-box,
  body.cl-dashboard-redesign-page .cl-source-order-detail-modal .popup-slide {
    float: none;
    width: 100%;
    height: 100%;
    padding: 24px;
    border-left: 0;
  }

  body.cl-dashboard-redesign-page .cl-source-order-detail-modal .popup-slide {
    border-top: 1px solid var(--cl-border);
  }
}

@media (max-width: 767px) {
  body.cl-dashboard-redesign-page .cl-source-order-detail-modal .payment-box {
    width: calc(100% - 24px);
    height: calc(100vh - 24px);
    max-height: calc(100vh - 24px);
    margin: 12px auto;
  }

  body.cl-dashboard-redesign-page .cl-source-order-detail-modal .payment-list-box,
  body.cl-dashboard-redesign-page .cl-source-order-detail-modal .popup-slide {
    padding: 20px 16px;
  }

  body.cl-dashboard-redesign-page .cl-source-order-detail-modal .payment-box-subject {
    padding: 4px 30px 24px;
    font-size: 20px;
  }

  body.cl-dashboard-redesign-page .cl-source-order-detail-modal .orderDate {
    width: 100%;
    margin-left: 0;
  }
}

/* Inline order memo editor */
body.cl-dashboard-redesign-page .cl-source-order-detail-modal #admin-memo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  height: 36px;
  padding: 0 12px;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  background: #fff;
  color: var(--cl-text);
  font-size: 13px;
  font-weight: 600;
  line-height: 20px;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal #admin-memo::before {
  content: "+";
  font-size: 18px;
  font-weight: 400;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal #admin-memo:hover,
body.cl-dashboard-redesign-page .cl-source-order-detail-modal #admin-memo:focus-visible {
  border-color: var(--cl-green);
  background: var(--cl-green-soft);
  color: var(--cl-green-text);
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal #admin-memo-list:not(.msgFalse) {
  margin-top: 12px;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal .admin-memo-box {
  padding: 0;
  margin-bottom: 12px;
  background: transparent;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal .admin-memo-box textarea {
  display: block;
  width: 100%;
  min-height: 104px;
  padding: 10px 12px;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  background: #fff;
  color: var(--cl-text);
  font-family: inherit;
  font-size: 13px;
  line-height: 20px;
  resize: vertical;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal .admin-memo-box textarea::placeholder {
  color: var(--cl-text-muted);
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal .admin-memo-box textarea:focus {
  border-color: var(--cl-green);
  outline: 2px solid var(--cl-green-soft);
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal .admin-memo-box .admin-btn-box {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 10px;
  overflow: visible;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal .admin-memo-box .admin-btn-box > button {
  float: none;
  min-width: 64px;
  height: 34px;
  padding: 0 14px;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  background: #fff;
  color: var(--cl-text-sub);
  font-size: 13px;
  font-weight: 600;
  line-height: 20px;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal .admin-memo-box .admin-btn-box > .admin-memo-primary-btn {
  order: 1;
  border-color: var(--cl-green);
  background: var(--cl-green);
  color: #fff;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal .admin-memo-box .admin-btn-box > .admin-memo-primary-btn:hover {
  border-color: var(--cl-green-hover);
  background: var(--cl-green-hover);
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal .admin-memo-box .admin-btn-box > .admin-memo-cancel-btn:hover {
  background: #f7f8fa;
  color: var(--cl-text);
}

/* Order delivery edit dialog */
body.cl-dashboard-redesign-page .cl-source-order-detail-modal .delivery-edit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  width: auto;
  height: 28px;
  padding: 0 8px;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  background: #fff;
  color: var(--cl-text-sub);
  font-size: 12px;
  font-weight: 600;
  line-height: 18px;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .cl-source-order-detail-modal .delivery-edit:hover,
body.cl-dashboard-redesign-page .cl-source-order-detail-modal .delivery-edit:focus-visible {
  border-color: var(--cl-green);
  background: var(--cl-green-soft);
  color: var(--cl-green-text);
}

body.cl-dashboard-redesign-page > .flat-modal.cl-common-modal.cl-source-delivery-edit-wrap {
  position: fixed;
  inset: 0;
  z-index: 1000002 !important;
  padding: 24px 16px;
  overflow: auto;
  overscroll-behavior: contain;
  background: rgba(0, 0, 0, .45);
}

body.cl-dashboard-redesign-page .cl-source-delivery-edit-wrap + .modal-backdrop {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-delivery-edit-wrap .modal.modal-default {
  position: static !important;
  display: flex !important;
  align-items: flex-start;
  width: 100%;
  height: auto;
  min-height: 100%;
  margin: 0;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent;
}

body.cl-dashboard-redesign-page .cl-source-delivery-edit-wrap .modal-default > .cl-mobile-btn.close {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-delivery-edit-wrap .modal-dialog.cl-source-delivery-edit-modal {
  width: 100% !important;
  max-width: 520px !important;
  margin: auto !important;
  padding: 0 !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-source-delivery-edit-wrap .cl-source-delivery-edit-modal .modal-content {
  position: relative;
  padding: 32px !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 14px !important;
  background: #fff;
  box-shadow: 0 24px 64px rgba(20, 24, 32, .24);
}

body.cl-dashboard-redesign-page .cl-source-delivery-edit-wrap .cl-source-delivery-edit-modal .modal-body {
  width: 100% !important;
  max-width: none !important;
  max-height: none !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .cl-source-delivery-edit-wrap .cl-source-delivery-edit-modal .modal-title {
  margin: 0 24px 28px !important;
  color: var(--cl-text) !important;
  font-size: 20px !important;
  font-weight: 800 !important;
  line-height: 28px !important;
  text-align: center;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-delivery-edit-wrap .modal-default .modal-dialog.cl-source-delivery-edit-modal .modal-content > .close-button-dialog {
  position: absolute !important;
  top: 16px !important;
  right: 16px !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--cl-text-sub);
  opacity: 1;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-delivery-edit-wrap .modal-default .modal-dialog.cl-source-delivery-edit-modal .modal-content > .close-button-dialog svg {
  display: block;
  width: 15px !important;
  height: 15px !important;
  fill: currentColor;
  transition: transform .18s ease;
}

body.cl-dashboard-redesign-page .cl-source-delivery-edit-wrap .modal-content > .close-button-dialog:hover {
  background: #f1f2f5;
}

body.cl-dashboard-redesign-page .cl-source-delivery-edit-wrap .modal-content > .close-button-dialog:hover svg {
  transform: rotate(90deg);
}

body.cl-dashboard-redesign-page .cl-source-delivery-edit-wrap form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px 12px;
}

body.cl-dashboard-redesign-page .cl-source-delivery-edit-wrap .cl-common-form-wrap {
  grid-column: 1 / -1;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0;
}

body.cl-dashboard-redesign-page .cl-source-delivery-edit-wrap .cl-common-form-half {
  grid-column: auto;
}

body.cl-dashboard-redesign-page .cl-source-delivery-edit-wrap .cl-common-form-group {
  display: flex;
  flex-direction: column;
  gap: 7px;
  height: auto;
  padding: 0;
}

body.cl-dashboard-redesign-page .cl-source-delivery-edit-wrap .cl-common-form-group .cl-common-control-label {
  position: static !important;
  order: -1;
  margin: 0;
  padding: 0;
  transform: none !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px;
  line-height: 20px;
  letter-spacing: 0;
}

body.cl-dashboard-redesign-page .cl-source-delivery-edit-wrap .cl-common-form-group .cl-common-form-control {
  width: 100%;
  height: 40px;
  margin: 0;
  padding: 0 12px;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  background: #fff;
  color: var(--cl-text);
  font-size: 13px;
  line-height: 20px;
  letter-spacing: 0;
}

body.cl-dashboard-redesign-page .cl-source-delivery-edit-wrap .cl-common-form-control:focus {
  border-color: var(--cl-green);
  outline: 2px solid var(--cl-green-soft);
}

body.cl-dashboard-redesign-page .cl-source-delivery-edit-wrap .error .cl-common-form-control {
  border-color: var(--cl-danger);
}

body.cl-dashboard-redesign-page .cl-source-delivery-edit-wrap .cl-source-delivery-edit-modal form > button {
  grid-column: 1 / -1;
  float: none;
  width: 100%;
  height: 46px;
  padding: 0 16px;
  margin: 0 !important;
  border: 0;
  border-radius: 8px;
  font-size: 15px;
  font-weight: 700;
}

body.cl-dashboard-redesign-page .cl-source-delivery-edit-wrap .cl-source-delivery-edit-modal .popup-primary-btn {
  margin-top: 6px !important;
  background: var(--cl-green);
  color: #fff;
}

body.cl-dashboard-redesign-page .cl-source-delivery-edit-wrap .popup-primary-btn:hover {
  background: var(--cl-green-hover);
}

body.cl-dashboard-redesign-page .cl-source-delivery-edit-wrap .cl-source-delivery-edit-modal form > .cancel-btn {
  margin-top: -4px !important;
  background: transparent;
  color: var(--cl-text-sub);
  font-size: 13.5px;
  font-weight: 600;
}

body.cl-dashboard-redesign-page:has(:is(.cl-source-delivery-edit-wrap, .cl-source-order-workflow-wrap)) > .addr-modal-backdrop {
  z-index: 1000003 !important;
}

body.cl-dashboard-redesign-page:has(:is(.cl-source-delivery-edit-wrap, .cl-source-order-workflow-wrap)) > #addr-modal {
  z-index: 1000004 !important;
}

body.cl-dashboard-redesign-page:has(:is(.cl-source-delivery-edit-wrap, .cl-source-order-workflow-wrap)) > #addr-modal > .close > #btn-addr-close {
  width: 30px !important;
  height: 30px !important;
  border-radius: 8px !important;
}

@media (max-width: 767px) {
  body.cl-dashboard-redesign-page .cl-source-delivery-edit-wrap .cl-source-delivery-edit-modal .modal-content {
    padding: 32px 20px 24px !important;
  }
}

/* Shared order / cancellation / exchange / return workflow dialogs */
body.cl-dashboard-redesign-page > .flat-modal.cl-source-order-workflow-wrap {
  position: fixed !important;
  inset: 0 !important;
  z-index: var(--cl-order-modal-z, 1000002) !important;
  padding: 24px 16px !important;
  overflow: auto !important;
  overscroll-behavior: contain;
  background: rgba(0, 0, 0, .45) !important;
}

body.cl-dashboard-redesign-page .cl-source-order-workflow-wrap + .modal-backdrop {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-order-workflow-wrap .modal.modal-default {
  position: static !important;
  inset: auto !important;
  display: flex !important;
  align-items: flex-start;
  min-height: 100%;
  height: auto !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-order-workflow-wrap .modal-default > .cl-mobile-btn.close {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-order-workflow-wrap .modal.modal-default .modal-dialog.cl-source-order-workflow-modal {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  width: 100% !important;
  max-width: 560px !important;
  height: auto !important;
  min-height: 0 !important;
  margin: auto !important;
  padding: 0 !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-order-workflow-wrap .modal.modal-default .modal-dialog.cl-source-order-workflow-modal.cl-order-compact-alert {
  width: 440px !important;
  max-width: calc(100vw - 32px) !important;
}

@media (min-width: 768px) {
  body.cl-dashboard-redesign-page .flat-modal.cl-source-order-workflow-wrap .modal.modal-default .modal-dialog.cl-source-order-workflow-modal.cl-order-compact-alert .modal-content {
    padding-right: 28px !important;
    padding-left: 28px !important;
  }
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-order-workflow-wrap .modal.modal-default .modal-dialog.cl-source-order-workflow-modal .modal-content {
  position: relative;
  display: flow-root;
  min-height: 0 !important;
  height: auto !important;
  padding: 32px !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 14px !important;
  background: #fff !important;
  box-shadow: 0 24px 64px rgba(20, 24, 32, .24) !important;
  color: var(--cl-text);
  font-family: var(--cl-source-font);
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-order-workflow-wrap .modal.modal-default .modal-dialog.cl-source-order-workflow-modal .modal-body {
  display: flow-root;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  color: var(--cl-text-sub);
  font-size: 13px !important;
  line-height: 1.6;
  overflow-wrap: anywhere;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-order-workflow-wrap .modal.modal-default .modal-dialog.cl-source-order-workflow-modal .modal-title {
  margin: 0 24px 24px !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-size: 20px !important;
  font-weight: 800 !important;
  line-height: 28px !important;
  letter-spacing: 0;
  text-align: center;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-order-workflow-wrap .cl-source-order-workflow-modal .modal-title:empty {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-order-workflow-wrap .modal.modal-default .modal-dialog.cl-source-order-workflow-modal .modal-content > .close-button-dialog {
  position: absolute !important;
  top: 16px !important;
  right: 16px !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 8px;
  background: transparent !important;
  color: var(--cl-text-sub) !important;
  opacity: 1 !important;
  z-index: 1;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-order-workflow-wrap .modal.modal-default .modal-dialog.cl-source-order-workflow-modal .modal-content > .close-button-dialog svg {
  display: block;
  width: 15px !important;
  height: 15px !important;
  fill: currentColor !important;
  transition: transform .18s ease;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-order-workflow-wrap .modal.modal-default .modal-dialog.cl-source-order-workflow-modal .modal-content > .close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-order-workflow-wrap .modal.modal-default .modal-dialog.cl-source-order-workflow-modal .modal-content > .close-button-dialog:focus-visible {
  background: #f1f2f5 !important;
}

body.cl-dashboard-redesign-page .cl-source-order-workflow-modal .modal-content > .close-button-dialog:hover svg,
body.cl-dashboard-redesign-page .cl-source-order-workflow-modal .modal-content > .close-button-dialog:focus-visible svg {
  transform: rotate(90deg);
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-order-workflow-wrap .modal.modal-default .modal-dialog.cl-source-order-workflow-modal :is(.modal-footer, .btn-box) {
  display: flex;
  flex-direction: column;
  clear: both;
  gap: 14px;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  margin: 24px 0 0 !important;
  padding: 0 !important;
  border: 0;
  background: transparent;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-order-workflow-wrap .modal.modal-default .modal-dialog.cl-source-order-workflow-modal.cl-order-compact-alert .modal-footer {
  width: 384px !important;
  max-width: 100% !important;
  margin-right: auto !important;
  margin-left: auto !important;
}

body.cl-dashboard-redesign-page .cl-source-order-workflow-modal .modal-footer::before,
body.cl-dashboard-redesign-page .cl-source-order-workflow-modal .modal-footer::after {
  display: none;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-order-workflow-wrap .modal.modal-default .modal-dialog.cl-source-order-workflow-modal :is(.modal-footer > button, .popup-primary-btn, .cancel-btn, .btn-box > button) {
  position: static !important;
  float: none !important;
  display: block;
  flex: none;
  clear: both;
  width: 100% !important;
  max-width: none !important;
  min-height: 46px;
  height: auto;
  margin: 0 !important;
  padding: 12px 16px !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: var(--cl-green) !important;
  color: #fff !important;
  font-size: 15px !important;
  font-weight: 700;
  line-height: 22px !important;
  white-space: normal;
  box-shadow: none;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-order-workflow-wrap .modal.modal-default .modal-dialog.cl-source-order-workflow-modal form > .popup-primary-btn {
  margin-top: 24px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-order-workflow-wrap .cl-source-order-workflow-modal .payback-notice-text {
  display: flex;
  align-items: flex-start;
  float: none;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-order-workflow-wrap .cl-source-order-workflow-modal .payback-notice-text .payback-notice-icon {
  flex: none;
  float: none;
  fill: #ee445f;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-order-workflow-wrap .cl-source-order-workflow-modal .payback-notice-text .payback-notice-icon + p {
  flex: 1 1 auto;
  float: none;
  width: auto;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-order-workflow-wrap .modal.modal-default .modal-dialog.cl-source-order-workflow-modal form > .payback-notice-text + .popup-primary-btn {
  margin-top: 20px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-order-workflow-wrap .modal.modal-default .modal-dialog.cl-source-order-workflow-modal :is(.cancel-btn, .modal-footer > .close-button-dialog:not(.btn-primary)) {
  order: 1;
  background: transparent !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
  font-weight: 600;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-order-workflow-wrap .modal.modal-default .modal-dialog.cl-source-order-workflow-modal :is(.cancel-btn, .modal-footer > .close-button-dialog:not(.btn-primary)):not(:disabled):is(:hover, :focus) {
  background: #eaf9f1 !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-order-workflow-wrap .modal.modal-default .modal-dialog.cl-source-order-workflow-modal form > .popup-primary-btn + .cancel-btn {
  margin-top: 14px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-order-workflow-wrap .modal.modal-default .modal-dialog.cl-source-order-workflow-modal.cl-order-danger :is(.popup-primary-btn, .ok-button-dialog) {
  background: var(--cl-danger) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-order-workflow-wrap .cl-source-order-workflow-modal button:disabled {
  opacity: .45;
  cursor: not-allowed;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-order-workflow-wrap .cl-source-order-workflow-modal :is(form, .cancel-process) {
  display: flow-root;
  width: 100%;
  margin: 0;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-order-workflow-wrap .cl-source-order-workflow-modal :is(.cl-common-form-wrap, .cl-common-form-group) {
  min-width: 0;
  height: auto;
  padding: 0 !important;
  border: 0 !important;
  background: transparent;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-order-workflow-wrap .cl-source-order-workflow-modal .cl-common-form-wrap {
  margin-bottom: 14px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-order-workflow-wrap .cl-source-order-workflow-modal .cl-common-form-group {
  display: flex;
  flex-direction: column;
  gap: 7px;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-order-workflow-wrap .cl-source-order-workflow-modal .cl-common-control-label {
  position: static !important;
  order: -1;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  line-height: 20px !important;
  letter-spacing: 0;
  transform: none !important;
  text-align: left;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-order-workflow-wrap .cl-source-order-workflow-modal :is(input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]), textarea, select, .bootstrap-select > .btn) {
  width: 100%;
  max-width: 100%;
  min-height: 40px;
  height: 40px;
  margin: 0 !important;
  padding: 9px 12px !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 6px !important;
  background-color: #fff !important;
  color: var(--cl-text) !important;
  font-size: 13px !important;
  line-height: 20px !important;
  box-shadow: none;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-order-workflow-wrap .cl-source-order-workflow-modal textarea {
  min-height: 100px !important;
  resize: vertical;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-order-workflow-wrap .cl-source-order-workflow-modal :is(input, textarea, select):focus {
  border-color: var(--cl-green) !important;
  outline: 2px solid var(--cl-green-soft);
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-order-workflow-wrap .cl-source-order-workflow-modal :is(.error, .empty) :is(input, textarea, select) {
  border-color: var(--cl-danger) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-order-workflow-wrap .cl-source-order-workflow-modal :is(.common-selectbox, .bootstrap-select, .cl-s-prSearch-selectbox, .cl-s-popup-selectbox) {
  max-width: 100% !important;
  min-height: 40px;
  height: auto !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-order-workflow-wrap .cl-source-order-workflow-modal :is(.full-selectbox, .bootstrap-select) {
  width: 100% !important;
}

body.cl-dashboard-redesign-page .cl-source-order-workflow-modal .common-selectbox > svg {
  top: 20px !important;
  right: 12px;
  transform: translateY(-50%);
}

body.cl-dashboard-redesign-page .cl-source-order-workflow-modal .bootstrap-select .dropdown-menu {
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  box-shadow: 0 4px 12px rgba(20,24,32,.12);
  font-size: 13px;
}

body.cl-dashboard-redesign-page .cl-source-order-workflow-modal .bootstrap-select .dropdown-menu.inner {
  border: 0;
  box-shadow: none;
}

body.cl-dashboard-redesign-page .cl-source-order-workflow-modal .bootstrap-select > .btn {
  background-image: none !important;
}

body.cl-dashboard-redesign-page .cl-source-order-workflow-modal .cl-common-form-datepicker {
  position: relative;
}

body.cl-dashboard-redesign-page .cl-source-order-workflow-modal .cl-common-form-datepicker > svg {
  position: absolute;
  top: 12px;
  right: 12px;
  left: auto;
  width: 16px;
  height: 16px;
  fill: var(--cl-text-sub);
  pointer-events: none;
}

body.cl-dashboard-redesign-page .cl-source-order-workflow-modal .cl-common-form-wrap:has(> .cl-common-form-datepicker) {
  width: 100% !important;
}

body.cl-dashboard-redesign-page .cl-source-order-workflow-modal .uis-datepicker-mini {
  top: 46px !important;
  left: 0 !important;
  right: auto !important;
  width: 286px !important;
  max-width: 100%;
  margin: 0 !important;
  padding: 14px 12px 16px !important;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 12px 30px rgba(20,24,32,.16);
  z-index: 10;
}

body.cl-dashboard-redesign-page .cl-source-order-workflow-modal .uis-datepicker-mini .ui-datepicker {
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
}

body.cl-dashboard-redesign-page .cl-source-order-workflow-modal .uis-datepicker-mini .ui-datepicker-calendar {
  width: 100%;
}

body.cl-dashboard-redesign-page .cl-source-order-workflow-modal .uis-datepicker-mini .ui-datepicker-header {
  background: #fff;
  color: var(--cl-text);
  font-size: 14px;
}

body.cl-dashboard-redesign-page .cl-source-order-workflow-modal .uis-datepicker-mini .ui-datepicker-calendar td :is(a, span) {
  width: 28px;
  height: 28px;
  line-height: 28px;
  font-size: 13px;
}

body.cl-dashboard-redesign-page .cl-source-order-workflow-modal .uis-datepicker-mini .dp-highlight .ui-state-default {
  border-radius: 50%;
  background: var(--cl-green) !important;
  color: #fff !important;
}

/* Order search: shared modal shell with a single date-range control. */
body.cl-dashboard-redesign-page .flat-modal.cl-source-order-workflow-wrap .modal.modal-default .modal-dialog.cl-source-order-workflow-modal.cl-source-order-search-modal {
  max-width: 480px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-order-workflow-wrap .modal.modal-default .modal-dialog.cl-source-order-workflow-modal.cl-source-order-search-modal .modal-content {
  padding: 28px 28px 24px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-order-workflow-wrap .modal.modal-default .modal-dialog.cl-source-order-workflow-modal.cl-source-order-search-modal .modal-title {
  margin: 0 24px 22px !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  text-align: center;
}

body.cl-dashboard-redesign-page .cl-source-order-search-modal form {
  margin: 0;
}

body.cl-dashboard-redesign-page .cl-source-order-workflow-modal.cl-source-order-search-modal .sub-order-title {
  float: none;
  margin: 24px 0 8px !important;
  font-family: inherit;
  font-size: 13px !important;
  font-weight: 600;
}

body.cl-dashboard-redesign-page .cl-source-order-search-modal form > .sub-order-title:first-of-type {
  margin-top: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-order-search-modal .cl-order-search-date-range {
  position: relative;
  width: 100%;
}

body.cl-dashboard-redesign-page .cl-source-order-search-modal .cl-order-search-date-trigger {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-width: 210px;
  height: 35px;
  padding: 0 12px;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  background: #fff;
  color: var(--cl-text);
  font: 400 13px/1 var(--cl-source-font);
  white-space: nowrap;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .cl-source-order-search-modal .cl-order-search-date-trigger > svg {
  flex: none;
  color: var(--cl-text-sub);
}

body.cl-dashboard-redesign-page .cl-source-order-search-modal .cl-order-search-date-source {
  display: none;
}

body.cl-dashboard-redesign-page .cl-source-order-search-modal .cl-order-search-date-range + ul {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 8px 0 0;
  padding: 0;
  list-style: none;
}

body.cl-dashboard-redesign-page .cl-source-order-search-modal .cl-order-search-date-range + ul > .check-button {
  float: none;
  flex: 1 0 58px;
  width: auto;
  height: 35px;
  padding: 0;
  border: 0;
  border-radius: 6px;
  color: var(--cl-text-sub);
}

body.cl-dashboard-redesign-page .cl-source-order-search-modal .check-button .check-label-click {
  min-width: 58px;
  padding: 0 14px;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  background: #fff;
  color: inherit;
  font: 400 12px/1 var(--cl-source-font);
  white-space: nowrap;
  word-break: keep-all;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .cl-source-order-search-modal .check-button-active .check-label-click {
  border-color: var(--cl-green-line);
  background: var(--cl-green-soft);
  color: var(--cl-green-text);
}

body.cl-dashboard-redesign-page .cl-source-order-search-modal :is(.check-label-click, .cl-order-search-date-trigger):hover {
  border-color: var(--cl-green);
  color: var(--cl-green-text);
}

body.cl-dashboard-redesign-page .cl-source-order-search-modal :is(.check-label-click, .cl-order-search-date-trigger):focus-visible,
body.cl-dashboard-redesign-page .cl-source-order-search-modal .cl-order-search-date-trigger[aria-expanded="true"] {
  outline: none;
  border-color: var(--cl-green);
  box-shadow: 0 0 0 3px rgba(3,199,90,.13);
}

body.cl-dashboard-redesign-page .cl-source-order-search-modal .cl-s-popup-selectbox {
  float: none;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
}

body.cl-dashboard-redesign-page .cl-source-order-search-modal .cl-s-popup-selectbox * {
  font-family: var(--cl-source-font);
}

body.cl-dashboard-redesign-page .cl-source-order-search-modal .cl-s-popup-selectbox > .common-selectbox {
  float: none;
  flex: none;
  width: min(150px, 45%);
  max-width: none !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-order-workflow-wrap .modal.modal-default .modal-dialog.cl-source-order-workflow-modal.cl-source-order-search-modal .cl-s-popup-selectbox > .search_text {
  flex: 1 1 0;
  min-width: 0;
  height: 40px;
  min-height: 40px;
  padding: 0 12px;
  border-radius: 8px !important;
  font-size: 14px !important;
  line-height: 38px;
}

body.cl-dashboard-redesign-page .cl-source-order-search-modal .cl-s-popup-selectbox > .search_text::placeholder {
  color: var(--cl-text-muted);
  opacity: 1;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-order-workflow-wrap .cl-source-order-workflow-modal.cl-source-order-search-modal .bootstrap-select > .btn {
  display: flex;
  align-items: center;
  height: 40px !important;
  min-height: 40px;
  border-radius: 8px !important;
  padding: 0 32px 0 12px !important;
  font-size: 14px !important;
  line-height: 1 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-order-workflow-wrap .cl-source-order-workflow-modal.cl-source-order-search-modal .bootstrap-select > .btn > .filter-option {
  float: none !important;
  line-height: 18px;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-order-workflow-wrap .cl-source-order-workflow-modal.cl-source-order-search-modal .bootstrap-select .bs-caret {
  display: none;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-order-workflow-wrap .cl-source-order-workflow-modal.cl-source-order-search-modal .common-selectbox > .cl-order-search-select-chevron {
  top: 50% !important;
  left: auto;
  right: 12px;
  width: 14px;
  height: 14px;
  margin-top: 0;
  fill: none;
  color: var(--cl-text-sub);
  pointer-events: none;
  transform: translateY(-50%);
  transition: transform var(--cl-t-move, .18s) var(--cl-e-standard, cubic-bezier(.4,0,.2,1));
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-order-workflow-wrap .cl-source-order-workflow-modal.cl-source-order-search-modal .common-selectbox > .bootstrap-select.open ~ .cl-order-search-select-chevron {
  transform: translateY(-50%) rotate(180deg);
}

body.cl-dashboard-redesign-page .cl-source-order-search-modal .uis-datepicker-mini {
  top: 43px !important;
  border-radius: 12px;
}

body.cl-dashboard-redesign-page .cl-source-order-search-modal .uis-datepicker-mini :is(.ui-datepicker-prev-year, .ui-datepicker-next-year) {
  display: none;
}

body.cl-dashboard-redesign-page .cl-source-order-search-modal .uis-datepicker-mini :is(.ui-datepicker-prev, .ui-datepicker-next) svg {
  fill: none;
  color: var(--cl-text-sub);
}

body.cl-dashboard-redesign-page .cl-source-order-search-modal .uis-datepicker-mini .ui-datepicker-header {
  padding-bottom: 12px;
}

body.cl-dashboard-redesign-page .cl-source-order-search-modal .uis-datepicker-mini .ui-datepicker-title span {
  color: var(--cl-text);
  font-size: 14px;
  font-weight: 600;
  line-height: 28px;
}

body.cl-dashboard-redesign-page .cl-source-order-search-modal .uis-datepicker-mini :is(.ui-datepicker-prev, .ui-datepicker-next) {
  top: 0;
  width: 28px;
  height: 28px;
  line-height: 28px;
}

body.cl-dashboard-redesign-page .cl-source-order-search-modal .uis-datepicker-mini .ui-datepicker-prev { left: 0; }
body.cl-dashboard-redesign-page .cl-source-order-search-modal .uis-datepicker-mini .ui-datepicker-next { right: 0; }

body.cl-dashboard-redesign-page .cl-source-order-search-modal .uis-datepicker-mini .ui-datepicker-calendar th span {
  width: auto;
  color: var(--cl-text-sub);
  font-size: 12px;
}

body.cl-dashboard-redesign-page .cl-source-order-search-modal .uis-datepicker-mini .dp-highlight::before,
body.cl-dashboard-redesign-page .cl-source-order-search-modal .uis-datepicker-mini .dp-highlight .ui-state-default::after {
  display: none;
}

body.cl-dashboard-redesign-page .cl-source-order-search-modal .uis-datepicker-mini .dp-highlight .ui-state-default {
  width: 28px !important;
  margin: 0 auto;
  padding: 0;
}

body.cl-dashboard-redesign-page .cl-source-order-workflow-modal.cl-source-order-search-modal .uis-datepicker-mini .dp-highlight.pd-between .ui-state-default {
  width: 100% !important;
  border-radius: 0;
  background: var(--cl-green-soft) !important;
  color: var(--cl-text) !important;
}

body.cl-dashboard-redesign-page:has(.cl-source-order-workflow-wrap) > .popover {
  z-index: calc(var(--cl-order-address-z, 1000004) - 1) !important;
}

body.cl-dashboard-redesign-page .cl-source-order-workflow-modal .sub-order-title {
  clear: both;
  margin: 20px 0 10px !important;
  color: var(--cl-text);
  font-size: 14px !important;
  font-weight: 700;
  line-height: 22px;
}

body.cl-dashboard-redesign-page .cl-source-order-workflow-modal :is(.cancel-contents, .contents-warring, .escrow-warring, .cl-common-warring, .tracking-upload-desc, .cancel-confirm-text) {
  clear: both;
  color: var(--cl-text-sub);
  font-size: 13px !important;
  line-height: 1.6 !important;
  text-align: left;
}

body.cl-dashboard-redesign-page .cl-source-order-workflow-modal :is(.cl-common-warring, .contents-warring) > span {
  color: inherit;
}

body.cl-dashboard-redesign-page .cl-source-order-workflow-modal .cancel-contents a,
body.cl-dashboard-redesign-page .cl-source-order-workflow-modal .point-used-desc .point-color {
  color: var(--cl-green-text);
}

body.cl-dashboard-redesign-page .cl-source-order-workflow-modal .cancel-process > svg {
  display: block;
  width: 40px;
  height: 40px;
  margin: 0 auto 20px;
}

body.cl-dashboard-redesign-page .cl-source-order-workflow-modal svg :is([fill="#4789e7"], [fill="#4789E7"]) {
  fill: var(--cl-green);
}

body.cl-dashboard-redesign-page .cl-source-order-workflow-modal .nobank-container :is(.contents, table) {
  width: 100%;
  margin: 0;
}

body.cl-dashboard-redesign-page .cl-source-order-workflow-modal .nobank-container td {
  padding: 12px 8px;
  border-bottom: 1px solid var(--cl-border);
  font-size: 13px;
  overflow-wrap: anywhere;
}

/* 입금대기 정보: 값이 긴 계좌번호·날짜에 모바일 열 너비를 우선 배정한다. */
@media (max-width: 767px) {
  body.cl-dashboard-redesign-page .cl-source-order-workflow-modal .nobank-container col:first-child {
    width: 76px;
  }
  body.cl-dashboard-redesign-page .cl-source-order-workflow-modal .nobank-container col:last-child {
    width: auto;
  }
  body.cl-dashboard-redesign-page .cl-source-order-workflow-modal .nobank-container td:first-child {
    padding-left: 0;
    padding-right: 8px;
    white-space: nowrap;
  }
  body.cl-dashboard-redesign-page .cl-source-order-workflow-modal .nobank-container td:last-child {
    padding-left: 0;
    padding-right: 0;
  }
  body.cl-dashboard-redesign-page .cl-source-order-workflow-modal .nobank-container :is(.cl-nobank-account-number, .cl-nobank-deadline) {
    word-break: normal;
    overflow-wrap: normal;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
  }
}

body.cl-dashboard-redesign-page .cl-source-order-workflow-modal :is(.newcheckbox, .delivery-type-box) label {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-left: 0 !important;
  font-size: 13px;
  line-height: 20px;
}

body.cl-dashboard-redesign-page .cl-source-order-workflow-modal :is(input[type="radio"], input[type="checkbox"]) {
  position: static !important;
  display: inline-block !important;
  flex: none;
  width: 16px !important;
  height: 16px !important;
  min-height: 0;
  margin: 0 !important;
  padding: 0 !important;
  border: 1.5px solid #c9cdd4 !important;
  border-radius: 4px;
  appearance: none;
  opacity: 1 !important;
  background: #fff !important;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .cl-source-order-workflow-modal input[type="checkbox"]:checked {
  border-color: var(--cl-green) !important;
  background: var(--cl-green) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12.5l4.2 4.2L19 6.5' fill='none' stroke='%23ffffff' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 12px 12px no-repeat !important;
}

body.cl-dashboard-redesign-page .cl-source-order-workflow-modal input[type="radio"] {
  width: 18px !important;
  height: 18px !important;
  border-radius: 50%;
}

body.cl-dashboard-redesign-page .cl-source-order-workflow-modal input[type="radio"]:checked {
  border-color: var(--cl-green) !important;
  background: radial-gradient(circle, var(--cl-green) 0 4px, #fff 4.5px) !important;
}

body.cl-dashboard-redesign-page .cl-source-order-workflow-modal :is(input[type="radio"], input[type="checkbox"]):disabled {
  opacity: .45 !important;
  cursor: not-allowed;
}

body.cl-dashboard-redesign-page .cl-source-order-workflow-modal :is(input[type="radio"], input[type="checkbox"]) ~ svg {
  display: none !important;
}

body.cl-dashboard-redesign-page:has(.cl-source-order-workflow-wrap) > #addr-modal {
  z-index: var(--cl-order-address-z, 1000004) !important;
}

body.cl-dashboard-redesign-page:has(.cl-source-order-workflow-wrap) > .addr-modal-backdrop {
  z-index: calc(var(--cl-order-address-z, 1000004) - 1) !important;
}

@media (max-width: 767px) {
  body.cl-dashboard-redesign-page .flat-modal.cl-source-order-workflow-wrap .modal.modal-default .modal-dialog.cl-source-order-workflow-modal .modal-content {
    padding: 32px 20px 24px !important;
  }
}

/* Shopping order lookup page */
#cl-shopping-order-search-page {
  width: auto;
  max-width: none;
  margin-top: 0;
  margin-right: var(--cl-source-app-gutter);
  margin-left: calc(var(--cl-source-app-gutter) + var(--cl-source-sidebar-w));
  padding: 28px 32px 60px;
  background: transparent;
  color: var(--cl-text);
}

#cl-shopping-order-search-page,
#cl-shopping-order-search-page * {
  box-sizing: border-box;
}

#cl-shopping-order-search-page > .cl-source-shopping-order-search-shell,
#cl-shopping-order-search-page .cl-source-order-search-content,
#cl-shopping-order-search-page .dashbottom-wrap,
#cl-shopping-order-search-page .dashbottom-container {
  float: none !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 0;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent;
  border: 0;
  box-shadow: none;
}

#cl-shopping-order-search-page .dashbottom-container {
  display: block;
}

#cl-shopping-order-search-page .cl-source-order-search-head {
  margin: 0 0 18px;
}

#cl-shopping-order-search-page .cl-source-order-search-breadcrumb {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  color: var(--cl-text);
  font-size: 20px;
  font-weight: 700;
  line-height: 1.35;
}

#cl-shopping-order-search-page .cl-source-order-search-breadcrumb .sep {
  color: var(--cl-text-muted);
  font-size: 23px;
  font-weight: 400;
  line-height: 1;
}

#cl-shopping-order-search-page .cl-source-order-search-breadcrumb .current {
  color: var(--cl-text-sub);
  font-weight: 700;
}

#cl-shopping-order-search-page .cl-source-order-search-desc {
  margin: 10px 0 0;
  color: var(--cl-text-sub);
  font-size: 13px;
  font-weight: 400;
  line-height: 1.45;
}

#cl-shopping-order-search-page .cl-source-order-search-panel {
  overflow: visible;
  width: 100%;
  min-height: 680px;
  padding: 22px 24px 26px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 14px;
  box-shadow: 0 2px 6px rgba(24, 39, 75, .04);
}

#cl-shopping-order-search-page #section-top-menu,
#cl-shopping-order-search-page .mobile-title {
  display: none !important;
}

#cl-shopping-order-search-page .section-search-container {
  width: 100%;
  margin: 0 0 22px;
  padding: 6px 22px 22px;
  overflow: visible;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 10px;
  box-shadow: var(--cl-shadow-panel);
}

#cl-shopping-order-search-page .section-search {
  width: 100%;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
}

#cl-shopping-order-search-page .search-box {
  width: 100%;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

#cl-shopping-order-search-page .search-box > ul {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  width: 100%;
  min-height: 0;
  margin: 0;
  padding: 15px 0;
  border-bottom: 1px solid #f1f2f5;
  list-style: none;
}

#cl-shopping-order-search-page .search-box > ul:last-child {
  border-bottom: 1px solid #f1f2f5;
}

#cl-shopping-order-search-page .search-box > ul > li {
  float: none;
  min-height: 0;
  margin: 0;
  padding: 0;
  color: var(--cl-text);
  font-size: 13.5px;
  line-height: 34px;
}

#cl-shopping-order-search-page .search-box > ul > li:first-child {
  flex: 0 0 74px;
  width: 74px;
  color: var(--cl-text);
  font-size: 13.5px;
  font-weight: 700;
  line-height: 34px;
}

#cl-shopping-order-search-page .search-box > ul > li:not(:first-child) {
  flex: 1 1 auto;
  min-width: 0;
}

#cl-shopping-order-search-page .search-box > ul:first-child {
  align-items: center;
}

body.cl-dashboard-redesign-page #cl-shopping-order-search-page .search-box > ul:nth-child(3) > li:nth-child(2) {
  position: static;
  flex: 0 0 auto;
}

#cl-shopping-order-search-page .search-box > ul:nth-child(3) > li.status-condition {
  flex: 1 1 auto;
  justify-content: flex-start;
}

#cl-shopping-order-search-page .cl-s-productSearch,
#cl-shopping-order-search-page .keyword-box,
#cl-shopping-order-search-page .status-condition {
  display: flex !important;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  width: auto;
  min-width: 0;
}

#cl-shopping-order-search-page .search-box > ul:first-child .cl-s-productSearch {
  align-items: center;
  flex-wrap: nowrap;
  gap: 0;
  width: 100%;
}

#cl-shopping-order-search-page .duration {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 34px;
  min-width: 0;
  margin: 0;
  padding: 0 14px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-right: 0;
  border-radius: 0;
  color: var(--cl-text-sub);
  cursor: pointer;
  transition: background-color .12s, border-color .12s, color .12s;
}

#cl-shopping-order-search-page .duration:first-child {
  border-radius: 6px 0 0 6px;
}

#cl-shopping-order-search-page .duration:nth-child(4) {
  border-right: 1px solid var(--cl-border);
  border-radius: 0 6px 6px 0;
}

#cl-shopping-order-search-page .duration + .duration {
  margin-left: 0;
}

#cl-shopping-order-search-page .duration span {
  height: auto;
  color: inherit;
  font-size: 13px;
  font-weight: 600;
  line-height: 32px;
}

#cl-shopping-order-search-page .duration:hover {
  background: #fafbfc;
  color: var(--cl-green-text);
}

#cl-shopping-order-search-page .duration.active {
  background: #e4f7ec;
  border-color: var(--cl-border);
  color: var(--cl-green-text);
  font-weight: 700;
}

#cl-shopping-order-search-page .duration.active + .duration {
  border-left-color: var(--cl-border);
}

#cl-shopping-order-search-page .change-date-box {
  display: flex;
  align-items: center;
  align-self: center;
  width: auto;
  height: 34px;
  margin: 0 0 0 8px;
  color: var(--cl-text-muted);
  font-size: 13px;
  line-height: 34px;
}

#cl-shopping-order-search-page .order-vcal-wrap {
  position: relative;
  display: flex;
  align-items: center;
  height: 34px;
  z-index: 30;
}

#cl-shopping-order-search-page .order-vcal-wrap .vperiod {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: auto;
  height: 34px;
  margin: 0;
  padding: 0 12px;
  box-sizing: border-box;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
  color: var(--cl-text);
  font-size: 12.5px;
  font-weight: 600;
  line-height: 1;
  cursor: pointer;
  transition: border-color .12s, background .12s, box-shadow .12s;
}

#cl-shopping-order-search-page .order-vcal-wrap .vperiod:hover {
  background: #fafbfc;
  border-color: #d5d9e0;
}

#cl-shopping-order-search-page .order-vcal-wrap .vperiod:focus-visible {
  outline: none;
  border-color: var(--cl-green);
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .18);
}

#cl-shopping-order-search-page .order-vcal-wrap .vperiod > svg {
  flex: none;
  width: 14px;
  height: 14px;
  color: var(--cl-text-muted);
}

#cl-shopping-order-search-page .order-vcal-wrap .vperiod-dash {
  color: var(--cl-text-muted);
  font-weight: 500;
}

#cl-shopping-order-search-page .order-vcal-wrap .vcal {
  display: none;
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 300;
  width: 288px;
  padding: 14px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 12px;
  box-shadow: 0 12px 30px rgba(20, 24, 32, .16);
}

#cl-shopping-order-search-page .order-vcal-wrap .vcal.open {
  display: block;
}

#cl-shopping-order-search-page .order-vcal-wrap .vcal-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
}

#cl-shopping-order-search-page .order-vcal-wrap .vcal-title {
  color: var(--cl-text);
  font-size: 13.5px;
  font-weight: 700;
}

#cl-shopping-order-search-page .order-vcal-wrap .vcal-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 6px;
  color: var(--cl-text-sub);
  cursor: pointer;
}

#cl-shopping-order-search-page .order-vcal-wrap .vcal-nav:hover {
  background: #f4f5f9;
  color: var(--cl-text);
}

#cl-shopping-order-search-page .order-vcal-wrap .vcal-nav svg {
  width: 16px;
  height: 16px;
}

#cl-shopping-order-search-page .order-vcal-wrap .vcal-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
}

#cl-shopping-order-search-page .order-vcal-wrap .vcal-wd {
  padding: 4px 0 6px;
  color: var(--cl-text-muted);
  font-size: 11px;
  font-weight: 700;
  text-align: center;
}

#cl-shopping-order-search-page .order-vcal-wrap .vcal-wd.sun {
  color: #e5484d;
}

#cl-shopping-order-search-page .order-vcal-wrap .vcal-wd.sat {
  color: var(--cl-green-text);
}

#cl-shopping-order-search-page .order-vcal-wrap .vcal-day {
  position: relative;
  padding: 7px 0;
  color: var(--cl-text);
  font-size: 12.5px;
  text-align: center;
  cursor: pointer;
}

#cl-shopping-order-search-page .order-vcal-wrap .vcal-day.other {
  color: var(--cl-text-muted);
  opacity: .45;
}

#cl-shopping-order-search-page .order-vcal-wrap .vcal-day:hover:not(.sel):not(.disabled) {
  background: #f1f2f5;
  border-radius: 6px;
}

#cl-shopping-order-search-page .order-vcal-wrap .vcal-day.in-range {
  background: #e4f7ec;
  color: var(--cl-green-text);
}

#cl-shopping-order-search-page .order-vcal-wrap .vcal-day.in-range:hover {
  background: #d6f0e0;
  border-radius: 0;
}

#cl-shopping-order-search-page .order-vcal-wrap .vcal-day.sel {
  z-index: 1;
  background: var(--cl-green);
  border-radius: 6px;
  color: #fff;
  font-weight: 700;
}

#cl-shopping-order-search-page .order-vcal-wrap .vcal-day.range-start {
  border-radius: 6px 0 0 6px;
}

#cl-shopping-order-search-page .order-vcal-wrap .vcal-day.range-end {
  border-radius: 0 6px 6px 0;
}

#cl-shopping-order-search-page .order-vcal-wrap .vcal-day.today::after {
  position: absolute;
  bottom: 3px;
  left: 50%;
  width: 4px;
  height: 4px;
  background: var(--cl-green);
  border-radius: 50%;
  content: "";
  transform: translateX(-50%);
}

#cl-shopping-order-search-page .order-vcal-wrap .vcal-day.sel.today::after {
  background: #fff;
}

#cl-shopping-order-search-page .order-vcal-wrap .vcal-day.disabled {
  color: var(--cl-text-muted);
  cursor: default;
  opacity: .28;
}

#cl-shopping-order-search-page .cl-source-order-search-naver {
  flex: 0 0 auto !important;
  width: auto !important;
  margin-left: auto !important;
  line-height: 34px;
}

#cl-shopping-order-search-page .btn-naverpay-sync {
  position: static !important;
  float: none !important;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  height: 34px;
  margin: 0 !important;
  padding: 0 13px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  box-shadow: none;
  color: var(--cl-text-sub);
  font-size: 12.5px;
  font-weight: 600;
  line-height: 32px;
  white-space: nowrap;
  transition: background-color .12s, border-color .12s, color .12s;
}

#cl-shopping-order-search-page .btn-naverpay-sync-pc {
  display: inline-flex !important;
}

#cl-shopping-order-search-page .btn-naverpay-sync.shopping_disabled,
#cl-shopping-order-search-page .btn-naverpay-sync.ss_user_noActive,
#cl-shopping-order-search-page .btn-naverpay-sync.shopping_disabled:hover,
#cl-shopping-order-search-page .btn-naverpay-sync.ss_user_noActive:hover {
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  color: var(--cl-text-sub) !important;
  opacity: 1;
}

#cl-shopping-order-search-page .btn-naverpay-sync:hover {
  background: #fafbfc;
  border-color: #d5d9e0;
  color: var(--cl-text);
}

#cl-shopping-order-search-page .cl-source-order-naver-badge {
  display: inline-flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  border-radius: 3px;
  background: #03c75a;
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  line-height: 16px;
}

#cl-shopping-order-search-page .btn-naverpay-sync .ico-naverpay {
  flex: none;
  width: 16px;
  height: 16px;
  fill: #03c75a;
}

#cl-shopping-order-search-page .common-selectbox {
  --cl-order-select-width: 112px;
  --cl-order-select-height: 34px;
  --cl-order-select-inner-height: 32px;
  --cl-order-select-padding-start: 12px;
  --cl-order-select-padding-end: 30px;
  position: relative;
  display: inline-flex;
  align-items: center;
  width: auto;
  height: var(--cl-order-select-height);
  min-width: var(--cl-order-select-width);
  margin: 0;
  padding: 0;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  box-shadow: none;
  transition: background-color .12s, border-color .12s;
}

#cl-shopping-order-search-page .common-selectbox:hover,
#cl-shopping-order-search-page .common-selectbox:focus-within {
  background: #fafbfc;
  border-color: #d5d9e0;
}

#cl-shopping-order-search-page .common-selectbox select {
  width: 100%;
  min-width: var(--cl-order-select-width);
  height: var(--cl-order-select-inner-height);
  margin: 0;
  padding: 0 var(--cl-order-select-padding-end) 0 var(--cl-order-select-padding-start);
  appearance: none;
  -webkit-appearance: none;
  background: transparent;
  border: 0;
  box-shadow: none;
  color: var(--cl-text);
  font-size: 13px;
  font-weight: 400;
  line-height: var(--cl-order-select-inner-height);
  outline: none;
  cursor: pointer;
}

#cl-shopping-order-search-page .common-selectbox > .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn) {
  width: 100% !important;
  max-width: none;
  height: var(--cl-order-select-inner-height);
}

#cl-shopping-order-search-page .common-selectbox > .bootstrap-select .dropdown-toggle .bs-caret {
  display: none;
}

#cl-shopping-order-search-page .common-selectbox > .bootstrap-select .btn.btn-default,
#cl-shopping-order-search-page .common-selectbox > .bootstrap-select .btn.btn-default:hover,
#cl-shopping-order-search-page .common-selectbox > .bootstrap-select .btn.btn-default:focus,
#cl-shopping-order-search-page .common-selectbox > .bootstrap-select .btn.btn-default:active,
#cl-shopping-order-search-page .common-selectbox > .bootstrap-select.open .btn.btn-default {
  width: 100% !important;
  max-width: none;
  height: var(--cl-order-select-inner-height) !important;
  min-height: var(--cl-order-select-inner-height);
  margin: 0;
  padding: 0 var(--cl-order-select-padding-end) 0 var(--cl-order-select-padding-start) !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0;
  box-shadow: none !important;
  color: var(--cl-text) !important;
  font-size: 13px !important;
  font-weight: 400;
  line-height: var(--cl-order-select-inner-height) !important;
  outline: 0 !important;
}

#cl-shopping-order-search-page .common-selectbox > .bootstrap-select .filter-option {
  left: var(--cl-order-select-padding-start);
  right: var(--cl-order-select-padding-end);
  width: auto;
  height: var(--cl-order-select-inner-height);
  padding: 0;
  overflow: visible;
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: var(--cl-order-select-inner-height);
  white-space: nowrap;
}

#cl-shopping-order-search-page .common-selectbox > .bootstrap-select .filter-option-inner,
#cl-shopping-order-search-page .common-selectbox > .bootstrap-select .filter-option-inner-inner {
  height: var(--cl-order-select-inner-height);
  overflow: visible;
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: var(--cl-order-select-inner-height);
  white-space: nowrap;
}

#cl-shopping-order-search-page .common-selectbox > .bootstrap-select > .dropdown-menu {
  top: var(--cl-select-menu-top, calc(100% + 4px));
  min-width: 100%;
  margin: 0;
  padding: 4px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(20, 24, 32, .14);
}

#cl-shopping-order-search-page .common-selectbox > .bootstrap-select .dropdown-menu.inner {
  position: static;
  min-width: 0;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

#cl-shopping-order-search-page .common-selectbox > .bootstrap-select .dropdown-menu > li > a {
  min-height: 0;
  padding: 8px 12px;
  border-radius: 6px;
  color: var(--cl-text);
  font-size: 12.5px;
  font-weight: 400;
  line-height: 18px;
}

#cl-shopping-order-search-page .common-selectbox > .bootstrap-select .dropdown-menu > li > a:hover,
#cl-shopping-order-search-page .common-selectbox > .bootstrap-select .dropdown-menu > li > a:focus,
#cl-shopping-order-search-page .common-selectbox > .bootstrap-select .dropdown-menu > .active > a,
#cl-shopping-order-search-page .common-selectbox > .bootstrap-select .dropdown-menu > .active > a:hover,
#cl-shopping-order-search-page .common-selectbox > .bootstrap-select .dropdown-menu > .active > a:focus {
  background: #e4f7ec;
  color: var(--cl-green-text);
}

#cl-shopping-order-search-page .common-selectbox > .bootstrap-select .dropdown-menu > .active > a {
  font-weight: 700;
}

#cl-shopping-order-search-page .common-selectbox > svg {
  display: none;
}

#cl-shopping-order-search-page .common-selectbox::after,
#cl-shopping-order-search-page .checkbox-title::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 8px;
  width: 14px;
  height: 14px;
  margin-top: -7px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238A8F98' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 14px;
  pointer-events: none;
  transition: transform .12s, background-image .12s;
}

#cl-shopping-order-search-page .checkbox-title.is-open::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2303C75A' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  transform: rotate(180deg);
}

#cl-shopping-order-search-page .keyword {
  width: min(420px, 100%);
  height: 34px;
  margin: 0;
  padding: 0 12px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  color: var(--cl-text);
  font-size: 13px;
  font-weight: 400;
  line-height: 32px;
  outline: none;
}

#cl-shopping-order-search-page .keyword:focus {
  border-color: var(--cl-green);
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .1);
}

body.cl-dashboard-redesign-page #cl-shopping-order-search-page .all-checkbox-title {
  position: static;
  display: inline-flex;
  align-items: center;
  height: 34px;
  margin: 0 2px 0 0;
}

#cl-shopping-order-search-page .section-search input[type=checkbox],
#cl-shopping-order-search-page .list-section-search input[type=checkbox] {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: 0;
  opacity: 0;
  pointer-events: none;
}

#cl-shopping-order-search-page .section-search input[type=checkbox] + label,
#cl-shopping-order-search-page .list-section-search input[type=checkbox] + label {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  height: auto;
  margin: 0;
  color: var(--cl-text);
  font-size: 13px;
  font-weight: 600;
  line-height: 18px;
  cursor: pointer;
}

#cl-shopping-order-search-page .section-search input[type=checkbox] + label svg,
#cl-shopping-order-search-page .list-section-search input[type=checkbox] + label svg {
  flex: none;
  width: 16px;
  height: 16px;
  margin: 0;
  fill: #b9c1cc;
}

#cl-shopping-order-search-page .section-search input[type=checkbox]:checked + label svg,
#cl-shopping-order-search-page .list-section-search input[type=checkbox]:checked + label svg {
  fill: var(--cl-green);
}

#cl-shopping-order-search-page .checkbox-title {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-width: 104px;
  height: 34px;
  margin: 0 0 0 8px;
  padding: 0 30px 0 13px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  box-shadow: none;
  color: var(--cl-text-sub);
  cursor: pointer;
  font-size: 13px;
  font-weight: 600;
  line-height: 32px;
  transition: background-color .12s, border-color .12s, color .12s;
  vertical-align: top;
}

#cl-shopping-order-search-page .status-condition .checkbox-title {
  margin-left: 0;
}

#cl-shopping-order-search-page .checkbox-title:hover {
  background: #fafbfc;
  border-color: #d5d9e0;
  color: var(--cl-text);
}

#cl-shopping-order-search-page .checkbox-title.is-open {
  background: #fff;
  border-color: var(--cl-green);
  color: var(--cl-green-text);
}

#cl-shopping-order-search-page .checkbox-title span {
  padding: 0;
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  vertical-align: baseline;
}

#cl-shopping-order-search-page .checkbox-title > svg {
  display: none;
}

#cl-shopping-order-search-page .checkbox-item {
  position: absolute;
  z-index: 220;
  display: none;
  min-width: 190px;
  max-width: min(320px, calc(100vw - 32px));
  padding: 6px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(20, 24, 32, .14);
  user-select: none;
}

#cl-shopping-order-search-page .checkbox-item > ul {
  min-width: 0;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  list-style: none;
}

#cl-shopping-order-search-page .checkbox-item > ul > li {
  min-height: 0;
  margin: 0;
  padding: 0;
}

#cl-shopping-order-search-page .checkbox-item > ul > li:first-child {
  display: flex;
  align-items: center;
  gap: 4px;
  min-height: 0;
  height: auto;
  margin: 0 0 4px;
  padding: 8px 10px 10px;
  border-bottom: 1px solid var(--cl-border);
}

#cl-shopping-order-search-page .checkbox-item > ul > li:first-child label {
  flex: 0 0 auto;
  width: auto;
  min-height: 0;
  margin: 0;
  padding: 0;
  border-bottom: 0;
  border-radius: 0;
  font-weight: 700;
}

#cl-shopping-order-search-page .checkbox-item > ul > li.separator {
  display: none;
}

#cl-shopping-order-search-page .checkbox-item > ul > li > ul {
  max-height: 286px;
  margin: 0;
  padding: 0;
  overflow-y: auto;
  list-style: none;
}

#cl-shopping-order-search-page .checkbox-item > ul > li > ul > li {
  display: flex;
  align-items: center;
  min-height: 34px;
  margin: 0;
  padding: 0;
}

#cl-shopping-order-search-page .checkbox-item label {
  display: flex;
  align-items: center;
  gap: 7px;
  width: 100%;
  min-height: 34px;
  margin: 0;
  padding: 8px 10px;
  border-radius: 6px;
  color: var(--cl-text);
  font-size: 13px;
  font-weight: 400;
  line-height: 18px;
  white-space: nowrap;
  cursor: pointer;
}

#cl-shopping-order-search-page .checkbox-item label:hover {
  background: #f1fbf5;
}

#cl-shopping-order-search-page .checkbox-item li.btn-li {
  padding: 8px 0 0;
}

#cl-shopping-order-search-page .checkbox-item .btn-apply {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 34px;
  margin: 0;
  padding: 0 14px;
  background: var(--cl-green);
  border: 1px solid var(--cl-green);
  border-radius: 6px;
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  line-height: 32px;
  cursor: pointer;
}

#cl-shopping-order-search-page .checkbox-item .btn-apply:hover {
  background: var(--cl-green-hover);
  border-color: var(--cl-green-hover);
}

#cl-shopping-order-search-page .btn-section {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 10px;
  height: auto;
  margin: 0;
  padding: 20px 0 0;
  background: transparent;
  border-top: 0;
}

#cl-shopping-order-search-page .btn-section .btn {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  min-width: 92px;
  height: 35px;
  min-height: 35px;
  max-height: 35px;
  margin: 0;
  padding: 0 26px;
  border-radius: 6px;
  box-shadow: none;
  font-size: 14px;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
  word-break: keep-all;
  cursor: pointer;
  transition: background-color .12s, border-color .12s, color .12s;
}

#cl-shopping-order-search-page .btn-section .btn_search {
  min-width: 110px;
  padding: 0 40px;
  background: var(--cl-green);
  border: 1px solid var(--cl-green);
  color: #fff;
}

#cl-shopping-order-search-page .btn-section .btn_search:hover,
#cl-shopping-order-search-page .btn-section .btn_search:focus {
  background: var(--cl-green-hover);
  border-color: var(--cl-green-hover);
  color: #fff;
}

#cl-shopping-order-search-page .btn-section .btn_reset {
  min-width: 92px;
  background: #fff;
  border: 1px solid var(--cl-border);
  color: var(--cl-text-sub);
}

#cl-shopping-order-search-page .btn-section .btn_reset:hover,
#cl-shopping-order-search-page .btn-section .btn_reset:focus {
  background: #f1fbf5;
  border-color: #b7e7c9;
  color: var(--cl-green-text);
}

#cl-shopping-order-search-page .result-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  min-height: 34px;
  margin: 0 0 14px;
  padding: 0;
  color: var(--cl-text);
  font-size: 15px;
  font-weight: 800;
  line-height: 34px;
}

#cl-shopping-order-search-page .result-title::first-letter {
  color: inherit;
}

#cl-shopping-order-search-page .wide-switch {
  display: none !important;
}

#cl-shopping-order-search-page #wide-section {
  position: relative;
  overflow: visible;
}

#cl-shopping-order-search-page .list-section-search {
  position: absolute !important;
  top: -48px !important;
  right: 0;
  left: auto !important;
  z-index: 90;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  width: auto !important;
  height: auto;
  min-height: 34px;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}

#cl-shopping-order-search-page .list-section-search .common-selectbox {
  --cl-order-select-width: 128px;
  display: inline-flex !important;
  width: var(--cl-order-select-width) !important;
  height: var(--cl-order-select-height) !important;
  float: none !important;
  vertical-align: middle;
}

#cl-shopping-order-search-page .list-section-search .checkbox-title[data-status="download"],
#cl-shopping-order-search-page .btn-list-item-setting {
  width: auto;
  min-width: 0;
  padding-left: 13px;
  padding-right: 13px;
  justify-content: center;
}

body.cl-dashboard-redesign-page #cl-shopping-order-search-page .list-section-search > .checkbox-title[data-status="download"] {
  margin-left: auto;
}

#cl-shopping-order-search-page .list-section-search .checkbox-title[data-status="download"]::after,
#cl-shopping-order-search-page .list-section-search .btn-list-item-setting::after {
  display: none;
}

#cl-shopping-order-search-page .download-tip {
  flex: none;
  width: 13px;
  height: 13px;
  margin: 0;
  fill: var(--cl-text-muted);
}

#cl-shopping-order-search-page .list-table-section.order_search_table {
  position: relative;
  display: flex;
  align-items: flex-start;
  width: 100%;
  min-height: 520px;
  margin: 0;
  padding: 0;
  overflow: visible;
  background: #fff;
  border: 0;
}

#cl-shopping-order-search-page .list-table-section.order_search_table.is-empty {
  min-height: 248px;
}

#cl-shopping-order-search-page .forms.list-table-left,
#cl-shopping-order-search-page .forms.list-table-right {
  float: none;
  min-height: 0;
  margin: 0;
  padding: 0;
  background: #fff;
  border: 0;
  box-shadow: none;
}

#cl-shopping-order-search-page .forms.list-table-left.hidden,
#cl-shopping-order-search-page .list-table-right.hide {
  display: none !important;
}

#cl-shopping-order-search-page .forms.list-table-left {
  flex: 0 0 auto;
}

#cl-shopping-order-search-page .forms.list-table-right {
  flex: 1 1 auto;
  width: auto !important;
  min-width: 0;
  overflow: hidden;
}

#cl-shopping-order-search-page .forms.list-table-right.list-table-left-wide {
  flex-basis: 100%;
  width: 100% !important;
}

#cl-shopping-order-search-page .product-list,
#cl-shopping-order-search-page .table-container,
#cl-shopping-order-search-page .tableCon-wrap,
#cl-shopping-order-search-page .tablecon-wrap {
  float: none;
  width: 100%;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}

#cl-shopping-order-search-page .list-table-left-top,
#cl-shopping-order-search-page .list-table-right-top {
  position: static !important;
  top: auto !important;
  left: auto !important;
  z-index: auto !important;
  width: 100% !important;
  height: auto;
  overflow: hidden;
  background: transparent;
}

#cl-shopping-order-search-page .list-table-left-bottom,
#cl-shopping-order-search-page .list-table-right-bottom {
  margin-top: 0 !important;
  overflow: visible;
  background: transparent;
}

#cl-shopping-order-search-page .list-table-right-top,
#cl-shopping-order-search-page .list-table-right-bottom {
  overflow-x: auto;
}

#cl-shopping-order-search-page .list-table-right-top {
  overflow-x: hidden;
  scrollbar-width: none;
}

#cl-shopping-order-search-page .list-table-right-top::-webkit-scrollbar {
  display: none;
}

#cl-shopping-order-search-page .list-table-section.order_search_table.is-empty .list-table-left-bottom,
#cl-shopping-order-search-page .list-table-section.order_search_table.is-empty .list-table-right-bottom {
  display: none;
}

#cl-shopping-order-search-page .list-table {
  width: 100%;
  margin: 0;
  table-layout: fixed;
  border-collapse: collapse;
  border-spacing: 0;
  border: 0 !important;
  background: #fff;
  color: var(--cl-text);
  font-size: 13px;
}

#cl-shopping-order-search-page .list-table > tbody {
  border-top: 0;
  border-bottom: 0;
}

#cl-shopping-order-search-page .list-table > tbody > tr,
#cl-shopping-order-search-page .head-row {
  height: 35px !important;
  border-top: 0;
  border-bottom: 0 !important;
}

#cl-shopping-order-search-page .list-table > tbody > tr + tr {
  border-top: 0;
}

#cl-shopping-order-search-page .list-table td {
  height: 35px;
  min-height: 0;
  padding: 8px 10px;
  overflow: hidden;
  background: #fff;
  border: 0;
  border-right: 0 !important;
  border-left: 0 !important;
  border-bottom: 1px solid var(--cl-border);
  color: var(--cl-text);
  font-size: 13px;
  font-weight: 400;
  line-height: 18px;
  text-align: center;
  text-overflow: ellipsis;
  vertical-align: middle;
  white-space: nowrap;
  word-break: keep-all;
}

#cl-shopping-order-search-page .head-row td {
  height: 35px;
  padding-top: 0;
  padding-bottom: 0;
  background: #f7f8fa;
  border-top: 1px solid var(--cl-border);
  border-bottom: 1px solid var(--cl-border);
  color: var(--cl-text-sub);
  font-size: 12.5px;
  font-weight: 600;
  line-height: 18px;
  white-space: nowrap;
}

#cl-shopping-order-search-page .head-row td:is(
  [data-columntype="mng.product.name"],
  [data-columntype="product.name"],
  [data-columntype="option"]
),
#cl-shopping-order-search-page .list-table td:is(
  [data-column="mng.product.name"],
  [data-column="product.name"],
  [data-column="option"]
) {
  text-align: left;
}

#cl-shopping-order-search-page .list-table tbody tr:hover td,
#cl-shopping-order-search-page .list-table tbody tr.over td {
  background: #fafbfc;
}

#cl-shopping-order-search-page .list-table td[rowspan] {
  background: #fff;
}

#cl-shopping-order-search-page .order-name {
  display: inline-block;
  max-width: 100%;
  overflow: hidden;
  color: var(--cl-text);
  font-weight: 500;
  text-overflow: ellipsis;
  vertical-align: middle;
  white-space: nowrap;
}

#cl-shopping-order-search-page .ico-orderby {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 14px;
  height: 14px;
  margin-left: 3px;
  color: var(--cl-text-muted);
  vertical-align: -2px;
}

#cl-shopping-order-search-page .ico-orderby svg {
  display: none;
  width: 12px;
  height: 12px;
  fill: currentColor;
}

#cl-shopping-order-search-page .ico-orderby svg.active {
  display: block;
}

#cl-shopping-order-search-page .head-row td:hover .ico-orderby {
  color: var(--cl-green);
}

#cl-shopping-order-search-page .ico-naverpay {
  fill: #03c75a;
  vertical-align: -2px;
}

#cl-shopping-order-search-page .cl-source-order-search-empty {
  position: absolute;
  top: 46px;
  right: 0;
  bottom: auto;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 148px;
  min-height: 0;
  color: var(--cl-text-muted);
  font-size: 13px;
  font-weight: 400;
  line-height: 1.5;
  pointer-events: none;
}

#cl-shopping-order-search-page .list-table-section.order_search_table.is-empty .cl-source-product-pager {
  position: absolute;
  top: 208px;
  right: 0;
  left: 0;
  margin-top: 0;
}

#cl-shopping-order-search-page .notice-tr,
#cl-shopping-order-search-page .notice-tr:hover,
#cl-shopping-order-search-page .notice-tr.over {
  background: transparent !important;
  pointer-events: none;
}

#cl-shopping-order-search-page .notice-td,
#cl-shopping-order-search-page .list-table td.notice-td {
  height: 148px !important;
  min-height: 148px !important;
  background: #fff !important;
  color: var(--cl-text-muted);
  font-size: 13px;
  font-weight: 400;
  text-align: center;
  vertical-align: middle;
}

#cl-shopping-order-search-page .popover {
  z-index: 1400 !important;
  max-width: min(360px, calc(100vw - 32px));
  padding: 0;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 10px;
  box-shadow: var(--cl-shadow-tip, 0 10px 28px rgba(20, 24, 32, .18));
  color: var(--cl-text-sub);
  font-family: var(--cl-source-font);
}

#cl-shopping-order-search-page .popover-title {
  display: none;
}

#cl-shopping-order-search-page .popover-content {
  padding: 12px 14px;
  color: var(--cl-text-sub);
  font-size: 12.5px;
  font-weight: 400;
  line-height: 1.65;
  word-break: keep-all;
}

body.cl-dashboard-redesign-page > .popover.cl-order-search-listitem-popover {
  z-index: 1000001 !important;
  max-width: min(420px, calc(100vw - 32px)) !important;
  padding: 0;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 10px;
  box-shadow: var(--cl-shadow-tip, 0 10px 28px rgba(20, 24, 32, .18));
  color: var(--cl-text-sub);
  font-family: var(--cl-source-font);
}

body.cl-dashboard-redesign-page > .popover.cl-order-search-listitem-popover .popover-title {
  display: none;
}

body.cl-dashboard-redesign-page > .popover.cl-order-search-listitem-popover .popover-content {
  padding: 12px 14px;
  color: var(--cl-text-sub);
  font-size: 12.5px;
  font-weight: 400;
  line-height: 1.65;
  word-break: keep-all;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.shopping-listitem-modal) {
  position: fixed !important;
  inset: 0 !important;
  z-index: 999999 !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
  padding: 8vh 16px 40px !important;
  overflow: auto !important;
  background: rgba(0, 0, 0, .45) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.shopping-listitem-modal) + .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.shopping-listitem-modal) + .modal-backdrop.fade,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.shopping-listitem-modal) + .modal-backdrop.in {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default:has(.shopping-listitem-modal) {
  position: static !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default:has(> .shopping-listitem-modal) > .cl-mobile-btn.close {
  display: none;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal {
  width: 440px !important;
  max-width: 92vw !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .modal-content {
  position: relative !important;
  overflow: hidden !important;
  padding: 0 0 20px !important;
  background: #fff !important;
  border: 0 !important;
  border-radius: 16px !important;
  box-shadow: 0 20px 50px rgba(20, 24, 32, .25) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .modal-body {
  width: 100% !important;
  max-width: none !important;
  padding: 30px 28px 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .modal-title {
  margin: 0 0 22px !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-size: 19px !important;
  font-weight: 800 !important;
  line-height: 26px !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .modal-content > .close.close-button-dialog {
  position: absolute !important;
  top: 16px !important;
  right: 16px !important;
  z-index: 2 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub) !important;
  opacity: 1 !important;
  transition: color .15s, background .15s, transform .18s cubic-bezier(.34, 1.56, .64, 1);
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .modal-content > .close.close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .modal-content > .close.close-button-dialog:focus {
  background: #f1f2f5 !important;
  color: var(--cl-text) !important;
  transform: rotate(90deg);
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .modal-content > .close.close-button-dialog svg {
  display: block !important;
  width: 9px !important;
  height: 9px !important;
  fill: currentColor !important;
  stroke: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .list-item-title {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-height: 20px !important;
  margin: 0 0 10px !important;
  padding: 0 4px !important;
  color: var(--cl-text) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 20px !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .list-item-row svg.ico-fixed {
  flex: none !important;
  order: 3 !important;
  width: 24px !important;
  height: 24px !important;
  margin: 0 0 0 auto !important;
  fill: var(--cl-green) !important;
  color: var(--cl-green) !important;
}

body.cl-dashboard-redesign-page #flat-modal.shopping-listitem-modal .list-item-box .list-item-row svg.ico-fixed {
  position: static !important;
  flex: none !important;
  order: 3 !important;
  width: 24px !important;
  height: 24px !important;
  margin: 0 0 0 auto !important;
  padding: 0 !important;
  fill: var(--cl-green) !important;
  color: var(--cl-green) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .list-item-title svg.ico-view,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .list-item-row svg.ico-view {
  flex: none !important;
  width: 16px !important;
  height: 16px !important;
  background: none !important;
  background-image: none !important;
  fill: none !important;
  stroke: currentColor !important;
  color: var(--cl-green) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .list-item-title svg.ico-view {
  order: 0 !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .list-item-row svg.ico-view {
  order: 3 !important;
  width: 18px !important;
  height: 18px !important;
  margin: 0 0 0 auto !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .list-item-title svg.ico-view > *,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .list-item-row svg.ico-view > * {
  opacity: 1 !important;
  fill: none !important;
  stroke: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .list-item-title.active svg.ico-view,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .list-item-row.active svg.ico-view {
  color: var(--cl-green) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .list-item-title:not(.active) svg.ico-view,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .list-item-row:not(.active) svg.ico-view {
  background: none !important;
  background-image: none !important;
  fill: none !important;
  stroke: currentColor !important;
  color: #c8cfd7 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .list-item-box {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .item-box {
  display: block !important;
  width: 100% !important;
  height: auto !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .fix-item-box,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .order-item-box {
  width: 100% !important;
  overflow-y: auto !important;
  padding: 0 !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 9px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .fix-item-box {
  margin-bottom: 8px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .fix-item-box.no-item {
  display: block !important;
  min-height: 56px !important;
  padding: 17px 18px !important;
  overflow: visible !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 10px !important;
  color: var(--cl-text-muted) !important;
  font-size: 13px !important;
  line-height: 20px !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .fix-item-box.no-item:has(.ui-sortable-placeholder) {
  border-color: var(--cl-green) !important;
  box-shadow: inset 0 0 0 1px var(--cl-green) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .fix-item-box:not(.no-item):has(.ui-sortable-placeholder) {
  border-color: var(--cl-green) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .fix-item-box.no-item .no-item-popover {
  position: relative !important;
  top: 1px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: none !important;
  box-sizing: border-box !important;
  width: 18px !important;
  height: 18px !important;
  margin: 0 0 0 3px !important;
  padding: 2px !important;
  color: var(--cl-accent-blue) !important;
  fill: currentColor !important;
  line-height: 1 !important;
  cursor: pointer !important;
  pointer-events: auto !important;
  pointer-events: bounding-box !important;
  vertical-align: middle !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .fix-item-box.no-item .no-item-popover > * {
  fill: currentColor !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .order-item-box {
  max-height: 344px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal.statistics-listitem-modal .order-item-box,
body.cl-dashboard-redesign-page #flat-modal.shopping-listitem-modal.statistics-listitem-modal .order-item-box,
body.cl-dashboard-redesign-page #flat-modal.shopping-listitem-modal.statistics-listitem-modal .order-item-box.thin-scroll-bar {
  max-height: none !important;
  overflow: hidden !important;
  overflow-y: hidden !important;
  scrollbar-width: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal.statistics-listitem-modal .order-item-box::-webkit-scrollbar,
body.cl-dashboard-redesign-page #flat-modal.shopping-listitem-modal.statistics-listitem-modal .order-item-box::-webkit-scrollbar {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .summary-item-box {
  width: 100% !important;
  max-height: none !important;
  overflow: hidden !important;
  padding: 0 !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 9px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal.statistics-summary-listitem-modal .summary-item-box {
  overflow: hidden !important;
  overflow-y: hidden !important;
  scrollbar-width: none !important;
}

body.cl-dashboard-redesign-page #flat-modal.shopping-listitem-modal.statistics-summary-listitem-modal .summary-item-box,
body.cl-dashboard-redesign-page #flat-modal.shopping-listitem-modal.statistics-summary-listitem-modal .summary-item-box.thin-scroll-bar {
  overflow: hidden !important;
  overflow-y: hidden !important;
  scrollbar-width: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal.statistics-summary-listitem-modal .summary-item-box::-webkit-scrollbar,
body.cl-dashboard-redesign-page #flat-modal.shopping-listitem-modal.statistics-summary-listitem-modal .summary-item-box::-webkit-scrollbar {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .list-item-row {
  display: flex !important;
  align-items: center !important;
  gap: 0 !important;
  height: 43px !important;
  min-height: 43px !important;
  margin: 0 !important;
  padding: 0 14px 0 16px !important;
  background: #fff !important;
  border-bottom: 1px solid var(--cl-border) !important;
  color: var(--cl-text) !important;
  cursor: default !important;
  user-select: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .list-item-row:last-child {
  border-bottom: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .list-item-row:hover {
  background: #fbfcfd !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .list-item-box .ui-sortable-placeholder {
  box-sizing: border-box !important;
  width: 100% !important;
  height: 43px !important;
  min-height: 43px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #fff !important;
  border: 1px solid var(--cl-green) !important;
  box-shadow: none !important;
  visibility: visible !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .fix-item-box.no-item .ui-sortable-placeholder {
  height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: transparent !important;
  border: 0 !important;
  visibility: hidden !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .list-item-name {
  order: 1 !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  padding: 0 12px 0 0 !important;
  color: inherit !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .list-item-row:not(.active) .list-item-name {
  color: var(--cl-text-muted) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .handle,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .cl-sort-handle,
body.cl-dashboard-redesign-page #flat-modal.shopping-listitem-modal .list-item-box .list-item-row .handle,
body.cl-dashboard-redesign-page #flat-modal.shopping-listitem-modal .list-item-box .list-item-row .cl-sort-handle {
  position: static !important;
  top: auto !important;
  right: auto !important;
  left: auto !important;
  order: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: none !important;
  width: 20px !important;
  height: 20px !important;
  margin: 0 8px 0 0 !important;
  color: #a8adb4 !important;
  fill: currentColor !important;
  cursor: grab !important;
  opacity: 0 !important;
  visibility: hidden !important;
  transition: opacity .12s, visibility .12s, color .12s;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .list-item-row:hover .handle,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .list-item-row:hover .cl-sort-handle,
body.cl-dashboard-redesign-page #flat-modal.shopping-listitem-modal .list-item-box .list-item-row:hover .handle,
body.cl-dashboard-redesign-page #flat-modal.shopping-listitem-modal .list-item-box .list-item-row:hover .cl-sort-handle {
  color: #a8adb4 !important;
  display: inline-flex !important;
  opacity: 1 !important;
  visibility: visible !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .handle svg,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .cl-sort-handle svg {
  display: block !important;
  width: 20px !important;
  height: 20px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page #flat-modal.shopping-listitem-modal .list-item-box .btn-reset,
body.cl-dashboard-redesign-page #flat-modal .shopping-listitem-modal .list-item-box .btn-reset {
  position: static;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .btn-reset {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  float: none !important;
  width: max-content !important;
  min-height: 24px !important;
  margin: 12px 0 0 auto !important;
  padding: 4px 0 4px 12px !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .btn-reset:hover {
  background: transparent !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .btn-reset svg {
  flex: none !important;
  width: 16px !important;
  height: 16px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .fix-not-support {
  margin-top: 10px !important;
  color: var(--cl-text-sub) !important;
  font-size: 12.5px !important;
  line-height: 1.5 !important;
}

body.cl-dashboard-redesign-page :is(.flat-modal.cl-common-modal .shopping-listitem-modal:not(.statistics-summary-listitem-modal), #flat-modal.shopping-listitem-modal:not(.statistics-summary-listitem-modal)) .modal-footer {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 auto !important;
  padding: 20px 28px 0 !important;
  background: #fff !important;
  border: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .modal-footer .ok-button-dialog,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .modal-footer .ok-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .modal-footer .ok-button-dialog:focus {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 46px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  background: var(--cl-green) !important;
  border: 1px solid var(--cl-green) !important;
  border-radius: 10px !important;
  box-shadow: none !important;
  color: #fff !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .modal-footer .ok-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .modal-footer .ok-button-dialog:focus {
  background: var(--cl-green-hover) !important;
  border-color: var(--cl-green-hover) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.statistics-summary-listitem-modal) .modal-footer {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  padding: 0 !important;
}

@media (max-width: 1024px) {
  #cl-shopping-order-search-page .search-box > ul:first-child {
    flex-wrap: wrap;
  }

  #cl-shopping-order-search-page .btn-naverpay-sync {
    margin-left: 0;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-search-page .list-section-search {
    position: static !important;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    width: 100% !important;
    margin: 0 0 14px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-search-page .list-section-search > .common-selectbox {
    --cl-order-select-width: 100%;
    min-width: 0;
    max-width: 128px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-search-page .list-section-search > .checkbox-title {
    margin: 0;
  }
}

@media (max-width: 768px) {
  #cl-shopping-order-search-page {
    margin-left: var(--cl-source-app-gutter);
    padding: 20px 16px 40px;
  }

  #cl-shopping-order-search-page .cl-source-order-search-panel {
    padding: 18px 16px 24px;
  }

  #cl-shopping-order-search-page .section-search-container {
    padding: 4px 16px 18px;
  }

  #cl-shopping-order-search-page .search-box {
    padding: 0;
  }

  #cl-shopping-order-search-page .search-box > ul {
    display: block;
  }

  #cl-shopping-order-search-page .search-box > ul > li:first-child {
    width: auto;
    margin-bottom: 8px;
  }

  #cl-shopping-order-search-page .keyword {
    width: 100%;
  }

  #cl-shopping-order-search-page .list-table-section.order_search_table {
    display: block;
    overflow-x: auto;
  }

  #cl-shopping-order-search-page .forms.list-table-left,
  #cl-shopping-order-search-page .forms.list-table-right {
    min-width: 900px;
  }
}

/* Shopping statistics page */
#cl-shopping-statistics-page {
  --cl-stat-primary: #03c75a;
  --cl-stat-primary-hover: #02b351;
  width: auto !important;
  max-width: none !important;
  margin-top: 0 !important;
  margin-right: var(--cl-source-app-gutter) !important;
  margin-left: calc(var(--cl-source-app-gutter) + var(--cl-source-sidebar-w)) !important;
  padding: 28px 32px 60px !important;
  background: transparent !important;
  color: var(--cl-text);
}

#cl-shopping-statistics-page,
#cl-shopping-statistics-page * {
  box-sizing: border-box;
}

#cl-shopping-statistics-page .dashbottom-container {
  float: none !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 0;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent;
  border: 0;
  box-shadow: none;
}

#cl-shopping-statistics-page .cl-source-statistics-head {
  margin: 0 0 18px;
}

#cl-shopping-statistics-page .cl-source-statistics-breadcrumb {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  color: var(--cl-text);
  font-size: 20px;
  font-weight: 700;
  line-height: 1.35;
}

#cl-shopping-statistics-page .cl-source-statistics-breadcrumb .sep {
  color: var(--cl-text-muted);
  font-size: 23px;
  font-weight: 400;
  line-height: 1;
}

#cl-shopping-statistics-page .cl-source-statistics-breadcrumb .current {
  color: var(--cl-text-sub);
  font-weight: 700;
}

#cl-shopping-statistics-page .cl-source-statistics-desc {
  margin: 10px 0 0;
  color: var(--cl-text-sub);
  font-size: 13px;
  font-weight: 400;
  line-height: 1.45;
}

#cl-shopping-statistics-page .dashbottom-container {
  display: block;
  overflow: visible;
  padding: 0 !important;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

#cl-shopping-statistics-page #section-top-menu,
#cl-shopping-statistics-page .mobile-title {
  display: none !important;
}

#cl-shopping-statistics-page .statistics-container {
  overflow: visible;
  width: 100%;
  min-height: 0;
  background: transparent;
}

#cl-shopping-statistics-page .statistics-top {
  position: relative;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: space-between;
  width: 100%;
  min-height: 36px;
  margin: 0 0 18px;
  padding: 0;
  background: transparent;
  border-bottom: 0;
}

#cl-shopping-statistics-page .statistics-top .util-left {
  order: 1;
  display: inline-flex;
  float: none;
  align-items: center;
  width: auto;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
}

.cl-dashboard-redesign #cl-shopping-statistics-page .cl-source-statistics-nav {
  order: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex: 0 0 100%;
  min-width: 0;
  overflow-x: auto;
}

.cl-dashboard-redesign #cl-shopping-statistics-page .cl-source-statistics-nav .util-left {
  flex: none;
  margin-bottom: 0;
}

@media (max-width: 1024px) {
  .cl-dashboard-redesign #cl-shopping-statistics-page .cl-source-statistics-nav {
    justify-content: flex-start;
  }
}

#cl-shopping-statistics-page .statistics-top .util-left > div {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 66px;
  height: 34px;
  margin: 0;
  padding: 0 18px;
  background: #fff;
  border: 0;
  border-left: 1px solid var(--cl-border);
  color: var(--cl-text-sub);
  font-size: 13px;
  font-weight: 600;
  line-height: 32px;
  cursor: pointer;
  transition: background-color .12s, color .12s;
}

#cl-shopping-statistics-page .statistics-top .util-left > div:first-child {
  border-left: 0;
}

#cl-shopping-statistics-page .statistics-top .util-left > div:hover {
  background: var(--cl-green-tint);
  color: var(--cl-green-text);
}

#cl-shopping-statistics-page .statistics-top .util-left > div.active {
  background: var(--cl-stat-primary);
  border-color: var(--cl-stat-primary);
  color: #fff;
  font-weight: 700;
}

#cl-shopping-statistics-page .statistics-top .util-left > div.active:hover {
  background: var(--cl-stat-primary-hover);
  color: #fff;
}

#cl-shopping-statistics-page .statistics-top .date-box {
  order: 2;
  display: inline-flex;
  float: none;
  align-items: center;
  gap: 0;
  width: auto;
  height: 34px;
  margin: 0 0 0 auto;
  padding: 0;
}

#cl-shopping-statistics-page .statistics-top .date-box .statistics-period-options {
  display: inline-flex;
  align-items: center;
  gap: 0;
  width: auto;
  margin: 0;
  padding: 0;
}

#cl-shopping-statistics-page .statistics-top .date-box .statistics-period-options .duration {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 34px;
  min-width: 0;
  margin: 0;
  padding: 0 14px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-right: 0;
  border-radius: 0;
  color: var(--cl-text-sub);
  cursor: pointer;
  transition: background-color .12s, color .12s;
}

#cl-shopping-statistics-page .statistics-top .date-box .statistics-period-options .duration:first-child {
  border-radius: 6px 0 0 6px;
}

#cl-shopping-statistics-page .statistics-top .date-box .statistics-period-options .duration:nth-child(4) {
  border-right: 1px solid var(--cl-border);
  border-radius: 0 6px 6px 0;
}

#cl-shopping-statistics-page .statistics-top .date-box .statistics-period-options .duration span {
  height: auto;
  color: inherit;
  font-size: 13px;
  font-weight: 600;
  line-height: 32px;
}

#cl-shopping-statistics-page .statistics-top .date-box .statistics-period-options .duration:hover {
  background: #fafbfc;
  color: var(--cl-green-text);
}

#cl-shopping-statistics-page .statistics-top .date-box .statistics-period-options .duration.active {
  background: #e4f7ec;
  border-color: var(--cl-border);
  color: var(--cl-green-text);
  font-weight: 700;
}

#cl-shopping-statistics-page .statistics-top .date-box .statistics-period-options .duration.active + .duration {
  border-left-color: var(--cl-border);
}

#cl-shopping-statistics-page .statistics-top .date-box .change-date-box {
  display: flex;
  align-items: center;
  align-self: center;
  width: auto;
  height: 34px;
  margin: 0 0 0 8px;
  color: var(--cl-text-muted);
  font-size: 13px;
  line-height: 34px;
}

#cl-shopping-statistics-page .statistics-top .date-box .order-vcal-wrap {
  position: relative;
  display: flex;
  align-items: center;
  height: 34px;
  z-index: 30;
}

#cl-shopping-statistics-page .statistics-top .date-box .order-vcal-wrap .vperiod {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: auto;
  height: 34px;
  margin: 0;
  padding: 0 12px;
  box-sizing: border-box;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
  color: var(--cl-text);
  font-size: 12.5px;
  font-weight: 600;
  line-height: 1;
  cursor: pointer;
  transition: border-color .12s, background .12s, box-shadow .12s;
}

#cl-shopping-statistics-page .statistics-top .date-box .order-vcal-wrap .vperiod:hover {
  background: #fafbfc;
  border-color: #d5d9e0;
}

#cl-shopping-statistics-page .statistics-top .date-box .order-vcal-wrap .vperiod:focus-visible {
  outline: none;
  border-color: var(--cl-green);
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .18);
}

#cl-shopping-statistics-page .statistics-top .date-box .order-vcal-wrap .vperiod > svg {
  flex: none;
  width: 14px;
  height: 14px;
  color: var(--cl-text-muted);
}

#cl-shopping-statistics-page .statistics-top .date-box .order-vcal-wrap .vperiod-dash {
  color: var(--cl-text-muted);
  font-weight: 500;
}

#cl-shopping-statistics-page .statistics-top .date-box .order-vcal-wrap .vcal {
  display: none;
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 300;
  width: 288px;
  padding: 14px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 12px;
  box-shadow: 0 12px 30px rgba(20, 24, 32, .16);
}

#cl-shopping-statistics-page .statistics-top .date-box .order-vcal-wrap .vcal.open {
  display: block;
}

#cl-shopping-statistics-page .statistics-top .date-box .order-vcal-wrap .vcal-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
}

#cl-shopping-statistics-page .statistics-top .date-box .order-vcal-wrap .vcal-title {
  color: var(--cl-text);
  font-size: 13.5px;
  font-weight: 700;
}

#cl-shopping-statistics-page .statistics-top .date-box .order-vcal-wrap .vcal-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 6px;
  color: var(--cl-text-sub);
  cursor: pointer;
}

#cl-shopping-statistics-page .statistics-top .date-box .order-vcal-wrap .vcal-nav:hover {
  background: #f4f5f9;
  color: var(--cl-text);
}

#cl-shopping-statistics-page .statistics-top .date-box .order-vcal-wrap .vcal-nav svg {
  width: 16px;
  height: 16px;
}

#cl-shopping-statistics-page .statistics-top .date-box .order-vcal-wrap .vcal-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
}

#cl-shopping-statistics-page .statistics-top .date-box .order-vcal-wrap .vcal-wd {
  padding: 4px 0 6px;
  color: var(--cl-text-muted);
  font-size: 11px;
  font-weight: 700;
  text-align: center;
}

#cl-shopping-statistics-page .statistics-top .date-box .order-vcal-wrap .vcal-wd.sun {
  color: #e5484d;
}

#cl-shopping-statistics-page .statistics-top .date-box .order-vcal-wrap .vcal-wd.sat {
  color: var(--cl-green-text);
}

#cl-shopping-statistics-page .statistics-top .date-box .order-vcal-wrap .vcal-day {
  position: relative;
  padding: 7px 0;
  color: var(--cl-text);
  font-size: 12.5px;
  text-align: center;
  cursor: pointer;
}

#cl-shopping-statistics-page .statistics-top .date-box .order-vcal-wrap .vcal-day.other {
  color: var(--cl-text-muted);
  opacity: .45;
}

#cl-shopping-statistics-page .statistics-top .date-box .order-vcal-wrap .vcal-day:hover:not(.sel):not(.disabled) {
  background: #f1f2f5;
  border-radius: 6px;
}

#cl-shopping-statistics-page .statistics-top .date-box .order-vcal-wrap .vcal-day.in-range {
  background: #e4f7ec;
  color: var(--cl-green-text);
}

#cl-shopping-statistics-page .statistics-top .date-box .order-vcal-wrap .vcal-day.in-range:hover {
  background: #d6f0e0;
  border-radius: 0;
}

#cl-shopping-statistics-page .statistics-top .date-box .order-vcal-wrap .vcal-day.sel {
  z-index: 1;
  background: var(--cl-green);
  border-radius: 6px;
  color: #fff;
  font-weight: 700;
}

#cl-shopping-statistics-page .statistics-top .date-box .order-vcal-wrap .vcal-day.range-start {
  border-radius: 6px 0 0 6px;
}

#cl-shopping-statistics-page .statistics-top .date-box .order-vcal-wrap .vcal-day.range-end {
  border-radius: 0 6px 6px 0;
}

#cl-shopping-statistics-page .statistics-top .date-box .order-vcal-wrap .vcal-day.today::after {
  position: absolute;
  bottom: 3px;
  left: 50%;
  width: 4px;
  height: 4px;
  background: var(--cl-green);
  border-radius: 50%;
  content: "";
  transform: translateX(-50%);
}

#cl-shopping-statistics-page .statistics-top .date-box .order-vcal-wrap .vcal-day.sel.today::after {
  background: #fff;
}

#cl-shopping-statistics-page .statistics-top .date-box .order-vcal-wrap .vcal-day.disabled {
  color: var(--cl-text-muted);
  cursor: default;
  opacity: .28;
}

#cl-shopping-statistics-page .statistics-top .date-box .statistics-datepicker-legacy {
  display: none !important;
}

#cl-shopping-statistics-page .btn-naverpay-sync {
  position: static !important;
  order: 4;
  float: none !important;
  display: inline-flex;
  flex: none;
  align-items: center;
  justify-content: center;
  gap: 7px;
  width: auto;
  height: 34px;
  margin: 0 !important;
  padding: 0 13px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  box-shadow: none;
  color: var(--cl-text-sub);
  font-size: 12.5px;
  font-weight: 600;
  line-height: 32px;
  white-space: nowrap;
  transition: background-color .12s, border-color .12s, color .12s;
}

#cl-shopping-statistics-page .btn-naverpay-sync:hover {
  background: #fafbfc;
  border-color: #d5d9e0;
  color: var(--cl-text);
}

#cl-shopping-statistics-page .btn-naverpay-sync .ico-naverpay {
  position: static !important;
  flex: none;
  width: 16px;
  height: 16px;
  margin: 0 !important;
  transform: none;
  fill: var(--cl-green);
}

#cl-shopping-statistics-page .btn-filter {
  order: 3;
  display: inline-flex;
  float: none;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-width: 0;
  height: 34px;
  margin: 0;
  padding: 0 13px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  color: var(--cl-text-sub);
  font-size: 12.5px;
  font-weight: 600;
  line-height: 32px;
  cursor: pointer;
  transition: background-color .12s, border-color .12s, color .12s;
}

body.cl-dashboard-redesign-page #cl-shopping-statistics-page .statistics-top .mobile-btn-filter {
  display: none;
}

#cl-shopping-statistics-page .btn-filter:hover {
  background: #fafbfc;
  border-color: #d5d9e0;
  color: var(--cl-text);
}

#cl-shopping-statistics-page .btn-filter.active {
  background: #fff;
  border-color: var(--cl-green);
  color: var(--cl-green-text);
}

#cl-shopping-statistics-page .btn-filter svg {
  flex: none;
  width: 13px;
  height: 13px;
  margin: 0;
  fill: currentColor;
}

#cl-shopping-statistics-page .statistics-top .filter-pop {
  order: 5;
  width: min(640px, calc(100vw - 96px));
  margin: 0;
  padding: 0;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 10px;
  box-shadow: 0 12px 30px rgba(20, 24, 32, .16);
  color: var(--cl-text);
  z-index: 350;
}

#cl-shopping-statistics-page .statistics-top .filter-pop .close {
  top: 10px;
  right: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 8px;
  color: var(--cl-text-sub);
  opacity: 1;
  transition: color .15s, background .15s, transform .18s cubic-bezier(.34, 1.56, .64, 1);
}

#cl-shopping-statistics-page .statistics-top .filter-pop .close:hover,
#cl-shopping-statistics-page .statistics-top .filter-pop .close:focus {
  background: #f4f5f9;
  color: var(--cl-text);
  outline: 0;
  transform: rotate(90deg);
}

#cl-shopping-statistics-page .statistics-top .filter-pop .close svg {
  width: 9px;
  height: 9px;
  stroke: currentColor;
}

#cl-shopping-statistics-page .statistics-top .filter-pop .close svg,
#cl-shopping-statistics-page .statistics-top .filter-pop .close svg * {
  fill: currentColor !important;
}

#cl-shopping-statistics-page .statistics-top .filter-pop .filter-pop-content {
  padding: 22px 24px 14px;
}

#cl-shopping-statistics-page .statistics-top .filter-pop .filter-check-area {
  max-height: 330px;
  padding-bottom: 12px;
  overflow-x: hidden;
  overflow-y: auto;
}

#cl-shopping-statistics-page .filter-pop .filter-top-line {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 0 0 10px;
  border-bottom: 1px solid var(--cl-line);
}

#cl-shopping-statistics-page .filter-pop .filter-top-line .chk-product,
#cl-shopping-statistics-page .filter-pop .filter-item-box .filter-item-line .filter-item-title {
  flex: 0 0 168px;
  color: var(--cl-text);
  font-size: 13px;
  font-weight: 600;
}

#cl-shopping-statistics-page .filter-pop .filter-top-line .title-category {
  padding-left: 0;
  color: var(--cl-text-sub);
  font-size: 13px;
  font-weight: 600;
}

#cl-shopping-statistics-page .statistics-container label input[type='checkbox']:checked + svg,
#cl-shopping-statistics-page .statistics-container label input[type='checkbox'] + svg + svg {
  flex: none;
  width: 16px;
  height: 16px;
  margin: 0 7px 0 0;
  vertical-align: -3px;
}

#cl-shopping-statistics-page .statistics-container label input[type='checkbox']:checked + svg {
  fill: var(--cl-green);
}

#cl-shopping-statistics-page .statistics-container label input[type='checkbox'] + svg + svg {
  fill: #b9c1cc;
}

#cl-shopping-statistics-page .filter-pop .filter-item-box .filter-item-line {
  display: flex;
  min-height: 36px;
  width: 100%;
  padding: 8px 0 0;
}

#cl-shopping-statistics-page .filter-pop .filter-item-box .filter-item-line .filter-item-title label {
  margin: 0;
  padding-left: 0;
  color: var(--cl-text);
  font-size: 13px;
  font-weight: 500;
  line-height: 22px;
  cursor: pointer;
}

#cl-shopping-statistics-page .filter-pop .filter-item-box .filter-item-line .filter-item-title label svg {
  position: static;
}

#cl-shopping-statistics-page .filter-pop .filter-item-box .filter-item-right {
  display: flex;
  flex: 1 1 auto;
  flex-wrap: wrap;
  gap: 6px;
  min-width: 0;
}

#cl-shopping-statistics-page .filter-pop .filter-item-box .filter-item {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  min-height: 28px;
  margin: 0;
  padding: 4px 10px;
  background: #fff;
  border: 1px solid transparent;
  border-radius: 999px;
  color: var(--cl-text-sub);
  font-size: 12.5px;
  line-height: 18px;
  cursor: pointer;
}

#cl-shopping-statistics-page .filter-pop .filter-item-box .filter-item:hover {
  background: #fafbfc;
  color: var(--cl-text);
}

#cl-shopping-statistics-page .filter-pop .filter-item-box .filter-item.active {
  height: auto;
  padding: 4px 10px;
  background: #e4f7ec;
  border-color: var(--cl-green);
  color: var(--cl-green-text);
  font-weight: 700;
}

#cl-shopping-statistics-page .filter-pop .filter-item-box .filter-item.disabled {
  color: var(--cl-text-muted);
  opacity: .55;
}

#cl-shopping-statistics-page .statistics-top .filter-pop .select-list {
  min-height: 0;
  padding: 12px 0 0;
  border-top: 1px solid var(--cl-line);
}

#cl-shopping-statistics-page .statistics-top .filter-pop .select-list .select-item,
#cl-shopping-statistics-page .statistics-top .filtered-list .select-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  max-width: 100%;
  min-height: 28px;
  margin: 2px 4px 2px 0;
  padding: 4px 10px;
  overflow: hidden;
  background: #f3fcf7;
  border: 1px solid #d2f1df;
  border-radius: 999px;
  color: var(--cl-green-text);
  font-size: 12.5px;
  font-weight: 600;
  line-height: 18px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#cl-shopping-statistics-page .statistics-top .filter-pop .select-list .select-item svg,
#cl-shopping-statistics-page .statistics-top .filtered-list .select-item svg {
  flex: none;
  margin: 0;
  fill: currentColor;
}

#cl-shopping-statistics-page .statistics-top .filter-pop .btn-area {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  padding: 12px 20px;
  border-top: 1px solid var(--cl-border);
  text-align: right;
}

#cl-shopping-statistics-page .statistics-top .filter-pop .btn-area .btn-area-cancel,
#cl-shopping-statistics-page .statistics-top .filter-pop .btn-area .btn-area-ok {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 62px;
  height: 34px;
  margin: 0;
  padding: 0 14px;
  border-radius: 6px;
  box-shadow: none;
  font-size: 13px;
  font-weight: 700;
  line-height: 32px;
}

#cl-shopping-statistics-page .statistics-top .filter-pop .btn-area .btn-area-cancel {
  background: #fff;
  border: 1px solid var(--cl-border);
  color: var(--cl-text-sub);
}

#cl-shopping-statistics-page .statistics-top .filter-pop .btn-area .btn-area-ok {
  background: var(--cl-green);
  border: 1px solid var(--cl-green);
  color: #fff;
}

#cl-shopping-statistics-page .statistics-top .filtered-list {
  order: 6;
  flex: 0 0 100%;
  width: 100%;
  margin: 0;
  padding-top: 2px;
}

#cl-shopping-statistics-page #chart-div {
  position: relative;
  width: 100%;
  margin: 0 0 18px;
  padding: 20px 22px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 10px;
  box-shadow: var(--cl-shadow-panel);
}

#cl-shopping-statistics-page #chart-div .cl-source-statistics-chart-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 0 0 16px;
}

#cl-shopping-statistics-page #chart-div .cl-source-statistics-chart-title {
  margin: 0;
  color: var(--cl-text);
  font-family: var(--cl-source-font);
  font-size: 16px;
  font-weight: 700;
  line-height: 22px;
}

#cl-shopping-statistics-page #chart-div .chart-area {
  display: block;
  width: 100% !important;
  max-width: 100%;
  font-family: var(--cl-source-font);
}

#cl-shopping-statistics-page #chartjs-tooltip {
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 10px;
  box-shadow: 0 10px 28px rgba(20, 24, 32, .14);
  color: var(--cl-text);
  font-family: var(--cl-source-font);
}

#cl-shopping-statistics-page .statistics-container #choice-chart-color {
  position: relative;
  z-index: 1200;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: auto;
  height: auto;
  margin-top: 0;
  padding: 14px 16px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 14px;
  box-shadow: 0 8px 24px rgba(20, 24, 32, .14);
  text-align: center;
}

#cl-shopping-statistics-page .statistics-container #choice-chart-color::before {
  position: absolute;
  top: -1px;
  left: 50%;
  z-index: 1;
  width: 20px;
  height: 9px;
  background: #fff;
  content: "";
  pointer-events: none;
  transform: translateX(-50%);
}

#cl-shopping-statistics-page .statistics-container #choice-chart-color .choice-chart-color-arrow {
  position: absolute;
  top: -7px;
  left: 50%;
  z-index: 2;
  display: block;
  width: 12px;
  height: 12px;
  margin: 0;
  padding: 0;
  background: #fff;
  border-top: 1px solid var(--cl-border);
  border-right: none;
  border-bottom: none;
  border-left: 1px solid var(--cl-border);
  border-radius: 0;
  cursor: default;
  transform: translateX(-50%) rotate(45deg);
}

#cl-shopping-statistics-page .statistics-container #choice-chart-color .choice-chart-color-title {
  display: block;
  width: 100%;
  height: auto;
  margin: 0 0 8px;
  padding: 0;
  border: 0;
  border-radius: 0;
  color: var(--cl-text-sub);
  font-size: 11.5px;
  font-weight: 500;
  line-height: 15px;
  cursor: default;
  white-space: nowrap;
}

#cl-shopping-statistics-page .statistics-container #choice-chart-color .choice-chart-color-options {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  width: 100%;
  height: auto;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  cursor: default;
}

#cl-shopping-statistics-page .statistics-container #choice-chart-color .choice-chart-color-option {
  display: block;
  appearance: none;
  -webkit-appearance: none;
  flex: none;
  box-sizing: content-box;
  width: 26px;
  height: 26px;
  margin: 0;
  padding: 0;
  border: 2px solid transparent;
  border-radius: 50%;
  font: inherit;
  line-height: 0;
  box-shadow: none;
  cursor: pointer;
}

#cl-shopping-statistics-page .statistics-container #choice-chart-color .choice-chart-color-option.selected {
  border-color: var(--cl-text);
}

#cl-shopping-statistics-page .statistics-container #choice-chart-color .choice-chart-color-option:not(.selected),
#cl-shopping-statistics-page .statistics-container #choice-chart-color .choice-chart-color-option:not(.selected):active {
  border-color: transparent;
}

#cl-shopping-statistics-page .statistics-container #choice-chart-color .choice-chart-color-option:focus {
  outline: none;
}

#cl-shopping-statistics-page .statistics-container #choice-chart-color .choice-chart-color-option:focus-visible {
  outline: 2px solid rgba(46, 139, 240, .32);
  outline-offset: 2px;
}

#cl-shopping-statistics-page .statistics-container #choice-chart-color #data-color-1 {
  background: var(--cl-accent-blue);
}

#cl-shopping-statistics-page .statistics-container #choice-chart-color #data-color-2 {
  background: var(--cl-green);
}

#cl-shopping-statistics-page .cl-source-statistics-summary {
  display: flex;
  align-items: stretch;
  width: 100%;
  height: auto;
  min-height: 104px;
  margin: 0 0 18px;
  padding: 22px 24px;
  overflow: visible;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 14px;
  box-shadow: var(--cl-shadow-panel);
}

#cl-shopping-statistics-page .cl-source-statistics-summary > div {
  min-width: 0;
  padding: 0;
  text-align: center;
}

#cl-shopping-statistics-page .cl-source-statistics-summary > .cl-source-statistics-summary-head {
  display: flex;
  flex: none;
  flex-direction: column;
  justify-content: center;
  width: 150px;
  min-width: 150px;
  padding: 0 20px 0 0;
  border-right: 0;
}

#cl-shopping-statistics-page .cl-source-statistics-summary .cl-source-statistics-summary-head .main,
#cl-shopping-statistics-page .cl-source-statistics-summary .cl-source-statistics-summary-head .sub {
  border-right: 0;
}

#cl-shopping-statistics-page .cl-source-statistics-summary .cl-source-statistics-summary-head .main {
  margin: 0;
  padding: 0;
  color: var(--cl-text);
  font-size: 16px;
  font-weight: 800;
  line-height: 22px;
}

#cl-shopping-statistics-page .cl-source-statistics-summary .cl-source-statistics-summary-head .sub {
  margin-top: 4px;
  color: var(--cl-text-muted);
  font-size: 12px;
  font-weight: 500;
  line-height: 17px;
}

#cl-shopping-statistics-page .cl-source-statistics-summary .cl-source-statistics-summary-items {
  display: grid;
  flex: 1 1 auto;
  height: auto;
  grid-auto-flow: column;
  grid-auto-columns: minmax(0, 1fr);
  min-width: 0;
  padding: 0;
  overflow: visible;
}

#cl-shopping-statistics-page .cl-source-statistics-summary .cl-source-statistics-summary-items .cl-source-statistics-summary-item {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-width: 0;
  min-height: 60px;
  margin: 0;
  padding: 11px 6px 0;
  border-left: 1px solid var(--cl-border);
  cursor: pointer;
  transition: background-color .12s;
}

#cl-shopping-statistics-page .cl-source-statistics-summary.product-summary-area .cl-source-statistics-summary-items .cl-source-statistics-summary-item {
  min-width: 0;
}

#cl-shopping-statistics-page .cl-source-statistics-summary .cl-source-statistics-summary-items .cl-source-statistics-summary-item:hover {
  background: #fafbfc;
}

#cl-shopping-statistics-page .cl-source-statistics-summary .cl-source-statistics-summary-items .cl-source-statistics-summary-item::before {
  position: absolute;
  top: -11px;
  left: 50%;
  width: 72px;
  height: 3px;
  background: transparent;
  border-radius: 999px;
  content: "";
  transform: translateX(-50%);
}

#cl-shopping-statistics-page .cl-source-statistics-summary .cl-source-statistics-summary-items .cl-source-statistics-summary-item:not(.order, .sale):hover::before {
  background: #d6d9de;
}

#cl-shopping-statistics-page .cl-source-statistics-summary .cl-source-statistics-summary-items .cl-source-statistics-summary-item.order::before {
  background: var(--cl-accent-blue);
}

#cl-shopping-statistics-page .cl-source-statistics-summary .cl-source-statistics-summary-items .cl-source-statistics-summary-item.sale::before {
  background: var(--cl-green);
}

#cl-shopping-statistics-page .cl-source-statistics-summary .main {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  margin: 0 0 8px;
  padding: 0;
  color: var(--cl-text-sub);
  font-size: 12.5px;
  font-weight: 600;
  line-height: 18px;
  white-space: nowrap;
}

#cl-shopping-statistics-page .cl-source-statistics-summary .sub {
  color: var(--cl-text-sub);
  font-size: 19px;
  font-weight: 600;
  line-height: 24px;
}

#cl-shopping-statistics-page .cl-source-statistics-summary .order .sub {
  color: var(--cl-green-text);
  font-weight: 800;
}

#cl-shopping-statistics-page .cl-source-statistics-summary .sale .sub {
  color: var(--cl-green-text);
  font-weight: 800;
}

#cl-shopping-statistics-page .cl-source-statistics-summary .main > svg,
#cl-shopping-statistics-page .cl-source-statistics-summary .cm-popover-info {
  flex: none;
  width: 13px;
  height: 13px;
  margin: 0;
  fill: var(--cl-accent-blue);
  vertical-align: -2px;
}

#cl-shopping-statistics-page .cl-source-statistics-summary .cl-source-statistics-summary-actions {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  align-self: center;
  margin-left: 12px;
  padding: 0;
  border-left: 0;
}

#cl-shopping-statistics-page .cl-source-statistics-summary .btn-item.only-mobile-inline {
  display: none !important;
}

#cl-shopping-statistics-page .cl-source-statistics-summary .cl-source-statistics-summary-actions .cl-source-statistics-summary-button,
body.cl-dashboard-redesign-page .statistics-container .summary-area .summary-btn-item .btn-item,
#cl-shopping-statistics-page .util-row .util-left > div,
#cl-shopping-statistics-page .util-row .util-right .btn-download,
body.cl-dashboard-redesign-page .statistics-container .util-row .util-right .btn-download,
#cl-shopping-statistics-page .util-row .util-right .btn-item,
body.cl-dashboard-redesign-page .statistics-container .util-row .util-right .btn-item {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  min-width: unset;
  max-width: unset;
  height: 34px;
  margin: 0;
  padding: 0 13px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  color: var(--cl-text-sub);
  font-size: 12.5px;
  font-weight: 600;
  line-height: 32px;
  cursor: pointer;
  transition: background-color .12s, border-color .12s, color .12s;
}

#cl-shopping-statistics-page .cl-source-statistics-summary .cl-source-statistics-summary-actions .cl-source-statistics-summary-button:hover,
body.cl-dashboard-redesign-page .statistics-container .summary-area .summary-btn-item .btn-item:hover,
#cl-shopping-statistics-page .util-row .util-left > div:hover,
#cl-shopping-statistics-page .util-row .util-right .btn-download:hover,
body.cl-dashboard-redesign-page .statistics-container .util-row .util-right .btn-download:hover,
#cl-shopping-statistics-page .util-row .util-right .btn-item:hover,
body.cl-dashboard-redesign-page .statistics-container .util-row .util-right .btn-item:hover {
  background: #fafbfc;
  border-color: #d5d9e0;
  color: var(--cl-text);
}

#cl-shopping-statistics-page .util-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100% !important;
  height: auto;
  margin: 0 0 12px;
  padding: 0;
  background: transparent;
  text-align: right;
}

#cl-shopping-statistics-page .util-row.fixed {
  z-index: 200 !important;
  padding: 10px 24px !important;
  background: rgba(255, 255, 255, .96) !important;
  border-bottom: 1px solid var(--cl-border);
  box-shadow: 0 6px 18px rgba(20, 24, 32, .08);
}

#cl-shopping-statistics-page .util-row .util-left {
  display: flex;
  float: none;
  flex: 1 1 auto;
  align-items: center;
  gap: 10px;
  width: auto;
  min-width: 0;
  text-align: left;
}

#cl-shopping-statistics-page .util-row .util-left .btn-back {
  flex: 0 0 auto;
  border-color: var(--cl-green);
  color: var(--cl-green-text);
}

#cl-shopping-statistics-page .util-row .util-left .btn-back > svg {
  position: static;
  flex: none;
  width: 14px;
  height: 14px;
  margin: 0 4px 0 0;
  fill: currentColor;
}

#cl-shopping-statistics-page .util-row .util-left .btn-back > span {
  margin: 0;
}

#cl-shopping-statistics-page .util-row .util-left .product-title {
  display: block;
  min-width: 0;
  margin: 0;
  overflow: hidden;
  border: 0;
  color: var(--cl-text);
  font-size: 14px;
  font-weight: 700;
  line-height: 20px;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#cl-shopping-statistics-page .util-row .util-right {
  display: flex;
  float: none;
  flex: 0 0 auto;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  min-width: 0;
}

#cl-shopping-statistics-page .util-row .util-right.disabled {
  opacity: .55;
  pointer-events: none;
}

#cl-shopping-statistics-page .util-row .util-right .list-limit-option {
  --cl-stat-select-width: 112px;
  display: inline-flex;
  flex: 0 0 var(--cl-stat-select-width);
  width: var(--cl-stat-select-width);
  height: 34px;
  margin: 0;
  vertical-align: middle;
}

#cl-shopping-statistics-page .common-selectbox {
  --cl-stat-select-width: 112px;
  --cl-stat-select-height: 34px;
  --cl-stat-select-inner-height: 32px;
  --cl-stat-select-padding-start: 12px;
  --cl-stat-select-padding-end: 30px;
  position: relative;
  display: inline-flex;
  flex: 0 0 var(--cl-stat-select-width);
  align-items: center;
  box-sizing: border-box;
  width: var(--cl-stat-select-width);
  min-width: 0;
  max-width: var(--cl-stat-select-width);
  height: var(--cl-stat-select-height);
  margin: 0;
  padding: 0;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  box-shadow: none;
  transition: background-color .12s, border-color .12s;
}

#cl-shopping-statistics-page .common-selectbox:hover,
#cl-shopping-statistics-page .common-selectbox:focus-within {
  background: #fafbfc;
  border-color: #d5d9e0;
}

#cl-shopping-statistics-page .common-selectbox select {
  box-sizing: border-box;
  flex: 0 0 var(--cl-stat-select-width);
  width: var(--cl-stat-select-width);
  min-width: 0;
  max-width: var(--cl-stat-select-width);
  height: var(--cl-stat-select-inner-height);
  margin: 0;
  padding: 0 var(--cl-stat-select-padding-end) 0 var(--cl-stat-select-padding-start);
  appearance: none;
  -webkit-appearance: none;
  background: transparent;
  border: 0;
  box-shadow: none;
  color: var(--cl-text);
  font-size: 13px;
  font-weight: 400;
  line-height: var(--cl-stat-select-inner-height);
  outline: none;
  cursor: pointer;
}

#cl-shopping-statistics-page .common-selectbox > .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn) {
  box-sizing: border-box;
  flex: 0 0 var(--cl-stat-select-width);
  width: var(--cl-stat-select-width) !important;
  min-width: 0 !important;
  max-width: var(--cl-stat-select-width);
  height: var(--cl-stat-select-inner-height);
}

#cl-shopping-statistics-page .common-selectbox > .bootstrap-select .dropdown-toggle .bs-caret {
  display: none;
}

#cl-shopping-statistics-page .common-selectbox > .bootstrap-select .btn.btn-default,
#cl-shopping-statistics-page .common-selectbox > .bootstrap-select .btn.btn-default:hover,
#cl-shopping-statistics-page .common-selectbox > .bootstrap-select .btn.btn-default:focus,
#cl-shopping-statistics-page .common-selectbox > .bootstrap-select .btn.btn-default:active,
#cl-shopping-statistics-page .common-selectbox > .bootstrap-select.open .btn.btn-default {
  width: var(--cl-stat-select-width) !important;
  max-width: var(--cl-stat-select-width);
  height: var(--cl-stat-select-inner-height) !important;
  min-height: var(--cl-stat-select-inner-height);
  margin: 0;
  padding: 0 var(--cl-stat-select-padding-end) 0 var(--cl-stat-select-padding-start) !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0;
  box-shadow: none !important;
  color: var(--cl-text) !important;
  font-size: 13px !important;
  font-weight: 400;
  line-height: var(--cl-stat-select-inner-height) !important;
  outline: 0 !important;
}

#cl-shopping-statistics-page .common-selectbox > .bootstrap-select .filter-option {
  left: var(--cl-stat-select-padding-start);
  right: var(--cl-stat-select-padding-end);
  width: auto;
  height: var(--cl-stat-select-inner-height);
  padding: 0;
  overflow: visible;
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: var(--cl-stat-select-inner-height);
  white-space: nowrap;
}

#cl-shopping-statistics-page .common-selectbox > .bootstrap-select .filter-option-inner,
#cl-shopping-statistics-page .common-selectbox > .bootstrap-select .filter-option-inner-inner {
  height: var(--cl-stat-select-inner-height);
  overflow: visible;
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: var(--cl-stat-select-inner-height);
  white-space: nowrap;
}

#cl-shopping-statistics-page .common-selectbox > .bootstrap-select > .dropdown-menu {
  top: var(--cl-select-menu-top, calc(100% + 4px));
  min-width: 100%;
  margin: 0;
  padding: 4px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(20, 24, 32, .14);
}

#cl-shopping-statistics-page .common-selectbox > .bootstrap-select .dropdown-menu.inner {
  position: static;
  min-width: 0;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

#cl-shopping-statistics-page .common-selectbox > .bootstrap-select .dropdown-menu > li > a {
  min-height: 0;
  padding: 8px 12px;
  border-radius: 6px;
  color: var(--cl-text);
  font-size: 12.5px;
  font-weight: 400;
  line-height: 18px;
}

#cl-shopping-statistics-page .common-selectbox > .bootstrap-select .dropdown-menu > li > a:hover,
#cl-shopping-statistics-page .common-selectbox > .bootstrap-select .dropdown-menu > li > a:focus,
#cl-shopping-statistics-page .common-selectbox > .bootstrap-select .dropdown-menu > .active > a,
#cl-shopping-statistics-page .common-selectbox > .bootstrap-select .dropdown-menu > .active > a:hover,
#cl-shopping-statistics-page .common-selectbox > .bootstrap-select .dropdown-menu > .active > a:focus,
#cl-shopping-statistics-page .common-selectbox > .bootstrap-select .dropdown-menu > .selected > a,
#cl-shopping-statistics-page .common-selectbox > .bootstrap-select .dropdown-menu > .selected > a:hover,
#cl-shopping-statistics-page .common-selectbox > .bootstrap-select .dropdown-menu > .selected > a:focus {
  background: #e4f7ec;
  color: var(--cl-green-text);
}

#cl-shopping-statistics-page .common-selectbox > .bootstrap-select .dropdown-menu > .active > a,
#cl-shopping-statistics-page .common-selectbox > .bootstrap-select .dropdown-menu > .selected > a {
  font-weight: 700;
}

#cl-shopping-statistics-page .common-selectbox > svg {
  display: none;
}

#cl-shopping-statistics-page .common-selectbox::after {
  position: absolute;
  top: 50%;
  right: 8px;
  width: 14px;
  height: 14px;
  margin-top: -7px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238A8F98' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 14px;
  content: "";
  pointer-events: none;
}

#cl-shopping-statistics-page .cl-source-statistics-detail-card {
  width: 100%;
  margin: 18px 0 0;
  padding: 20px 22px;
  overflow: visible;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 10px;
  box-shadow: var(--cl-shadow-panel);
}

#cl-shopping-statistics-page .cl-source-statistics-detail-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 0;
  margin: 0 0 16px;
  padding: 0;
  background: #fff;
}

#cl-shopping-statistics-page .cl-source-statistics-detail-title {
  flex: 0 0 auto;
  color: var(--cl-text);
  font-size: 16px;
  font-weight: 700;
  line-height: 22px;
}

#cl-shopping-statistics-page .cl-source-statistics-detail-actions {
  display: flex;
  flex: 1 1 auto;
  align-items: center;
  justify-content: flex-end;
  margin-left: auto;
  min-width: 0;
}

#cl-shopping-statistics-page .cl-source-statistics-detail-util {
  flex: 0 0 auto;
  width: auto !important;
  margin: 0;
  margin-left: auto;
  padding: 0;
  justify-content: flex-end;
}

#cl-shopping-statistics-page .cl-source-statistics-detail-util .util-right {
  gap: 8px;
  margin-left: auto;
  justify-content: flex-end;
}

#cl-shopping-statistics-page .cl-source-statistics-option-detail-card .cl-source-statistics-detail-head {
  gap: 20px;
}

#cl-shopping-statistics-page .cl-source-statistics-option-detail-card .cl-source-statistics-detail-actions {
  flex: 1 1 auto;
}

#cl-shopping-statistics-page .cl-source-statistics-option-detail-card .cl-source-statistics-option-util {
  flex: 1 1 auto;
  justify-content: space-between;
  min-width: 0;
}

#cl-shopping-statistics-page .cl-source-statistics-option-detail-card .cl-source-statistics-option-util .util-left {
  flex: 1 1 auto;
  min-width: 0;
}

#cl-shopping-statistics-page .cl-source-statistics-option-detail-card .cl-source-statistics-option-util .util-right {
  flex: 0 0 auto;
}

#cl-shopping-statistics-page .cl-source-statistics-detail-body {
  width: 100%;
  padding: 0;
}

#cl-shopping-statistics-page .cl-source-statistics-detail-card .list-section {
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

#cl-shopping-statistics-page .cl-source-statistics-detail-card > .cl-source-statistics-detail-body > .list-table {
  width: 100%;
  margin: 0;
  overflow: visible;
  border: 0;
  border-radius: 0;
}

#cl-shopping-statistics-page .cl-source-statistics-detail-card .notice-td,
#cl-shopping-statistics-page .cl-source-statistics-detail-card .list-table td.notice-td {
  border: 0 !important;
  border-radius: 0;
}

#cl-shopping-statistics-page .cl-source-statistics-detail-card .paging {
  margin: 0;
  padding: 16px 0 0 !important;
  border-top: 0 !important;
}

#cl-shopping-statistics-page .list-section {
  display: flex;
  flex-wrap: nowrap;
  width: 100%;
  margin: 0;
  padding: 0 !important;
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 10px;
  box-shadow: var(--cl-shadow-panel);
}

#cl-shopping-statistics-page .list-section table {
  width: auto;
  margin: 0;
  border-collapse: collapse;
  border-spacing: 0;
  font-size: 13.5px;
  table-layout: fixed;
}

#cl-shopping-statistics-page .list-section table tr {
  height: auto;
}

#cl-shopping-statistics-page .list-section table thead tr {
  height: auto;
}

#cl-shopping-statistics-page .list-section table thead td,
#cl-shopping-statistics-page .list-section .list-table-left thead td,
#cl-shopping-statistics-page .list-section .list-table-right thead td {
  height: auto;
  padding: 12px 10px;
  background: #fafbfc !important;
  border: 0 !important;
  border-bottom: 1px solid var(--cl-border) !important;
  color: var(--cl-text-sub);
  font-size: 12.5px;
  font-weight: 600;
  line-height: 18px;
  text-align: center;
  cursor: pointer;
}

#cl-shopping-statistics-page .list-section table td {
  height: auto;
  padding: 12px 10px;
  overflow: hidden;
  background: #fff;
  border: 0 !important;
  border-bottom: 1px solid var(--cl-border) !important;
  color: var(--cl-text);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 18px;
  text-overflow: ellipsis;
  vertical-align: middle;
  white-space: nowrap;
}

#cl-shopping-statistics-page .list-section tbody tr:last-child td {
  border-bottom: 1px solid var(--cl-border) !important;
}

#cl-shopping-statistics-page .list-section table tbody tr:hover td,
#cl-shopping-statistics-page .list-section table tbody tr.over td {
  background: #fafbfc;
}

#cl-shopping-statistics-page .list-section table td.sorted,
#cl-shopping-statistics-page .list-section table td.sorted svg {
  color: var(--cl-text) !important;
  fill: currentColor !important;
  font-weight: 700 !important;
}

#cl-shopping-statistics-page .list-section table thead td svg {
  width: 8px;
  height: 8px;
  margin: 0 0 0 5px;
  fill: #b4b8bf;
  vertical-align: 1px;
}

#cl-shopping-statistics-page .list-section .list-table-left,
#cl-shopping-statistics-page .list-section .list-table-right {
  min-width: 0;
  background: #fff;
}

#cl-shopping-statistics-page .list-section .list-table-left {
  flex: 0 0 auto;
  border-right: 0;
}

#cl-shopping-statistics-page .list-section.list-section-product .list-table-left {
  flex-basis: 361px;
  width: 361px;
}

#cl-shopping-statistics-page .list-section.list-section-duration .list-table-left {
  flex-basis: 185px;
  width: 185px;
}

#cl-shopping-statistics-page .list-section.list-section-option .list-table-left {
  flex-basis: 186px;
  width: 186px;
}

#cl-shopping-statistics-page .list-section.list-section-product .list-table-right {
  flex: 1 1 calc(100% - 361px);
}

#cl-shopping-statistics-page .list-section.list-section-duration .list-table-right {
  flex: 1 1 calc(100% - 185px);
}

#cl-shopping-statistics-page .list-section.list-section-option .list-table-right {
  flex: 1 1 calc(100% - 186px);
}

#cl-shopping-statistics-page .list-section .list-table-right {
  overflow-x: auto;
  overflow-y: hidden;
  border-right: 0;
}

#cl-shopping-statistics-page .list-section .list-table-left table td {
  position: relative;
  color: var(--cl-text);
  font-weight: 400;
  line-height: 18px;
}

#cl-shopping-statistics-page .list-section .list-table-right table td {
  color: var(--cl-text);
  font-weight: 400;
  line-height: 18px;
  text-align: center;
}

#cl-shopping-statistics-page .list-section.list-section-duration .list-table-left table {
  width: 185px !important;
}

#cl-shopping-statistics-page .list-section.list-section-duration .list-table-left col {
  width: 185px !important;
}

#cl-shopping-statistics-page .list-section.list-section-duration .list-table-right table {
  width: 100% !important;
  min-width: 0;
  table-layout: auto;
}

#cl-shopping-statistics-page .list-section.list-section-duration .list-table-right td.mob-table-td {
  min-width: 150px;
}

#cl-shopping-statistics-page .list-section.list-section-duration .list-table-left tbody td,
#cl-shopping-statistics-page .list-section.list-section-duration .list-table-right tbody td.mob-table-td {
  color: var(--cl-green-text);
  font-weight: 600;
}

#cl-shopping-statistics-page .list-section .list-table-left table tbody td.img,
#cl-shopping-statistics-page .list-section .list-table-right table tbody td.img {
  padding: 0;
}

#cl-shopping-statistics-page .list-section .list-table-left table tbody td.img img,
#cl-shopping-statistics-page .list-section .list-table-right table tbody td.img img {
  display: block;
  width: 40px;
  height: 39px;
  object-fit: cover;
}

#cl-shopping-statistics-page .list-section .list-table-left table tbody td.img.deleted,
#cl-shopping-statistics-page .list-section .list-table-right table tbody td.img.deleted {
  background: #222428;
}

#cl-shopping-statistics-page .list-section .list-table-left table tbody td.img svg,
#cl-shopping-statistics-page .list-section .list-table-right table tbody td.img svg {
  position: absolute;
  top: 50%;
  left: 50%;
  margin: 0;
  fill: #fff;
  transform: translate(-50%, -50%);
}

#cl-shopping-statistics-page .list-section .list-table-left table tbody .img + td:nth-child(2),
#cl-shopping-statistics-page .list-section .list-table-right table tbody .img + td:nth-child(2) {
  position: relative;
  padding-right: 22px;
  text-align: left;
}

#cl-shopping-statistics-page .list-section .list-table-left table tbody td:nth-child(2) svg,
#cl-shopping-statistics-page .list-section .list-table-right table tbody td:nth-child(2) svg {
  position: absolute;
  top: 50%;
  right: 7px;
  margin: 0;
  fill: var(--cl-text-sub);
  transform: translateY(-50%);
}

#cl-shopping-statistics-page .list-section.list-section-option td .opt-title {
  display: inline-block;
  max-width: calc(100% - 42px);
  overflow: hidden;
  line-height: 20px;
  text-overflow: ellipsis;
  vertical-align: middle;
  white-space: nowrap;
}

#cl-shopping-statistics-page .list-section .list-table-left table td .info-add-option {
  position: absolute;
  top: 50%;
  right: 8px;
  padding: 1px 6px;
  border: 1px solid var(--cl-green);
  border-radius: 999px;
  color: var(--cl-green-text);
  font-size: 11px;
  font-weight: 600;
  line-height: 16px;
  transform: translateY(-50%);
}

#cl-shopping-statistics-page .list-section-product .price-changed,
#cl-shopping-statistics-page .list-section-option .price-changed {
  position: relative;
}

#cl-shopping-statistics-page .list-section-product .price-changed svg,
#cl-shopping-statistics-page .list-section-option .price-changed svg {
  position: absolute;
  margin: 0 0 0 5px !important;
  fill: var(--cl-accent-blue) !important;
}

#cl-shopping-statistics-page .list-section .list-table-left-bottom-scroll {
  border: 0;
}

#cl-shopping-statistics-page .dummy-td {
  border-right: 0 !important;
}

#cl-shopping-statistics-page > .list-table,
#cl-shopping-statistics-page .statistics-container > .list-table,
#cl-shopping-statistics-page .list-section .list-table {
  width: 100%;
  margin: 0;
  background: #fff;
  border-collapse: collapse;
}

#cl-shopping-statistics-page .notice-tr,
#cl-shopping-statistics-page .notice-tr:hover {
  background: transparent !important;
}

#cl-shopping-statistics-page .notice-td,
#cl-shopping-statistics-page .list-table td.notice-td {
  height: 180px !important;
  min-height: 180px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 10px;
  color: var(--cl-text-muted);
  font-size: 13px;
  font-weight: 400;
  text-align: center;
  vertical-align: middle;
}

#cl-shopping-statistics-page .list-section .notice-td,
#cl-shopping-statistics-page .list-section .list-table td.notice-td {
  border: 0 !important;
}

#cl-shopping-statistics-page .paging {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  width: 100%;
  margin: 24px 0 0;
  padding: 0 !important;
  background: transparent;
  border-top: 0 !important;
  color: var(--cl-text-sub);
  font-size: 13px;
  font-weight: 400;
}

#cl-shopping-statistics-page .paging a,
#cl-shopping-statistics-page .paging button,
#cl-shopping-statistics-page .paging span,
#cl-shopping-statistics-page .paging strong {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 30px;
  width: auto;
  height: 30px;
  margin: 0;
  padding: 0 8px;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 6px;
  color: var(--cl-text-muted);
  font-size: 13px;
  font-weight: 400;
  line-height: 28px;
  text-decoration: none;
  transition: background-color .12s, border-color .12s, color .12s;
}

#cl-shopping-statistics-page .paging a:hover,
#cl-shopping-statistics-page .paging button:not(:disabled):hover {
  background: #f1fbf5;
  color: var(--cl-green-text);
}

#cl-shopping-statistics-page .paging strong,
#cl-shopping-statistics-page .paging button.active {
  background: #e4f7ec;
  border-color: var(--cl-green);
  color: var(--cl-green-text);
  font-weight: 800;
  vertical-align: top;
}

#cl-shopping-statistics-page .paging button:disabled {
  cursor: default;
  opacity: .45;
}

#cl-shopping-statistics-page .paging svg {
  display: block;
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
}

#cl-shopping-statistics-page .popover {
  z-index: 1400 !important;
  max-width: min(360px, calc(100vw - 32px));
  padding: 0;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 10px;
  box-shadow: 0 10px 28px rgba(20, 24, 32, .18);
  color: var(--cl-text-sub);
}

#cl-shopping-statistics-page .popover-title {
  display: none;
}

#cl-shopping-statistics-page .popover-content {
  padding: 12px 14px;
  color: var(--cl-text-sub);
  font-size: 12.5px;
  font-weight: 400;
  line-height: 1.65;
  word-break: keep-all;
}

#cl-shopping-statistics-page .uis-datepicker-duration {
  top: calc(100% + 8px) !important;
  right: 0;
  width: 620px;
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 12px;
  box-shadow: 0 12px 30px rgba(20, 24, 32, .16);
}

#cl-shopping-statistics-page .uis-datepicker-duration .ui-datepicker-selectduration {
  height: auto;
  padding: 12px;
  gap: 6px;
  border-bottom: 1px solid var(--cl-line);
}

#cl-shopping-statistics-page .uis-datepicker-duration .ui-datepicker-selectduration-item {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 30px;
  padding: 0 8px;
  background: #f4f5f9;
  border-radius: 6px;
  color: var(--cl-text-sub);
  font-size: 11.5px;
  font-weight: 600;
  line-height: 1;
}

#cl-shopping-statistics-page .uis-datepicker-duration .ui-datepicker-selectduration-item:hover,
#cl-shopping-statistics-page .uis-datepicker-duration .ui-datepicker-selectduration-item.active {
  background: #e4f7ec;
  color: var(--cl-green-text);
}

#cl-shopping-statistics-page .uis-datepicker-duration .ui-datepicker-datetitle {
  height: 32px;
  background: #fafbfc;
  border-color: var(--cl-border);
  color: var(--cl-text-sub);
  font-size: 12.5px;
  font-weight: 700;
  line-height: 30px;
}

#cl-shopping-statistics-page .uis-datepicker-duration .ui-datepicker-header {
  margin-top: 18px;
}

#cl-shopping-statistics-page .uis-datepicker-duration .ui-datepicker-header .ui-datepicker-title span {
  color: var(--cl-text);
  font-size: 17px;
  font-weight: 700;
}

#cl-shopping-statistics-page .uis-datepicker-duration .ui-datepicker-calendar tbody tr td a,
#cl-shopping-statistics-page .uis-datepicker-duration .ui-datepicker-calendar tbody tr td span {
  color: var(--cl-text);
  font-size: 13px;
  font-weight: 500;
}

#cl-shopping-statistics-page .uis-datepicker-duration .dp-highlight .ui-state-default {
  background-color: var(--cl-green) !important;
  color: #fff !important;
}

#cl-shopping-statistics-page .uis-datepicker-duration .dp-highlight.pd-between::before,
#cl-shopping-statistics-page .uis-datepicker-duration .dp-highlight.dp-first::before,
#cl-shopping-statistics-page .uis-datepicker-duration .dp-highlight.dp-end::before,
#cl-shopping-statistics-page .uis-datepicker-duration .dp-highlight.pd-between .ui-state-default {
  background: #d9f5e5 !important;
}

#cl-shopping-statistics-page .uis-datepicker-duration .ui-datepicker-btn {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  height: auto;
  padding: 12px 16px;
  border-color: var(--cl-border);
}

#cl-shopping-statistics-page .uis-datepicker-duration .ui-datepicker-btn button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 62px;
  height: 34px;
  margin: 0;
  padding: 0 14px;
  border-radius: 6px;
  box-shadow: none;
  font-size: 13px;
  font-weight: 700;
  line-height: 32px;
}

#cl-shopping-statistics-page .uis-datepicker-duration .ui-datepicker-btn button.ui-datepicker-btn-cancel {
  background: #fff;
  border: 1px solid var(--cl-border);
  color: var(--cl-text-sub);
}

#cl-shopping-statistics-page .uis-datepicker-duration .ui-datepicker-btn button.ui-datepicker-btn-apply {
  background: var(--cl-green);
  border: 1px solid var(--cl-green);
  color: #fff;
}

@media (max-width: 1400px) {
  #cl-shopping-statistics-page .cl-source-statistics-summary {
    display: block;
  }

  #cl-shopping-statistics-page .cl-source-statistics-summary > .cl-source-statistics-summary-head {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: auto;
    min-width: 0;
    padding: 0 0 14px;
    text-align: left;
  }

  #cl-shopping-statistics-page .cl-source-statistics-summary .cl-source-statistics-summary-head .sub {
    margin: 0;
    text-align: right;
  }

  #cl-shopping-statistics-page .cl-source-statistics-summary .cl-source-statistics-summary-items {
    grid-auto-flow: row;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    row-gap: 30px;
    min-height: 0;
  }

  #cl-shopping-statistics-page .cl-source-statistics-summary .cl-source-statistics-summary-items .cl-source-statistics-summary-item::before {
    top: 0;
  }

  #cl-shopping-statistics-page .cl-source-statistics-summary .cl-source-statistics-summary-items .cl-source-statistics-summary-item:nth-child(4n+1) {
    border-left: 0;
  }

  #cl-shopping-statistics-page .cl-source-statistics-summary .cl-source-statistics-summary-actions {
    display: flex;
    justify-content: flex-end;
    margin: 14px 0 0;
  }
}

@media (max-width: 1024px) {
  #cl-shopping-statistics-page .statistics-top {
    align-items: flex-start;
  }

  #cl-shopping-statistics-page .statistics-top .date-box {
    margin-left: 0;
  }
}

@media (max-width: 900px) {
  #cl-shopping-statistics-page {
    margin-left: var(--cl-source-app-gutter) !important;
    padding: 20px 16px 40px !important;
  }
}

@media (max-width: 768px) {
  #cl-shopping-statistics-page .dashbottom-container {
    padding: 0 !important;
  }

  #cl-shopping-statistics-page .statistics-top {
    display: block;
  }

  .cl-dashboard-redesign #cl-shopping-statistics-page .cl-source-statistics-nav {
    margin-bottom: 10px;
  }

  #cl-shopping-statistics-page .statistics-top .util-left,
  #cl-shopping-statistics-page .statistics-top .date-box {
    margin-bottom: 10px;
  }

  #cl-shopping-statistics-page .statistics-top .date-box {
    position: relative;
    width: 100%;
    height: auto;
    flex-wrap: wrap;
    gap: 8px 0;
    justify-content: flex-start;
  }

  #cl-shopping-statistics-page .statistics-top .date-box .statistics-period-options .duration {
    flex: 1 1 auto;
    min-width: 0;
  }

  #cl-shopping-statistics-page .statistics-top .date-box .change-date-box {
    margin-left: 0;
  }

  #cl-shopping-statistics-page .statistics-top .date-box .order-vcal-wrap {
    position: static;
  }

  #cl-shopping-statistics-page .statistics-top .date-box .order-vcal-wrap .vcal {
    left: 0;
    right: auto;
    max-width: 100%;
  }

  #cl-shopping-statistics-page .btn-filter {
    margin-bottom: 10px !important;
  }

  body.cl-dashboard-redesign-page #cl-shopping-statistics-page .statistics-top .mobile-btn-filter {
    display: inline-flex;
    flex: 0 0 34px;
    width: 34px;
    min-width: 34px;
    max-width: 34px;
    height: 34px;
    margin: 0 0 0 8px !important;
    padding: 0;
    line-height: 1;
  }

  body.cl-dashboard-redesign-page #cl-shopping-statistics-page .statistics-top .mobile-btn-filter svg {
    display: block;
    position: static;
    width: 13px;
    height: 13px;
    margin: 0;
  }

  #cl-shopping-statistics-page .statistics-top .filter-pop {
    width: calc(100vw - 32px);
    left: 0 !important;
  }

  #cl-shopping-statistics-page .cl-source-statistics-summary .cl-source-statistics-summary-items {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  #cl-shopping-statistics-page .cl-source-statistics-summary .cl-source-statistics-summary-items .cl-source-statistics-summary-item {
    border-left: 1px solid var(--cl-border);
  }

  #cl-shopping-statistics-page .cl-source-statistics-summary .cl-source-statistics-summary-items .cl-source-statistics-summary-item:nth-child(4n+1) {
    border-left: 0;
  }

  #cl-shopping-statistics-page .filter-pop .filter-top-line,
  #cl-shopping-statistics-page .filter-pop .filter-item-box .filter-item-line {
    display: block;
  }

  #cl-shopping-statistics-page .filter-pop .filter-item-box .filter-item-right {
    margin-top: 8px;
  }

  #cl-shopping-statistics-page .util-row {
    align-items: flex-start;
    flex-direction: column;
  }

  #cl-shopping-statistics-page .util-row .util-right {
    justify-content: flex-start;
    flex-wrap: wrap;
    width: 100%;
    overflow: visible;
  }

  #cl-shopping-statistics-page .cl-source-statistics-detail-head {
    align-items: flex-start;
    flex-direction: column;
    padding: 0;
  }

  #cl-shopping-statistics-page .cl-source-statistics-detail-actions,
  #cl-shopping-statistics-page .cl-source-statistics-detail-util,
  #cl-shopping-statistics-page .cl-source-statistics-detail-util .util-right {
    width: 100% !important;
  }

  #cl-shopping-statistics-page .cl-source-statistics-detail-body {
    padding: 0;
  }

  #cl-shopping-statistics-page .cl-source-statistics-option-detail-card .cl-source-statistics-option-util .util-left {
    width: 100%;
  }

  #cl-shopping-statistics-page .cl-source-statistics-detail-head .btn-filter {
    margin-bottom: 0 !important;
  }

  #cl-shopping-statistics-page .list-section {
    overflow-x: auto;
  }
}

@media (max-width: 480px) {
  #cl-shopping-statistics-page .cl-source-statistics-summary .cl-source-statistics-summary-items {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  #cl-shopping-statistics-page .cl-source-statistics-summary .cl-source-statistics-summary-items .cl-source-statistics-summary-item {
    border-left: 1px solid var(--cl-border);
  }

  #cl-shopping-statistics-page .cl-source-statistics-summary .cl-source-statistics-summary-items .cl-source-statistics-summary-item:nth-child(2n+1) {
    border-left: 0;
  }

  #cl-shopping-statistics-page .statistics-top .util-left > div {
    padding-right: 14px;
    padding-left: 14px;
  }
}

@media (max-width: 767px) {
  #cl-shopping-statistics-page .list-section .list-table-right {
    min-width: 720px;
  }
}

/* Shopping points page */
:is(#cl-shopping-point-setting-page, #cl-shopping-point-list-page, #cl-shopping-point-member-page) {
  width: auto !important;
  max-width: none !important;
  margin-top: 0 !important;
  margin-right: var(--cl-source-app-gutter) !important;
  margin-left: calc(var(--cl-source-app-gutter) + var(--cl-source-sidebar-w)) !important;
  padding: 28px 32px 60px !important;
  background: transparent !important;
  color: var(--cl-text);
}

:is(#cl-shopping-point-setting-page, #cl-shopping-point-list-page, #cl-shopping-point-member-page),
:is(#cl-shopping-point-setting-page, #cl-shopping-point-list-page, #cl-shopping-point-member-page) * {
  box-sizing: border-box;
}

:is(#cl-shopping-point-setting-page, #cl-shopping-point-list-page, #cl-shopping-point-member-page) .dashbottom-container {
  display: block !important;
  float: none !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 0;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent;
  border: 0;
  box-shadow: none;
}

#cl-shopping-point-setting-page .cl-source-points-main {
  display: flex !important;
  flex-direction: column !important;
  gap: 18px !important;
  clear: both !important;
  width: 100% !important;
  max-width: 760px !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

:is(#cl-shopping-point-setting-page, #cl-shopping-point-list-page, #cl-shopping-point-member-page) #section-top-menu,
:is(#cl-shopping-point-setting-page, #cl-shopping-point-list-page, #cl-shopping-point-member-page) .mobile-title {
  display: none !important;
}

:is(#cl-shopping-point-setting-page, #cl-shopping-point-list-page, #cl-shopping-point-member-page) .cl-source-points-head {
  margin: 0 0 20px;
}

:is(#cl-shopping-point-setting-page, #cl-shopping-point-list-page, #cl-shopping-point-member-page) .cl-source-points-breadcrumb {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  color: var(--cl-text);
  font-size: 20px;
  font-weight: 700;
  line-height: 1.35;
}

:is(#cl-shopping-point-setting-page, #cl-shopping-point-list-page, #cl-shopping-point-member-page) .cl-source-points-breadcrumb .sep {
  color: var(--cl-text-muted);
  font-size: 23px;
  font-weight: 400;
  line-height: 1;
}

:is(#cl-shopping-point-setting-page, #cl-shopping-point-list-page, #cl-shopping-point-member-page) .cl-source-points-breadcrumb .current {
  color: var(--cl-text-sub);
  font-weight: 700;
}

:is(#cl-shopping-point-setting-page, #cl-shopping-point-list-page, #cl-shopping-point-member-page) .cl-source-points-desc {
  margin: 10px 0 0;
  color: var(--cl-text-sub);
  font-size: 13px;
  font-weight: 400;
  line-height: 1.45;
}

:is(#cl-shopping-point-setting-page, #cl-shopping-point-list-page, #cl-shopping-point-member-page) .submenu_navWrap {
  position: static !important;
  display: block !important;
  width: calc(100% + 48px) !important;
  max-width: none !important;
  height: 56px !important;
  margin: 0 -24px 26px !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

:is(#cl-shopping-point-setting-page, #cl-shopping-point-list-page, #cl-shopping-point-member-page) .submenu_navWrap .submenu_nav {
  display: flex !important;
  align-items: stretch !important;
  float: none !important;
  width: 100% !important;
  height: 56px !important;
  min-height: 56px !important;
  margin: 0 !important;
  padding: 0 26px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid var(--cl-border) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

:is(#cl-shopping-point-setting-page, #cl-shopping-point-list-page, #cl-shopping-point-member-page) .submenu_navWrap .submenu_nav ul {
  display: flex;
  flex: none;
  align-items: center;
  gap: 28px;
  width: auto !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  list-style: none;
}

:is(#cl-shopping-point-setting-page, #cl-shopping-point-list-page, #cl-shopping-point-member-page) .submenu_navWrap .submenu_nav ul:first-child {
  overflow-x: visible !important;
  overflow-y: visible !important;
}

:is(#cl-shopping-point-setting-page, #cl-shopping-point-list-page, #cl-shopping-point-member-page) .submenu_navWrap .submenu_nav li {
  display: flex !important;
  align-items: stretch !important;
  flex: none;
  float: none !important;
  width: auto !important;
  min-width: 0 !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

:is(#cl-shopping-point-setting-page, #cl-shopping-point-list-page, #cl-shopping-point-member-page) .submenu_navWrap .submenu_nav li + li {
  border-left: 0 !important;
}

:is(#cl-shopping-point-setting-page, #cl-shopping-point-list-page, #cl-shopping-point-member-page) .submenu_navWrap .submenu_nav .sub-menu {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  box-sizing: border-box !important;
  height: 56px !important;
  min-width: 0;
  margin: 0 !important;
  padding: 0 2px !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 2px solid transparent !important;
  border-radius: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 14.5px !important;
  font-weight: 600 !important;
  line-height: 20px !important;
  text-decoration: none !important;
  white-space: nowrap;
  transform: none;
  transition: color .12s, border-color .12s;
}

:is(#cl-shopping-point-setting-page, #cl-shopping-point-list-page, #cl-shopping-point-member-page) .submenu_navWrap .submenu_nav .sub-menu:hover {
  background: transparent !important;
  color: var(--cl-text) !important;
}

:is(#cl-shopping-point-setting-page, #cl-shopping-point-list-page, #cl-shopping-point-member-page) .submenu_navWrap .submenu_nav .sub-menu.active {
  background: transparent !important;
  border-bottom-color: var(--cl-green) !important;
  color: var(--cl-green-text) !important;
  font-weight: 700 !important;
}

:is(#cl-shopping-point-setting-page, #cl-shopping-point-list-page, #cl-shopping-point-member-page) .cl-source-points-content {
  float: none !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

#cl-shopping-point-setting-page .cl-source-points-setting-content,
#cl-shopping-point-setting-page .cl-source-points-save.pt-outsave {
  width: 100% !important;
  max-width: 760px !important;
}

#cl-shopping-point-setting-page .cl-source-points-setting-content {
  margin-bottom: 0 !important;
}

:is(#cl-shopping-point-setting-page, #cl-shopping-point-list-page, #cl-shopping-point-member-page) .cl-source-points-card {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 24px 26px !important;
  overflow: visible !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: var(--cl-radius-lg) !important;
  box-shadow: var(--cl-shadow-panel) !important;
}

#cl-shopping-point-setting-page .cl-source-points-card {
  max-width: 760px !important;
}

:is(#cl-shopping-point-setting-page, #cl-shopping-point-list-page, #cl-shopping-point-member-page) .cl-source-points-card > .setting-sub-box,
:is(#cl-shopping-point-setting-page, #cl-shopping-point-list-page, #cl-shopping-point-member-page) .cl-source-points-panel {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

#cl-shopping-point-setting-page .cl-source-points-form .setting-subInfoBox {
  display: flex;
  float: none !important;
  gap: 24px;
  width: 100%;
  margin: 0 !important;
  padding: 26px 0 !important;
  border: 0;
  border-bottom: 1px solid #f0f1f4;
}

#cl-shopping-point-setting-page .cl-source-points-form .setting-subInfoBox:first-child {
  padding-top: 6px !important;
}

#cl-shopping-point-setting-page .cl-source-points-form .setting-subInfoBox:last-child {
  margin-bottom: 0 !important;
  padding-bottom: 26px !important;
  border-bottom: 0 !important;
}

#cl-shopping-point-setting-page .cl-source-points-form .setting-sub-title {
  flex: 0 0 120px;
  float: none;
  width: 120px;
  margin: 0;
  padding: 2px 0 0;
  color: var(--cl-text);
  font-size: 15px;
  font-weight: 700;
  line-height: 21px;
}

#cl-shopping-point-setting-page .cl-source-points-form .setting-sub-content {
  flex: 1 1 0;
  display: flow-root;
  float: none;
  width: 100% !important;
  max-width: none !important;
  min-width: 0;
  margin: 0;
  padding: 0;
}

#cl-shopping-point-setting-page .point_onoff .setting-sub-content-radio-box {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0;
  margin: 0;
}

#cl-shopping-point-setting-page .point_onoff .setting-sub-content-radio-box > .newcheckbox {
  display: inline-flex;
  align-items: center;
  min-height: 18px;
  margin: 0 22px 0 0 !important;
}

#cl-shopping-point-setting-page .point_onoff .setting-sub-content-radio-box > .newcheckbox:last-child {
  margin-right: 0 !important;
}

#cl-shopping-point-setting-page .newcheckbox label,
#cl-shopping-point-setting-page .settingCheckbox label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 0;
  color: var(--cl-text);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 20px;
  cursor: pointer;
}

#cl-shopping-point-setting-page .point_onoff .newcheckbox label {
  align-items: center;
  gap: 0;
  min-height: 18px;
  line-height: 1;
}

#cl-shopping-point-setting-page .newcheckboxSvgRadio {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  flex: none;
}

#cl-shopping-point-setting-page .point_onoff .newcheckboxSvgRadio {
  position: relative;
  width: 18px;
  height: 18px;
}

#cl-shopping-point-setting-page .point_onoff .newcheckboxSvgRadio input[type="radio"] {
  position: absolute !important;
  inset: 0;
  z-index: 1;
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
  opacity: 0.00000001 !important;
  cursor: inherit;
}

#cl-shopping-point-setting-page .point_onoff .newcheckboxSvgRadio svg {
  display: block !important;
  width: 18px;
  height: 18px;
  margin: 0;
}

#cl-shopping-point-setting-page .point_onoff .newcheckboxSvgRadio svg.active {
  display: none !important;
}

#cl-shopping-point-setting-page .point_onoff .newcheckboxSvgRadio input[type="radio"]:checked ~ svg {
  display: none !important;
}

#cl-shopping-point-setting-page .point_onoff .newcheckboxSvgRadio input[type="radio"]:checked ~ svg.active {
  display: block !important;
}

#cl-shopping-point-setting-page .point_onoff .newcheckboxSvgRadio .pt-radio-ring {
  fill: none !important;
  stroke-width: 2px;
}

#cl-shopping-point-setting-page .point_onoff .newcheckboxSvgRadio svg:not(.active) .pt-radio-ring {
  stroke: #DBDCDF;
}

#cl-shopping-point-setting-page .point_onoff .newcheckboxSvgRadio svg.active .pt-radio-ring {
  stroke: var(--cl-green);
}

#cl-shopping-point-setting-page .point_onoff .newcheckboxSvgRadio svg.active .pt-radio-dot {
  fill: var(--cl-green);
}

#cl-shopping-point-setting-page .newcheckboxSvgRadio .active path,
#cl-shopping-point-setting-page .newcheckboxSvgRadio .active circle,
#cl-shopping-point-setting-page .newcheckboxSvg .active path,
#cl-shopping-point-setting-page .newcheckboxSvg .active rect {
  fill: var(--cl-green);
}

#cl-shopping-point-setting-page .setting-sub-content-title.setting-point {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  float: none;
  width: 100%;
  height: 28px;
  min-height: 28px;
  margin: 0 !important;
}

#cl-shopping-point-setting-page .setting-sub-content-title.setting-point .settingCheckbox {
  --pt-switch-width: 36px;
  --pt-switch-height: 20px;
  --pt-switch-knob: 14px;
  --pt-switch-pad: 3px;
  position: relative;
  display: flex !important;
  align-items: center;
  justify-content: flex-start;
  gap: 6px;
  width: 100%;
  height: 28px;
  min-height: 28px;
  margin: 0 !important;
  padding: 0 calc(var(--pt-switch-width) + 12px) 0 0 !important;
  cursor: default;
}

#cl-shopping-point-setting-page .setting-sub-content-title.setting-point .settingCheckbox label {
  display: inline-flex !important;
  align-items: center;
  flex: 0 1 auto;
  min-width: 0;
  max-width: 100%;
  gap: 0;
  margin: 0;
  cursor: default;
}

#cl-shopping-point-setting-page .setting-sub-content-title.setting-point .settingCheckbox label > span {
  display: inline-block;
  flex: 0 1 auto;
  min-width: 0;
  margin: 0;
  overflow: visible;
  color: var(--cl-text);
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
  text-overflow: clip;
  white-space: nowrap;
}

#cl-shopping-point-setting-page .setting-point-Box:not(.is-point-enabled) .settingCheckbox label > span {
  color: var(--cl-text-sub);
}

#cl-shopping-point-setting-page .setting-point-Box.is-point-enabled .settingCheckbox label > span {
  color: var(--cl-text);
}

#cl-shopping-point-setting-page .setting-sub-content-title.setting-point .settingCheckbox .cm-popover-info {
  position: relative;
  top: 0;
  display: block;
  align-self: center;
  flex: 0 0 13px;
  width: 13px;
  height: 13px;
  margin: 0 !important;
  vertical-align: middle;
}

#cl-shopping-point-setting-page .setting-sub-content-title.setting-point .newcheckboxSvg {
  position: absolute;
  top: 50%;
  right: 0;
  display: inline-block !important;
  flex: 0 0 var(--pt-switch-width);
  float: none;
  width: var(--pt-switch-width) !important;
  min-width: var(--pt-switch-width) !important;
  max-width: var(--pt-switch-width) !important;
  height: var(--pt-switch-height) !important;
  min-height: var(--pt-switch-height) !important;
  max-height: var(--pt-switch-height) !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  line-height: 0;
  cursor: pointer;
  transform: translateY(-50%);
}

#cl-shopping-point-setting-page .setting-sub-content-title.setting-point .newcheckboxSvg input[type="checkbox"] {
  position: absolute !important;
  inset: 0;
  z-index: 2;
  float: none !important;
  display: block !important;
  width: var(--pt-switch-width) !important;
  min-width: var(--pt-switch-width) !important;
  max-width: var(--pt-switch-width) !important;
  height: var(--pt-switch-height) !important;
  min-height: var(--pt-switch-height) !important;
  max-height: var(--pt-switch-height) !important;
  margin: 0 !important;
  appearance: none;
  -webkit-appearance: none;
  background: transparent !important;
  border: 0 !important;
  opacity: 0 !important;
  cursor: pointer;
}

#cl-shopping-point-setting-page .setting-sub-content-title.setting-point .newcheckboxSvg svg {
  display: none !important;
}

#cl-shopping-point-setting-page .setting-sub-content-title.setting-point .newcheckboxSvg::before {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 0;
  display: block;
  width: var(--pt-switch-width);
  height: var(--pt-switch-height);
  background: #D5D9E0;
  border-radius: 999px;
  pointer-events: none;
  transition: background .18s;
}

#cl-shopping-point-setting-page .setting-sub-content-title.setting-point .newcheckboxSvg::after {
  content: "";
  position: absolute;
  z-index: 1;
  top: var(--pt-switch-pad);
  left: var(--pt-switch-pad);
  display: block;
  width: var(--pt-switch-knob);
  height: var(--pt-switch-knob);
  background: #fff;
  border: 0;
  border-radius: 50%;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .2);
  pointer-events: none;
  transition: transform .18s;
}

#cl-shopping-point-setting-page .setting-sub-content-title.setting-point .newcheckboxSvg:has(input[type="checkbox"]:checked)::before {
  background: var(--cl-green);
}

#cl-shopping-point-setting-page .setting-sub-content-title.setting-point .newcheckboxSvg.is-checked::before {
  background: var(--cl-green);
}

#cl-shopping-point-setting-page .setting-sub-content-title.setting-point .newcheckboxSvg:has(input[type="checkbox"]:checked)::after {
  transform: translateX(calc(var(--pt-switch-width) - var(--pt-switch-knob) - (var(--pt-switch-pad) * 2)));
}

#cl-shopping-point-setting-page .setting-sub-content-title.setting-point .newcheckboxSvg.is-checked::after {
  transform: translateX(calc(var(--pt-switch-width) - var(--pt-switch-knob) - (var(--pt-switch-pad) * 2)));
}

#cl-shopping-point-setting-page .setting-subInfoBox:not(.point_onoff) .setting-sub-content {
  overflow: visible;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 12px;
}

#cl-shopping-point-setting-page .setting-subInfoBox:not(.point_onoff) .setting-point-Box,
#cl-shopping-point-setting-page .setting-subInfoBox:not(.point_onoff) .setting-sub-content > .setting-sub-content-title:not(.c-red),
#cl-shopping-point-setting-page .setting-subInfoBox:not(.point_onoff) .setting-text-box {
  margin: 0 !important;
  padding: 16px 18px !important;
  border: 0;
  border-bottom: 1px solid #f0f1f4;
}

#cl-shopping-point-setting-page .setting-subInfoBox:not(.point_onoff) .setting-point-Box {
  min-height: 61px;
  transition: background .12s;
}

#cl-shopping-point-setting-page .setting-subInfoBox:not(.point_onoff) .setting-point-Box:not(.is-point-enabled) {
  height: 61px;
}

#cl-shopping-point-setting-page .setting-subInfoBox:not(.point_onoff) .setting-sub-content > *:last-child {
  border-bottom: 0 !important;
}

#cl-shopping-point-setting-page .setting-subInfoBox:not(.point_onoff) .setting-sub-content > *:first-child {
  border-radius: 12px 12px 0 0;
}

#cl-shopping-point-setting-page .setting-subInfoBox:not(.point_onoff) .setting-sub-content > *:last-child {
  border-radius: 0 0 12px 12px;
}

#cl-shopping-point-setting-page .setting-subInfoBox:not(.point_onoff) .setting-sub-content > *:only-child {
  border-radius: 12px;
}

#cl-shopping-point-setting-page .setting-sub-content > .setting-sub-content-title:not(.c-red) {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 28px;
  color: var(--cl-text);
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
}

#cl-shopping-point-setting-page .setting-sub-content-title .cm-popover-info {
  position: relative;
  top: 1px;
  flex: none;
  margin-left: 2px;
  fill: var(--cl-accent-blue);
  vertical-align: middle;
}

#cl-shopping-point-setting-page .setting-sub-content-title .cm-popover-info :is(path, rect, circle) {
  fill: var(--cl-accent-blue) !important;
}

#cl-shopping-point-setting-page .setting-point-Wrap,
#cl-shopping-point-setting-page .point-pay-review {
  margin: 14px 0 0 !important;
  padding: 0 !important;
}

#cl-shopping-point-setting-page .setting-point-Box:not(.is-point-enabled) > .setting-point-Wrap,
#cl-shopping-point-setting-page .setting-point-Box:not(.is-point-enabled) > .point-pay-review {
  display: none !important;
}

#cl-shopping-point-setting-page .setting-point-Box.is-point-enabled {
  background: #fbfcfe;
}

#cl-shopping-point-setting-page .delivery-price {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  color: var(--cl-text-sub);
  font-size: 14px;
  font-weight: 400;
  line-height: 34px;
}

#cl-shopping-point-setting-page .cl-common-form-wrap,
#cl-shopping-point-setting-page .setting-pay-select {
  display: inline-flex;
  width: auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  vertical-align: middle;
}

#cl-shopping-point-setting-page .cl-common-form-wrap {
  padding: 0 !important;
  overflow: visible;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  -webkit-box-shadow: none !important;
}

#cl-shopping-point-setting-page .cl-common-form-group {
  display: inline-flex;
  align-items: center;
  box-sizing: border-box;
  width: auto !important;
  min-width: 82px;
  height: 35px;
  padding: 0 !important;
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--cl-border) !important;
  border-radius: var(--cl-radius-sm);
  box-shadow: none !important;
  -webkit-box-shadow: none !important;
  outline: 0 !important;
  background-clip: padding-box;
  float: none !important;
}

#cl-shopping-point-setting-page .cl-common-form-group:hover,
#cl-shopping-point-setting-page .cl-common-form-group:focus-within {
  border-color: var(--cl-border) !important;
  box-shadow: none !important;
  -webkit-box-shadow: none !important;
  outline: 0 !important;
}

#cl-shopping-point-setting-page .cl-common-form-group.disabled {
  background: #f7f8fa;
  opacity: .72;
}

#cl-shopping-point-setting-page .setting-pay-select.disabled {
  background: transparent;
  opacity: 1;
}

#cl-shopping-point-setting-page .cl-common-form-group input {
  appearance: none !important;
  -webkit-appearance: none !important;
  display: block !important;
  width: 96px !important;
  height: 33px !important;
  margin: 0 !important;
  padding: 0 8px 0 12px !important;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  -webkit-box-shadow: none !important;
  color: var(--cl-text) !important;
  font-size: 14px !important;
  float: none !important;
  line-height: 33px !important;
  text-align: right;
  outline: 0 !important;
  outline-offset: 0 !important;
  filter: none !important;
}

#cl-shopping-point-setting-page .cl-common-form-group input:hover,
#cl-shopping-point-setting-page .cl-common-form-group input:focus,
#cl-shopping-point-setting-page .cl-common-form-group input:focus-visible,
#cl-shopping-point-setting-page .cl-common-form-group input:active,
#cl-shopping-point-setting-page .cl-common-form-group input:valid,
#cl-shopping-point-setting-page .cl-common-form-group input:read-only,
#cl-shopping-point-setting-page .cl-common-form-group input:disabled {
  appearance: none !important;
  -webkit-appearance: none !important;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  -webkit-box-shadow: none !important;
  outline: 0 !important;
  outline-offset: 0 !important;
}

#cl-shopping-point-setting-page .money_text {
  position: static !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  order: 2;
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  height: 33px;
  padding: 0 12px 0 2px;
  color: var(--cl-text-sub);
  font-size: 13px;
  line-height: 33px;
}

#cl-shopping-point-setting-page .cl-common-form-group input {
  order: 1;
}

#cl-shopping-point-setting-page .setting-point-Wrap .cl-common-form-wrap.nonplace-holder.setting-month-custom {
  display: inline-flex;
  align-items: center;
  width: auto !important;
  min-width: 0 !important;
  height: 35px;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1;
}

#cl-shopping-point-setting-page .setting-point-Wrap .cl-common-form-wrap.nonplace-holder.setting-month-custom[style*="display: none"] {
  display: none !important;
}

#cl-shopping-point-setting-page .setting-month-custom .cl-common-form-group {
  display: inline-flex;
  align-items: center;
  box-sizing: border-box;
  width: 122px !important;
  min-width: 122px;
  max-width: 122px;
  height: 35px;
  padding: 0 !important;
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--cl-border) !important;
  border-radius: var(--cl-radius-sm);
  box-shadow: none !important;
  float: none !important;
}

#cl-shopping-point-setting-page .setting-month-custom .cl-common-form-group.disabled {
  background: #f7f8fa;
  opacity: .72;
}

#cl-shopping-point-setting-page .setting-month-custom .cl-common-form-group input[name="point_month_custom"] {
  flex: 1 1 auto;
  width: auto !important;
  min-width: 0;
  max-width: none !important;
  height: 33px !important;
  margin: 0 !important;
  margin-right: 0 !important;
  padding: 0 8px 0 12px !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--cl-text) !important;
  font-size: 14px !important;
  float: none !important;
  line-height: 33px !important;
  text-align: right;
  outline: 0;
}

#cl-shopping-point-setting-page .setting-month-custom .cl-common-form-group input[name="point_month_custom"]:focus {
  border: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

#cl-shopping-point-setting-page .setting-month-custom .cl-common-form-group .money_text {
  position: static !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  flex: 0 0 auto;
  display: inline-flex !important;
  align-items: center;
  justify-content: flex-end;
  height: 33px;
  padding: 0 12px 0 2px;
  color: var(--cl-text-sub);
  font-size: 13px;
  line-height: 33px;
  white-space: nowrap;
}

#cl-shopping-point-setting-page .setting-pay-select select {
  width: auto !important;
  min-width: 120px;
  height: 34px !important;
  margin: 0 !important;
  padding: 0 30px 0 12px !important;
  appearance: none;
  -webkit-appearance: none;
  background-color: #fff;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238A8F98' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-position: right 8px center;
  background-repeat: no-repeat;
  background-size: 14px;
  border: 1px solid var(--cl-border) !important;
  border-radius: var(--cl-radius-sm) !important;
  box-shadow: none !important;
  color: var(--cl-text);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 34px;
}

#cl-shopping-point-setting-page .setting-point-useCheck {
  --cl-point-select-width: 120px;
  --cl-point-select-height: 35px;
  --cl-point-select-inner-height: 33px;
  --cl-point-select-padding-start: 12px;
  --cl-point-select-padding-end: 30px;
  position: relative;
  box-sizing: border-box;
  width: var(--cl-point-select-width) !important;
  min-width: var(--cl-point-select-width) !important;
  height: var(--cl-point-select-height);
  padding: 0;
  overflow: visible;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  transition: background-color .12s, border-color .12s;
}

#cl-shopping-point-setting-page .setting-point-useCheck:hover,
#cl-shopping-point-setting-page .setting-point-useCheck:focus-within {
  background: transparent;
  border-color: transparent;
}

#cl-shopping-point-setting-page .setting-point-useCheck.disabled {
  background: transparent;
  opacity: 1;
}

#cl-shopping-point-setting-page .point-state-select {
  --cl-point-select-width: 80px;
  --cl-point-select-height: 35px;
  --cl-point-select-inner-height: 33px;
  position: relative;
  box-sizing: border-box;
  width: var(--cl-point-select-width) !important;
  min-width: var(--cl-point-select-width) !important;
  max-width: var(--cl-point-select-width) !important;
  height: var(--cl-point-select-height);
  padding: 0;
  overflow: visible;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

#cl-shopping-point-setting-page .setting-point-useCheck select.cl-redesign-select-source-enhanced {
  box-sizing: border-box;
  width: var(--cl-point-select-width) !important;
  min-width: var(--cl-point-select-width);
  max-width: var(--cl-point-select-width);
  height: var(--cl-point-select-inner-height) !important;
  margin: 0 !important;
  padding: 0 var(--cl-point-select-padding-end) 0 var(--cl-point-select-padding-start) !important;
  background: transparent !important;
  border: 0 !important;
  line-height: var(--cl-point-select-inner-height);
}

#cl-shopping-point-setting-page .setting-point-useCheck .bootstrap-select > select {
  position: absolute !important;
  bottom: 0 !important;
  left: 50% !important;
  display: block !important;
  width: .5px !important;
  min-width: 0 !important;
  max-width: .5px !important;
  height: 100% !important;
  padding: 0 !important;
  opacity: 0 !important;
  border: 0 !important;
  z-index: 0 !important;
}

#cl-shopping-point-setting-page .setting-point-useCheck .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn) {
  box-sizing: border-box;
  width: var(--cl-point-select-width) !important;
  min-width: 0 !important;
  max-width: var(--cl-point-select-width);
  height: var(--cl-point-select-inner-height);
}

#cl-shopping-point-setting-page .setting-point-useCheck .bootstrap-select .dropdown-toggle .bs-caret {
  display: none;
}

#cl-shopping-point-setting-page .setting-point-useCheck .bootstrap-select .btn.btn-default,
#cl-shopping-point-setting-page .setting-point-useCheck .bootstrap-select .btn.btn-default:hover,
#cl-shopping-point-setting-page .setting-point-useCheck .bootstrap-select .btn.btn-default:focus,
#cl-shopping-point-setting-page .setting-point-useCheck .bootstrap-select .btn.btn-default:active,
#cl-shopping-point-setting-page .setting-point-useCheck .bootstrap-select.open .btn.btn-default {
  width: 100%;
  max-width: var(--cl-point-select-width);
  height: var(--cl-point-select-inner-height) !important;
  min-height: var(--cl-point-select-inner-height);
  margin: 0;
  padding: 0 var(--cl-point-select-padding-end) 0 var(--cl-point-select-padding-start) !important;
  background-color: transparent !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238A8F98' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-position: right 8px center;
  background-repeat: no-repeat;
  background-size: 14px;
  border: 0 !important;
  border-radius: var(--cl-radius-sm);
  box-shadow: none !important;
  color: var(--cl-text);
  font-size: 13.5px;
  font-weight: 400;
  line-height: var(--cl-point-select-inner-height) !important;
  outline: 0 !important;
}

#cl-shopping-point-setting-page .setting-point-useCheck .bootstrap-select .filter-option {
  left: var(--cl-point-select-padding-start);
  right: var(--cl-point-select-padding-end);
  width: auto;
  height: var(--cl-point-select-inner-height);
  padding: 0;
  overflow: visible;
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: var(--cl-point-select-inner-height);
  white-space: nowrap;
}

#cl-shopping-point-setting-page .setting-point-useCheck .bootstrap-select .filter-option-inner,
#cl-shopping-point-setting-page .setting-point-useCheck .bootstrap-select .filter-option-inner-inner {
  height: var(--cl-point-select-inner-height);
  overflow: visible;
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: var(--cl-point-select-inner-height);
  white-space: nowrap;
}

#cl-shopping-point-setting-page .setting-point-useCheck .bootstrap-select > .dropdown-menu {
  top: var(--cl-select-menu-top, calc(100% + 4px));
  min-width: 100%;
  margin: 0;
  padding: 4px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(20, 24, 32, .14);
}

#cl-shopping-point-setting-page .setting-point-useCheck .bootstrap-select .dropdown-menu.inner {
  position: static;
  min-width: 0;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

#cl-shopping-point-setting-page .setting-point-useCheck .bootstrap-select .dropdown-menu > li > a {
  min-height: 0;
  padding: 8px 12px;
  border-radius: var(--cl-radius-sm);
  color: var(--cl-text);
  font-size: 12.5px;
  font-weight: 400;
  line-height: 18px;
}

#cl-shopping-point-setting-page .setting-point-useCheck .bootstrap-select .dropdown-menu > .active:not(.selected) > a {
  background: transparent;
  color: var(--cl-text);
  font-weight: 400;
}

#cl-shopping-point-setting-page .setting-point-useCheck .bootstrap-select .dropdown-menu > li:not(.selected) > a:hover,
#cl-shopping-point-setting-page .setting-point-useCheck .bootstrap-select .dropdown-menu > li:not(.selected) > a:focus,
#cl-shopping-point-setting-page .setting-point-useCheck .bootstrap-select .dropdown-menu > .active:not(.selected) > a:hover,
#cl-shopping-point-setting-page .setting-point-useCheck .bootstrap-select .dropdown-menu > .active:not(.selected) > a:focus {
  background: #f3fcf7;
  color: var(--cl-green-text);
}

#cl-shopping-point-setting-page .setting-point-useCheck .bootstrap-select .dropdown-menu > .selected > a,
#cl-shopping-point-setting-page .setting-point-useCheck .bootstrap-select .dropdown-menu > .selected > a:hover,
#cl-shopping-point-setting-page .setting-point-useCheck .bootstrap-select .dropdown-menu > .selected > a:focus {
  background: #e4f7ec;
  color: var(--cl-green-text);
}

#cl-shopping-point-setting-page .setting-point-useCheck .bootstrap-select .dropdown-menu > .selected > a {
  font-weight: 700;
}

#cl-shopping-point-setting-page .setting-pay-select .cl-point-redesign-select {
  position: relative;
  display: inline-block;
  width: 100%;
}

#cl-shopping-point-setting-page .setting-pay-select .cl-point-redesign-select.disabled .cl-redesign-select-trigger {
  background: #f7f8fa;
  color: var(--cl-text-sub);
  opacity: .72;
  cursor: default;
}

#cl-shopping-point-setting-page .setting-pay-select .cl-redesign-select-trigger {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  height: var(--cl-point-select-height, 35px);
  padding: 0 10px 0 12px;
  color: var(--cl-text);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 18px;
}

#cl-shopping-point-setting-page .setting-pay-select .cl-redesign-select-menu {
  position: absolute;
  display: none;
  top: var(--cl-select-menu-top, calc(100% + 4px));
  left: 0;
  z-index: 40;
  box-sizing: border-box;
  min-width: 100%;
  margin: 0;
  padding: 4px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(20, 24, 32, .14);
  list-style: none;
}

#cl-shopping-point-setting-page .setting-pay-select .cl-point-redesign-select.open > .cl-redesign-select-menu {
  display: block;
}

#cl-shopping-point-setting-page .setting-pay-select .cl-point-redesign-select.open .cl-redesign-select-arrow {
  transform: rotate(180deg);
}

#cl-shopping-point-setting-page .setting-pay-select .cl-redesign-select-menu li {
  display: block;
  padding: 8px 12px;
  border-radius: var(--cl-radius-sm);
  color: var(--cl-text);
  font-size: 12.5px;
  font-weight: 400;
  line-height: 18px;
  white-space: nowrap;
  cursor: pointer;
}

#cl-shopping-point-setting-page .setting-pay-select .cl-redesign-select-menu li + li {
  margin-top: 2px;
}

#cl-shopping-point-setting-page .setting-pay-select .cl-redesign-select-menu li:hover,
#cl-shopping-point-setting-page .setting-pay-select .cl-redesign-select-menu li:focus,
#cl-shopping-point-setting-page .setting-pay-select .cl-redesign-select-menu li.active {
  background: #e4f7ec;
  color: var(--cl-green-text);
}

#cl-shopping-point-setting-page .setting-pay-select .cl-redesign-select-menu li.active {
  font-weight: 700;
}

#cl-shopping-point-setting-page .setting-pay-select select[data-cl-redesign-select].cl-redesign-select-source-enhanced {
  display: none !important;
  pointer-events: none !important;
}

#cl-shopping-point-setting-page .setting-pay-select > svg {
  display: none !important;
}

#cl-shopping-point-setting-page .c-red {
  display: none;
  margin-top: 8px !important;
  color: var(--cl-danger) !important;
  font-size: 12.5px !important;
  font-weight: 400;
  line-height: 18px;
}

#cl-shopping-point-setting-page .c-red svg {
  flex: none;
  margin-right: 4px;
  vertical-align: -2px;
}

#cl-shopping-point-setting-page .c-red svg path,
#cl-shopping-point-setting-page .c-red svg rect {
  fill: var(--cl-danger);
}

#cl-shopping-point-setting-page .c-blue {
  color: var(--cl-text-sub) !important;
  font-size: 12.5px !important;
  font-weight: 400 !important;
  line-height: 1.7;
}

#cl-shopping-point-setting-page .point-pay-review {
  display: flex;
  flex-wrap: wrap;
  gap: 14px 30px;
}

#cl-shopping-point-setting-page .point-pay-review > .clear {
  display: none;
}

#cl-shopping-point-setting-page .point-pay-review > .review-text {
  flex-basis: 100%;
}

#cl-shopping-point-setting-page .point-pay-review > span:not(.money_text) {
  display: block !important;
  flex-basis: 100%;
  max-width: 600px;
  margin: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 12.5px !important;
  font-weight: 400 !important;
  line-height: 1.7 !important;
}

#cl-shopping-point-setting-page .half-setting-content {
  display: inline-flex;
  float: none;
  flex-direction: column;
  gap: 8px;
  width: auto !important;
  min-width: 0;
  margin: 0 !important;
  vertical-align: top;
}

#cl-shopping-point-setting-page .point-pay-review .half-setting-content > .setting-sub-content-title {
  display: block !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 18px !important;
}

#cl-shopping-point-setting-page .point-pay-review .half-setting-content .setting-point-Wrap {
  margin: 0 !important;
  padding: 0 !important;
}

#cl-shopping-point-setting-page .cl-source-points-save.pt-outsave {
  display: flex !important;
  align-items: center;
  justify-content: flex-end !important;
  float: none !important;
  clear: none !important;
  position: static !important;
  inset: auto !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  z-index: auto !important;
  width: 100% !important;
  max-width: 760px !important;
  min-height: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 2px 0 0 !important;
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  transform: none !important;
}

#cl-shopping-point-setting-page .cl-source-points-save.pt-outsave .setting-button,
#cl-shopping-point-setting-page .cl-source-points-save.pt-outsave .setting-button.pt-save {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  float: none !important;
  position: static !important;
  inset: auto !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  width: 92px !important;
  min-width: 92px !important;
  max-width: 92px !important;
  height: 42px !important;
  min-height: 42px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: var(--cl-green) !important;
  border: 0 !important;
  border-radius: 8px !important;
  color: #fff !important;
  font-size: 14px;
  font-weight: 800;
  line-height: 18px;
  cursor: pointer;
  transform: none !important;
  transition: background-color .13s, border-color .13s;
}

#cl-shopping-point-setting-page .cl-source-points-save .setting-button:hover {
  background: var(--cl-green-hover) !important;
  border-color: var(--cl-green-hover) !important;
}

:is(#cl-shopping-point-list-page, #cl-shopping-point-member-page) .cl-source-points-card {
  padding: 0 24px 26px !important;
}

:is(#cl-shopping-point-list-page, #cl-shopping-point-member-page) .cl-source-points-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin: 0 0 18px;
}

:is(#cl-shopping-point-list-page, #cl-shopping-point-member-page) .cl-source-points-panel-title {
  color: var(--cl-text);
  font-size: 16px;
  font-weight: 700;
  line-height: 22px;
}

:is(#cl-shopping-point-list-page, #cl-shopping-point-member-page) .cl-source-points-filter {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
  width: 100%;
  min-height: 40px;
  margin: 0 0 18px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

#cl-shopping-point-list-page .cl-source-points-filter {
  display: block !important;
  min-height: 0;
  margin: 0 0 20px !important;
  padding: 6px 22px 10px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: var(--cl-radius-md) !important;
  box-shadow: var(--cl-shadow-panel) !important;
}

#cl-shopping-point-list-page .cl-source-points-filter-row {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  width: 100%;
  padding: 15px 0 6px;
  border-bottom: 0;
}

#cl-shopping-point-list-page .cl-source-points-filter-label {
  flex: 0 0 74px;
  width: 74px;
  padding-top: 8px;
  color: var(--cl-text);
  font-size: 13.5px;
  font-weight: 700;
  line-height: 18px;
}

#cl-shopping-point-list-page .cl-source-points-filter-controls {
  display: flex;
  align-items: center;
  flex: 1 1 0;
  flex-wrap: wrap;
  gap: 8px;
  min-width: 0;
}

#cl-shopping-point-list-page .cl-source-points-result-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
  width: 100%;
  margin: 0 0 14px;
}

#cl-shopping-point-list-page .cl-source-points-result-title {
  color: var(--cl-text);
  font-size: 15px;
  font-weight: 800;
  line-height: 20px;
}

#cl-shopping-point-list-page .point-reg-box {
  display: inline-grid;
  grid-template-columns: repeat(4, minmax(64px, 1fr));
  align-items: center;
  max-width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  margin: 0 !important;
  padding: 0 !important;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: var(--cl-radius-sm);
}

#cl-shopping-point-list-page .point-reg {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  min-width: 58px;
  height: 34px;
  margin: 0 !important;
  padding: 0 14px !important;
  background: #fff !important;
  border: 0 !important;
  border-left: 1px solid var(--cl-border) !important;
  border-radius: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px;
  font-weight: 600;
  line-height: 32px;
  white-space: nowrap;
  word-break: keep-all;
  cursor: pointer;
}

#cl-shopping-point-list-page .point-reg:first-of-type {
  border-left: 0 !important;
}

#cl-shopping-point-list-page .point-reg:hover {
  background: #f1fbf5 !important;
  color: var(--cl-green-text) !important;
}

#cl-shopping-point-list-page .point-reg.active {
  background: #e4f7ec !important;
  color: var(--cl-green-text) !important;
  font-weight: 700;
}

#cl-shopping-point-list-page .point-search-date {
  display: inline-flex;
  align-items: center;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

#cl-shopping-point-list-page .change-date-box {
  position: relative;
  display: inline-flex;
  align-items: center;
  height: 35px;
  margin: 0 !important;
  padding: 0;
  color: var(--cl-text-sub);
  font-size: 13px;
}

#cl-shopping-point-list-page .cl-source-points-date-trigger {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  gap: 8px;
  width: auto;
  min-width: 210px;
  height: 35px !important;
  margin: 0 !important;
  padding: 0 12px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: var(--cl-radius-sm) !important;
  box-shadow: none !important;
  color: var(--cl-text);
  font-size: 13px;
  font-weight: 400;
  line-height: 33px;
  text-align: left;
  cursor: pointer;
}

#cl-shopping-point-list-page .cl-source-points-date-trigger:hover,
#cl-shopping-point-list-page .cl-source-points-date-trigger:focus,
#cl-shopping-point-list-page .cl-source-points-date-range.is-open .cl-source-points-date-trigger {
  background: #f1fbf5 !important;
  border-color: #b7e7c9 !important;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .12) !important;
  outline: 0;
}

#cl-shopping-point-list-page .cl-source-points-date-icon {
  flex: 0 0 auto;
  width: 14px;
  height: 14px;
  background: var(--cl-text-muted);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2'/%3E%3Cpath d='M16 2v4M8 2v4M3 10h18'/%3E%3C/svg%3E") center / 14px 14px no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2'/%3E%3Cpath d='M16 2v4M8 2v4M3 10h18'/%3E%3C/svg%3E") center / 14px 14px no-repeat;
}

#cl-shopping-point-list-page .cl-source-points-date-label {
  display: block;
  flex: 0 0 auto;
  color: var(--cl-text);
  white-space: nowrap;
}

#cl-shopping-point-list-page .cl-source-points-date-source {
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  display: block;
  width: 100% !important;
  height: 35px !important;
  margin: 0 !important;
  padding: 0 !important;
  opacity: 0;
  pointer-events: none;
}

#cl-shopping-point-list-page .change-date-box > .uis-datepicker-mini {
  top: 43px !important;
  left: 0 !important;
  width: 286px !important;
  padding: 14px 12px 16px !important;
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 12px;
  box-shadow: 0 12px 30px rgba(20, 24, 32, .16);
  z-index: 10010;
}

#cl-shopping-point-list-page .change-date-box > .uis-datepicker-mini .ui-datepicker-selectduration {
  display: none !important;
}

#cl-shopping-point-list-page .change-date-box > .uis-datepicker-mini .ui-datepicker {
  margin: 0;
}

#cl-shopping-point-list-page .change-date-box > .uis-datepicker-mini .ui-datepicker-header {
  height: 30px;
  padding: 0 34px 12px;
}

#cl-shopping-point-list-page .change-date-box > .uis-datepicker-mini .ui-datepicker-prev-year,
#cl-shopping-point-list-page .change-date-box > .uis-datepicker-mini .ui-datepicker-next-year {
  display: none !important;
}

#cl-shopping-point-list-page .change-date-box > .uis-datepicker-mini .ui-datepicker-prev,
#cl-shopping-point-list-page .change-date-box > .uis-datepicker-mini .ui-datepicker-next {
  top: 0;
  width: 28px;
  height: 28px;
  line-height: 28px;
}

#cl-shopping-point-list-page .change-date-box > .uis-datepicker-mini .ui-datepicker-prev {
  left: 0;
}

#cl-shopping-point-list-page .change-date-box > .uis-datepicker-mini .ui-datepicker-next {
  right: 0;
}

#cl-shopping-point-list-page .change-date-box > .uis-datepicker-mini .ui-datepicker-header .ui-datepicker-title span {
  color: var(--cl-text);
  font-size: 14px;
  font-weight: 800;
  line-height: 28px;
}

#cl-shopping-point-list-page .change-date-box > .uis-datepicker-mini .ui-datepicker-calendar {
  width: 100%;
  margin: 0;
  border-spacing: 0;
}

#cl-shopping-point-list-page .change-date-box > .uis-datepicker-mini .ui-datepicker-calendar tbody tr {
  height: 32px;
}

#cl-shopping-point-list-page .change-date-box > .uis-datepicker-mini .ui-datepicker-calendar thead tr th span {
  width: 32px;
  padding-bottom: 6px;
  color: var(--cl-text-muted);
  font-size: 12px;
  font-weight: 700;
}

#cl-shopping-point-list-page .change-date-box > .uis-datepicker-mini .ui-datepicker-calendar thead tr th .Sunday {
  color: #ef4444;
}

#cl-shopping-point-list-page .change-date-box > .uis-datepicker-mini .ui-datepicker-calendar thead tr th .Saturday {
  color: #2563eb;
}

#cl-shopping-point-list-page .change-date-box > .uis-datepicker-mini .ui-datepicker-calendar tbody tr td a,
#cl-shopping-point-list-page .change-date-box > .uis-datepicker-mini .ui-datepicker-calendar tbody tr td span {
  width: 28px !important;
  height: 28px !important;
  line-height: 28px !important;
  color: var(--cl-text);
  font-size: 13px;
  font-weight: 500;
}

#cl-shopping-point-list-page .change-date-box > .uis-datepicker-mini .ui-datepicker-calendar tbody tr td.ui-datepicker-today:not(.dp-highlight) a {
  background: #eef2f6;
  border-radius: 50%;
  color: var(--cl-text);
}

#cl-shopping-point-list-page .change-date-box > .uis-datepicker-mini .dp-highlight .ui-state-default {
  width: 28px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  background-color: var(--cl-green) !important;
  border-radius: 50% !important;
  color: #fff !important;
  font-weight: 700;
}

#cl-shopping-point-list-page .change-date-box > .uis-datepicker-mini .dp-highlight.pd-between::before,
#cl-shopping-point-list-page .change-date-box > .uis-datepicker-mini .dp-highlight.dp-first::before,
#cl-shopping-point-list-page .change-date-box > .uis-datepicker-mini .dp-highlight.dp-end::before {
  top: 2px;
  height: 28px;
  background: #dff6e8 !important;
}

#cl-shopping-point-list-page .change-date-box > .uis-datepicker-mini .dp-highlight.pd-between .ui-state-default {
  width: 100% !important;
  background: transparent !important;
  border-radius: 0 !important;
  color: var(--cl-green-text) !important;
}

#cl-shopping-point-list-page .change-date-box > .uis-datepicker-mini .dp-highlight.dp-first::before {
  left: 50%;
  width: 50%;
}

#cl-shopping-point-list-page .change-date-box > .uis-datepicker-mini .dp-highlight.dp-end::before {
  left: 0;
  width: 50%;
}

#cl-shopping-point-list-page .change-date-box > .uis-datepicker-mini .dp-first.dp-highlight.dp-end::before,
#cl-shopping-point-list-page .change-date-box > .uis-datepicker-mini .dp-highlight.dp-first .ui-state-default::after,
#cl-shopping-point-list-page .change-date-box > .uis-datepicker-mini .dp-highlight.dp-end .ui-state-default::after {
  display: none !important;
}

:is(#cl-shopping-point-list-page, #cl-shopping-point-member-page) .point-search-text {
  position: relative;
  display: inline-flex;
  align-items: center;
  width: 260px !important;
  height: 35px;
  margin: 0 !important;
  padding: 0 !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: var(--cl-radius-sm) !important;
}

:is(#cl-shopping-point-list-page, #cl-shopping-point-member-page) .point-search-text input {
  width: 100% !important;
  height: 33px !important;
  margin: 0 !important;
  padding: 0 34px 0 12px !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--cl-text);
  font-size: 13px;
  font-weight: 400;
  line-height: 33px;
  outline: 0;
}

:is(#cl-shopping-point-list-page, #cl-shopping-point-member-page) .point-search-text input::placeholder {
  color: var(--cl-text-muted);
}

:is(#cl-shopping-point-list-page, #cl-shopping-point-member-page) .point-search-text .search-btn {
  position: absolute;
  top: 50%;
  right: 12px;
  width: 14px;
  height: 14px;
  margin: 0;
  fill: var(--cl-text-muted);
  cursor: pointer;
  transform: translateY(-50%);
}

#cl-shopping-point-list-page .point-search-text {
  width: 220px !important;
}

:is(#cl-shopping-point-list-page, #cl-shopping-point-member-page) .point-select-options {
  display: inline-flex !important;
  align-items: center;
  gap: 8px;
  width: auto !important;
  margin: 0 0 0 auto !important;
  padding: 0 !important;
}

:is(#cl-shopping-point-list-page, #cl-shopping-point-member-page) .point-select-box {
  display: inline-flex;
  align-items: center;
  width: auto !important;
  min-width: 0 !important;
  margin: 0 !important;
}

:is(#cl-shopping-point-list-page, #cl-shopping-point-member-page) .point-select-box select.cl-redesign-select-source {
  position: absolute;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden;
  opacity: 0;
  pointer-events: none;
}

:is(#cl-shopping-point-list-page, #cl-shopping-point-member-page) .point-select-box .cl-point-result-select {
  min-width: 104px;
}

:is(#cl-shopping-point-list-page, #cl-shopping-point-member-page) .point-select-box .cl-point-result-select .cl-redesign-select-trigger {
  width: 104px;
  min-width: 104px;
  height: 35px;
  padding: 0 10px 0 12px;
  color: var(--cl-text);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 33px;
}

:is(#cl-shopping-point-list-page, #cl-shopping-point-member-page) .point-select-box .cl-point-result-select .cl-redesign-select-menu {
  z-index: 10020;
  width: 104px;
}

:is(#cl-shopping-point-list-page, #cl-shopping-point-member-page) .point-select-box .cl-point-result-select .cl-redesign-select-menu li {
  font-size: 13px;
}

#cl-shopping-point-member-page .point-select-box .cl-point-result-select--sort,
#cl-shopping-point-member-page .point-select-box .cl-point-result-select--sort .cl-redesign-select-trigger,
#cl-shopping-point-member-page .point-select-box .cl-point-result-select--sort .cl-redesign-select-menu {
  width: 128px;
  min-width: 128px;
}

#cl-shopping-point-member-page .point-select-box .cl-point-result-select--limit,
#cl-shopping-point-member-page .point-select-box .cl-point-result-select--limit .cl-redesign-select-trigger,
#cl-shopping-point-member-page .point-select-box .cl-point-result-select--limit .cl-redesign-select-menu {
  width: 104px;
  min-width: 104px;
}

#cl-shopping-point-member-page .point-member-box {
  gap: 8px;
  justify-content: flex-end;
  margin-bottom: 16px !important;
}

#cl-shopping-point-member-page .point-search-text {
  min-width: 230px;
  height: 40px;
}

#cl-shopping-point-member-page .point-search-text input {
  height: 38px !important;
  line-height: 38px;
}

#cl-shopping-point-member-page .point-search-text .search-btn {
  width: 15px;
  height: 15px;
}

#cl-shopping-point-member-page .point-select-options {
  margin-left: 0 !important;
}

#cl-shopping-point-member-page .point-select-box .cl-point-result-select .cl-redesign-select-trigger {
  height: 40px;
  line-height: 38px;
}

#cl-shopping-point-member-page .cl-source-points-grant-button {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-width: 148px;
  height: 40px;
  margin: 0 auto 0 0 !important;
  padding: 0 16px !important;
  background: #fff !important;
  border: 1px solid var(--cl-green) !important;
  border-radius: 8px !important;
  color: var(--cl-green-text) !important;
  font-size: 13.5px;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
  transition: background-color .12s, border-color .12s, color .12s;
}

#cl-shopping-point-member-page .cl-source-points-grant-button:hover {
  background: #f1fbf5 !important;
}

#cl-shopping-point-member-page .cl-source-points-grant-button.disabled {
  border-color: var(--cl-border) !important;
  color: var(--cl-text-sub) !important;
  cursor: default;
  opacity: .72;
}

#cl-shopping-point-member-page .cl-source-points-grant-button svg {
  width: 17px;
  height: 17px;
  flex: none;
  fill: currentColor;
}

:is(#cl-shopping-point-list-page, #cl-shopping-point-member-page) .cl-source-points-table-section,
:is(#cl-shopping-point-list-page, #cl-shopping-point-member-page) .mng-wrap,
:is(#cl-shopping-point-list-page, #cl-shopping-point-member-page) .table-wrap {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

:is(#cl-shopping-point-list-page, #cl-shopping-point-member-page) .table-container {
  width: 100% !important;
  margin: 0 !important;
  overflow-x: auto;
  overflow-y: hidden;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 10px;
  box-shadow: none;
}

#cl-shopping-point-list-page .table-container,
#cl-shopping-point-member-page .table-container {
  background: transparent;
  border: 0;
  border-radius: 0;
}

:is(#cl-shopping-point-list-page, #cl-shopping-point-member-page) .cl-source-points-table {
  width: 100%;
  min-width: 1000px;
  margin: 0 !important;
  background: #fff;
  border: 0 !important;
  border-collapse: collapse;
  border-spacing: 0;
  table-layout: fixed;
}

#cl-shopping-point-list-page .cl-source-points-table {
  min-width: 1000px;
  table-layout: auto;
}

#cl-shopping-point-member-page .cl-source-points-table {
  min-width: 820px;
}

:is(#cl-shopping-point-list-page, #cl-shopping-point-member-page) .cl-source-points-table th,
:is(#cl-shopping-point-list-page, #cl-shopping-point-member-page) .cl-source-points-table td {
  height: auto;
  padding: 12px 10px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--cl-border) !important;
  font-size: 13.5px;
  line-height: 18px;
  text-align: center;
  vertical-align: middle;
  white-space: nowrap;
}

:is(#cl-shopping-point-list-page, #cl-shopping-point-member-page) .cl-source-points-table th {
  background: #fafbfc !important;
  color: var(--cl-text-sub) !important;
  font-size: 12.5px;
  font-weight: 600;
}

#cl-shopping-point-list-page .cl-source-points-table th {
  background: #f7f8fa !important;
  border-top: 1px solid var(--cl-border) !important;
}

#cl-shopping-point-member-page .cl-source-points-table th {
  border-top: 1px solid var(--cl-border) !important;
}

:is(#cl-shopping-point-list-page, #cl-shopping-point-member-page) .cl-source-points-table td {
  overflow: hidden;
  background: #fff !important;
  color: var(--cl-text) !important;
  font-weight: 400;
  text-overflow: ellipsis;
}

#cl-shopping-point-list-page .cl-source-points-table td {
  font-size: 13px;
  overflow: visible;
  text-overflow: clip;
}

:is(#cl-shopping-point-list-page, #cl-shopping-point-member-page) .cl-source-points-table tbody tr:hover td {
  background: #fafbfc !important;
}

#cl-shopping-point-list-page .cl-source-points-table tbody tr:not(.listZero) td:first-child {
  color: var(--cl-text) !important;
  font-weight: 400;
}

#cl-shopping-point-list-page .cl-source-points-table td:nth-child(3),
#cl-shopping-point-list-page .cl-source-points-table th:nth-child(3),
#cl-shopping-point-list-page .cl-source-points-table td:nth-child(5),
#cl-shopping-point-list-page .cl-source-points-table th:nth-child(5),
#cl-shopping-point-member-page .cl-source-points-table td:nth-child(2),
#cl-shopping-point-member-page .cl-source-points-table th:nth-child(2) {
  text-align: left;
}

:is(#cl-shopping-point-list-page, #cl-shopping-point-member-page) .cl-source-points-table .hand {
  color: var(--cl-green-text);
  font-weight: 600;
}

:is(#cl-shopping-point-list-page, #cl-shopping-point-member-page) .point-blue,
:is(#cl-shopping-point-list-page, #cl-shopping-point-member-page) .pt-plus {
  color: var(--cl-green-text) !important;
  font-weight: 700;
}

:is(#cl-shopping-point-list-page, #cl-shopping-point-member-page) .point-red {
  color: var(--cl-danger) !important;
  font-weight: 700;
}

:is(#cl-shopping-point-list-page, #cl-shopping-point-member-page) .point-gray {
  color: var(--cl-text-sub) !important;
}

:is(#cl-shopping-point-list-page, #cl-shopping-point-member-page) .cl-source-points-table tr.listZero td {
  height: 180px;
  color: var(--cl-text-muted) !important;
  font-size: 13.5px;
  font-weight: 400;
  text-align: center !important;
}

:is(#cl-shopping-point-list-page, #cl-shopping-point-member-page) .newcheckbox input[type="checkbox"] {
  width: 16px;
  height: 16px;
  margin: 0;
  accent-color: var(--cl-green);
  vertical-align: middle;
  cursor: pointer;
}

:is(#cl-shopping-point-list-page, #cl-shopping-point-member-page) .newcheckbox svg.active path {
  fill: var(--cl-green);
}

:is(#cl-shopping-point-list-page, #cl-shopping-point-member-page) .paging {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  width: 100%;
  margin: 18px 0 0 !important;
  padding: 0 !important;
  background: transparent;
  border-top: 0 !important;
  color: var(--cl-text-sub);
  font-size: 13px;
  font-weight: 400;
}

:is(#cl-shopping-point-list-page, #cl-shopping-point-member-page) .paging a,
:is(#cl-shopping-point-list-page, #cl-shopping-point-member-page) .paging button,
:is(#cl-shopping-point-list-page, #cl-shopping-point-member-page) .paging span,
:is(#cl-shopping-point-list-page, #cl-shopping-point-member-page) .paging strong {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 30px;
  width: auto;
  height: 30px;
  margin: 0;
  padding: 0 8px;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 6px;
  color: var(--cl-text-muted);
  font-size: 13px;
  font-weight: 400;
  line-height: 28px;
  text-decoration: none;
  transition: background-color .12s, border-color .12s, color .12s;
}

:is(#cl-shopping-point-list-page, #cl-shopping-point-member-page) .paging a:hover,
:is(#cl-shopping-point-list-page, #cl-shopping-point-member-page) .paging button:not(:disabled):hover {
  background: #f1fbf5;
  color: var(--cl-green-text);
}

:is(#cl-shopping-point-list-page, #cl-shopping-point-member-page) .paging strong,
:is(#cl-shopping-point-list-page, #cl-shopping-point-member-page) .paging .active {
  background: #e4f7ec;
  border-color: var(--cl-green);
  color: var(--cl-green-text);
  font-weight: 800;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.cl-point-info {
  width: 430px !important;
  max-width: min(94vw, 430px) !important;
  margin: 8vh auto 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.cl-point-info .modal-content {
  box-sizing: border-box;
  overflow: hidden !important;
  padding: 32px 34px 28px !important;
  background: #fff !important;
  border: 0 !important;
  border-radius: 14px !important;
  box-shadow: 0 24px 64px rgba(0, 0, 0, .28) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.cl-point-info .modal-content .modal-body {
  width: 400px !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.cl-point-info .modal-title {
  margin: 0 0 24px !important;
  color: var(--cl-text) !important;
  font-size: 20px !important;
  font-weight: 800 !important;
  line-height: 26px !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.cl-point-info .cl-s-btn-group-toggle {
  display: flex;
  gap: 8px;
  width: 100%;
  max-width: 100%;
  margin: 0 auto 18px !important;
  overflow: visible;
  border: 0;
  border-radius: 0;
}

:is(body.cl-dashboard-redesign-page, body#css-form.cl-dashboard-redesign-page) .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.cl-point-info .btn.btn-secondary {
  flex: 1 1 0;
  width: auto;
  min-width: 0;
  height: 43px;
  margin: 0 !important;
  padding: 0 !important;
  background: #fff;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub);
  font-size: 14px;
  font-weight: 700;
  line-height: 41px;
  text-align: center;
}

:is(body.cl-dashboard-redesign-page, body#css-form.cl-dashboard-redesign-page) .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.cl-point-info .btn.btn-secondary.active {
  background: #e4f7ec;
  border-color: var(--cl-green) !important;
  color: var(--cl-green-text);
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.cl-point-info form[name="d_process"] {
  width: 100%;
  max-width: 100%;
  margin: 0 auto !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.cl-point-info .point-modal-field {
  float: none !important;
  width: 100% !important;
  height: 42px;
  margin: 0 0 12px !important;
  overflow: hidden;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.cl-point-info .point-modal-field .cl-common-form-group {
  float: none !important;
  height: 100%;
  padding: 0 !important;
  background: #fff !important;
  border: 0 !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.cl-point-info .point-modal-field .cl-common-form-control {
  height: 40px;
  padding: 0 14px !important;
  color: var(--cl-text);
  font-size: 14px;
  line-height: 40px;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.cl-point-info .point-modal-field .cl-common-form-control::placeholder {
  color: var(--cl-text-muted);
  opacity: 1;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.cl-point-info .point-modal-note {
  margin: 10px 0 4px !important;
  color: var(--cl-text-sub);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 1.7;
  text-align: center;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.cl-point-info .point-modal-note b {
  color: var(--cl-green-text);
  font-weight: 800;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.cl-point-info.point-plus-add #point-span {
  color: inherit !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.cl-point-info.point-minus-add .point-modal-note b {
  color: var(--cl-danger);
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.cl-point-info #minus-desc {
  margin-top: 12px;
  padding-left: 18px;
  color: var(--cl-text-sub);
  font-size: 12.5px;
  line-height: 18px;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.cl-point-info #minus-desc svg {
  margin: 2px 0 0 -18px;
  fill: var(--cl-text-sub);
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.cl-point-info .point-modal-actions {
  clear: both;
  display: flex;
  flex-direction: column;
  gap: 14px;
  width: 100%;
  margin: 16px 0 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.cl-point-info .popup-primary-btn {
  display: flex !important;
  align-items: center;
  justify-content: center;
  float: none !important;
  width: 100% !important;
  height: 49px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  background: var(--cl-green) !important;
  border: 1px solid var(--cl-green) !important;
  border-radius: 8px !important;
  box-sizing: border-box;
  color: #fff !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.cl-point-info .popup-primary-btn:hover {
  background: var(--cl-green-hover) !important;
  border-color: var(--cl-green-hover) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.cl-point-info .cancel-btn {
  display: flex !important;
  align-items: center;
  justify-content: center;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 11px !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 9px !important;
  box-sizing: border-box;
  box-shadow: none !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  line-height: 18px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.cl-point-info .cancel-btn:hover {
  background: var(--cl-green-soft) !important;
  color: var(--cl-green-text) !important;
}

@media (max-width: 1024px) {
  :is(#cl-shopping-point-list-page, #cl-shopping-point-member-page) .cl-source-points-filter {
    justify-content: flex-start;
  }

  :is(#cl-shopping-point-list-page, #cl-shopping-point-member-page) .point-select-options {
    margin-left: 0 !important;
  }
}

@media (max-width: 900px) {
  #cl-shopping-point-setting-page {
    margin-left: var(--cl-source-app-gutter) !important;
  }
}

@media (max-width: 768px) {
  :is(#cl-shopping-point-setting-page, #cl-shopping-point-list-page, #cl-shopping-point-member-page) {
    margin-left: var(--cl-source-app-gutter) !important;
    padding: 20px 16px 40px !important;
  }

  #cl-shopping-point-setting-page .cl-source-points-form .setting-subInfoBox {
    display: block;
  }

  #cl-shopping-point-setting-page .cl-source-points-form .setting-sub-title {
    width: auto;
    margin-bottom: 12px;
  }

  #cl-shopping-point-setting-page .cl-source-points-form .setting-subInfoBox:first-child .setting-sub-title {
    margin-top: 0 !important;
  }

  :is(#cl-shopping-point-list-page, #cl-shopping-point-member-page) .cl-source-points-card,
  #cl-shopping-point-setting-page .cl-source-points-card {
    padding: 0 16px 22px !important;
  }

  :is(#cl-shopping-point-setting-page, #cl-shopping-point-list-page, #cl-shopping-point-member-page) .submenu_navWrap {
    width: calc(100% + 32px) !important;
    margin-right: -16px !important;
    margin-left: -16px !important;
  }

  :is(#cl-shopping-point-setting-page, #cl-shopping-point-list-page, #cl-shopping-point-member-page) .submenu_navWrap .submenu_nav {
    padding-right: 18px !important;
    padding-left: 18px !important;
  }

  :is(#cl-shopping-point-list-page, #cl-shopping-point-member-page) .point-search-text {
    width: 100% !important;
  }

  #cl-shopping-point-list-page .cl-source-points-filter {
    padding-right: 14px !important;
    padding-left: 14px !important;
  }

  #cl-shopping-point-list-page .cl-source-points-filter-row {
    flex-direction: column;
    gap: 8px;
  }

  #cl-shopping-point-list-page .cl-source-points-filter-label {
    flex: none;
    width: auto;
    padding-top: 0;
  }

  #cl-shopping-point-list-page .cl-source-points-filter-controls {
    flex: none;
    width: 100%;
  }

  #cl-shopping-point-list-page .point-search-date,
  #cl-shopping-point-list-page .change-date-box {
    width: 100% !important;
  }

  #cl-shopping-point-list-page .cl-source-points-date-trigger {
    width: 100%;
  }

  #cl-shopping-point-member-page .cl-source-points-grant-button {
    margin-right: 0 !important;
  }
}

/* Shopping coupon pages */
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) {
  width: auto !important;
  max-width: none !important;
  margin-top: 0 !important;
  margin-right: var(--cl-source-app-gutter) !important;
  margin-left: calc(var(--cl-source-app-gutter) + var(--cl-source-sidebar-w)) !important;
  padding: 28px 32px 60px !important;
  background: transparent !important;
  color: var(--cl-text);
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page),
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) * {
  box-sizing: border-box;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .dashbottom-container,
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .shopping-dashboard,
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .col-md-10 {
  display: block !important;
  float: none !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) #section-top-menu,
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .mobile-title {
  display: none !important;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .cl-source-coupon-head {
  margin: 0 0 20px;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .cl-source-coupon-breadcrumb {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  color: var(--cl-text);
  font-size: 20px;
  font-weight: 700;
  line-height: 1.35;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .cl-source-coupon-breadcrumb .sep {
  color: var(--cl-text-muted);
  font-size: 23px;
  font-weight: 400;
  line-height: 1;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .cl-source-coupon-breadcrumb .current {
  color: var(--cl-text-sub);
  font-weight: 700;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .cl-source-coupon-desc {
  margin: 10px 0 0;
  color: var(--cl-text-sub);
  font-size: 13px;
  font-weight: 400;
  line-height: 1.45;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .cl-source-coupon-content {
  float: none !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .cl-source-coupon-card {
  width: 100% !important;
  margin: 0 !important;
  padding: 20px 24px 26px !important;
  overflow: visible !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: var(--cl-radius-lg) !important;
  box-shadow: var(--cl-shadow-panel) !important;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .submenu_navWrap {
  position: static !important;
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  margin: 0 0 26px !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .submenu_navWrap .submenu_nav {
  display: flex !important;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 2px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid var(--cl-border) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .submenu_navWrap .submenu_nav ul {
  display: flex !important;
  flex: none;
  align-items: center;
  gap: 28px;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  list-style: none;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .submenu_navWrap .submenu_nav li {
  flex: none;
  float: none !important;
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .submenu_navWrap .submenu_nav li + li {
  border-left: 0 !important;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .submenu_navWrap .submenu_nav .sub-menu {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  height: auto !important;
  min-width: 0;
  margin: 0 !important;
  padding: 14px 2px !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 2px solid transparent !important;
  border-radius: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 14.5px !important;
  font-weight: 600 !important;
  line-height: 20px !important;
  text-decoration: none !important;
  white-space: nowrap;
  transform: translateY(1px);
  transition: color .12s, border-color .12s;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .submenu_navWrap .submenu_nav .sub-menu:hover {
  color: var(--cl-text) !important;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .submenu_navWrap .submenu_nav .sub-menu.active {
  border-bottom-color: var(--cl-green) !important;
  color: var(--cl-green-text) !important;
  font-weight: 700 !important;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .coupon-setting-box,
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .coupon-history-list,
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .coupon-manage-list,
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .coupon-setting-list {
  float: none !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

#cl-shopping-coupon-setting-page .cl-source-coupon-pagehead {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
  width: 100%;
  margin: 0 0 22px;
}

#cl-shopping-coupon-setting-page .cl-source-coupon-pagehead-desc {
  margin: 0;
  color: var(--cl-text-sub);
  font-size: 13px;
  font-weight: 400;
  line-height: 1.45;
}

#cl-shopping-coupon-setting-page .cl-source-coupon-add {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  gap: 7px;
  width: auto !important;
  min-width: 0 !important;
  height: 40px !important;
  margin: 0 !important;
  padding: 0 20px !important;
  background: var(--cl-green-action) !important;
  border: 1px solid var(--cl-green-action) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 18px !important;
  text-align: center;
  cursor: pointer;
}

#cl-shopping-coupon-setting-page .cl-source-coupon-add svg {
  flex: 0 0 16px;
  width: 16px;
  height: 16px;
}

#cl-shopping-coupon-setting-page .cl-source-coupon-add:hover {
  background: var(--cl-green-hover) !important;
  border-color: var(--cl-green-hover) !important;
}

#cl-shopping-coupon-setting-page .cl-source-coupon-add:focus-visible {
  outline: 0;
  border-color: var(--cl-green-action) !important;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .13) !important;
}

#cl-shopping-coupon-setting-page .cl-source-coupon-add.disabled {
  background: var(--cl-bg-3) !important;
  border-color: var(--cl-border) !important;
  color: var(--cl-text-muted) !important;
  cursor: default;
  pointer-events: none;
}

#cl-shopping-coupon-setting-page .coupon-setting-desc-box {
  position: relative;
  display: block !important;
  width: 100% !important;
  min-height: 0 !important;
  margin: 0 0 24px !important;
  padding: 0 !important;
  background: var(--cl-surface) !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  overflow: hidden;
  transition: background-color .12s, border-color .12s, box-shadow .12s;
}

#cl-shopping-coupon-setting-page .cl-source-coupon-guide-toggle {
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 44px;
  margin: 0;
  padding: 0 14px 0 16px;
  background: transparent;
  border: 0;
  color: var(--cl-text);
  font: inherit;
  text-align: left;
  cursor: pointer;
  transition: background-color .12s, color .12s;
}

#cl-shopping-coupon-setting-page .cl-source-coupon-guide-toggle:hover {
  background: var(--cl-green-tint);
}

#cl-shopping-coupon-setting-page .cl-source-coupon-guide-toggle:focus-visible {
  outline: 0;
  box-shadow: inset 0 0 0 2px var(--cl-green-action);
}

#cl-shopping-coupon-setting-page .cl-source-coupon-guide-title-wrap {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

#cl-shopping-coupon-setting-page .cl-source-coupon-guide-icon {
  flex: 0 0 14px;
  width: 14px;
  height: 14px;
  color: var(--cl-green);
}

#cl-shopping-coupon-setting-page .cl-source-coupon-guide-title {
  color: var(--cl-text);
  font-size: 13.5px;
  font-weight: 700;
  line-height: 20px;
  white-space: nowrap;
}

#cl-shopping-coupon-setting-page .cl-source-coupon-guide-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 18px;
  height: 18px;
  padding: 0 6px;
  background: var(--cl-green-badge);
  border-radius: 999px;
  color: var(--cl-green-text);
  font-size: 11px;
  font-weight: 800;
  line-height: 18px;
}

#cl-shopping-coupon-setting-page .cl-source-coupon-guide-action {
  display: none !important;
}

#cl-shopping-coupon-setting-page .cl-source-coupon-guide-chevron {
  flex: 0 0 16px;
  width: 16px;
  height: 16px;
  margin-left: auto;
  color: var(--cl-text-sub);
  transition: transform .14s;
}

#cl-shopping-coupon-setting-page .coupon-setting-desc-box.is-open .cl-source-coupon-guide-chevron {
  transform: rotate(180deg);
}

#cl-shopping-coupon-setting-page .coupon-setting-desc-box.is-open {
  background: var(--green-soft, #f1fbf5) !important;
  border-color: var(--green-line, #b7e7c9) !important;
  box-shadow: inset 0 0 0 1px var(--green-line, #b7e7c9) !important;
}

#cl-shopping-coupon-setting-page .coupon-setting-desc-box .left-box {
  float: none !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 4px 18px 16px 16px !important;
}

#cl-shopping-coupon-setting-page .coupon-setting-desc-box .left-box[hidden] {
  display: none !important;
}

#cl-shopping-coupon-setting-page .coupon-setting-desc-box ul {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none;
}

#cl-shopping-coupon-setting-page .coupon-setting-desc-box li {
  position: relative;
  margin: 0 !important;
  padding: 0 0 0 13px !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 2 !important;
}

#cl-shopping-coupon-setting-page .coupon-setting-desc-box li::before {
  content: "-";
  position: absolute;
  top: 0;
  left: 0;
  color: var(--cl-text-muted);
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-coupon-workflow-wrap {
  position: fixed !important;
  inset: 0 !important;
  z-index: var(--cl-coupon-modal-z, 1000000) !important;
}

body.cl-dashboard-redesign-page .cl-source-coupon-workflow-wrap .modal-default > .cl-mobile-btn.close {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-cmmodal.coupon-add-modal) {
  position: fixed !important;
  inset: 0 !important;
  z-index: var(--cl-coupon-modal-z, 999999) !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
  width: 100vw !important;
  height: 100vh !important;
  padding: 6vh 16px 40px !important;
  overflow: auto !important;
  background: rgba(0, 0, 0, .45) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-cmmodal.coupon-add-modal) + .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-cmmodal.coupon-add-modal) + .modal-backdrop.fade,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-cmmodal.coupon-add-modal) + .modal-backdrop.in {
  display: none !important;
  opacity: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default:has(.modal-dialog.cl-cmmodal.coupon-add-modal) {
  position: static !important;
  inset: auto !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
  width: 100% !important;
  height: auto !important;
  min-height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal {
  width: 600px !important;
  max-width: calc(100vw - 32px) !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal .modal-content {
  position: relative;
  width: 100%;
  height: auto !important;
  min-height: 0 !important;
  padding: 36px 40px 30px !important;
  overflow: visible !important;
  background: #fff !important;
  border: 0 !important;
  border-radius: 14px !important;
  box-shadow: 0 24px 64px rgba(0, 0, 0, .28) !important;
  word-break: keep-all !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal .modal-content button.close {
  position: absolute !important;
  top: 20px !important;
  right: 22px !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px !important;
  color: var(--cl-text-sub) !important;
  opacity: 1 !important;
  transition: color .15s, background .15s, transform .18s cubic-bezier(.34, 1.56, .64, 1);
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal .modal-content button.close:hover {
  background: #f1f2f5 !important;
  color: var(--cl-text) !important;
  transform: rotate(90deg);
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal .modal-content button.close svg {
  display: block;
  width: 15px !important;
  height: 15px !important;
  fill: currentColor !important;
  stroke: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal .modal-content .modal-body {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal .modal-content .modal-title {
  margin: 0 0 28px !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-size: 22px !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm {
  width: 100%;
  margin: 0;
  padding: 0;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .item-row {
  display: flex !important;
  align-items: flex-start;
  flex-wrap: nowrap !important;
  gap: 20px;
  width: 100%;
  margin: 0 !important;
  padding: 20px 0 !important;
  border-bottom: 1px solid #f0f1f4;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .item-row:first-child {
  padding-top: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .item-row:last-child {
  border-bottom: 0;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .item-row:has(.coupon-kind-box),
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .item-row:has(.coupon-autotarget-box),
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .item-row:has(.coupon-duplicate-row) {
  align-items: center;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .item-title {
  display: inline-flex;
  align-items: center;
  flex: 0 0 150px !important;
  gap: 5px;
  width: 150px !important;
  padding-top: 9px !important;
  color: var(--cl-text) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 20px !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .item-row:has(.coupon-kind-box) .item-title,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .item-row:has(.coupon-autotarget-box) .item-title,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .item-row:has(.coupon-duplicate-row) .item-title {
  padding-top: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .item-title svg.cm-popover-info {
  position: static !important;
  flex: 0 0 auto;
  width: 13px !important;
  height: 13px !important;
  margin: 0 !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .item-title svg.cm-popover-info :is(path, rect, circle) {
  fill: var(--cl-green) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .item-row > :not(.item-title) {
  flex: 1 1 0;
  min-width: 0;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .item-title + div {
  display: block;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .cl-common-form-wrap,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .cl-common-form-group,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .common-selectbox {
  float: none !important;
  width: 100% !important;
  max-width: none !important;
  height: 44px !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .cl-common-form-wrap {
  display: block;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  -webkit-box-shadow: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .cl-common-form-group {
  display: flex !important;
  align-items: center;
  padding: 0 !important;
  overflow: hidden;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  -webkit-box-shadow: none !important;
  background-clip: padding-box !important;
  float: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .cl-common-form-group:focus-within {
  border-color: var(--cl-green) !important;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .13) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .cl-common-form-group input {
  appearance: none !important;
  -webkit-appearance: none !important;
  width: 100% !important;
  height: 42px !important;
  margin: 0 !important;
  padding: 0 13px !important;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  -webkit-box-shadow: none !important;
  color: var(--cl-text) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 42px !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm input.price,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm input[numberonly] {
  text-align: left !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .common-selectbox {
  position: relative;
  display: block !important;
  background: transparent !important;
  border: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .benefit-box > .benefit-selectbox > .common-selectbox,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .common-selectbox.benefit-selectbox {
  flex: 0 0 200px !important;
  width: 200px !important;
  max-width: 200px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .common-selectbox > .bootstrap-select {
  width: 100% !important;
  height: 44px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .common-selectbox > .bootstrap-select .btn.btn-default {
  display: flex !important;
  align-items: center;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: 44px !important;
  padding: 0 34px 0 13px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 42px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .common-selectbox > .bootstrap-select.open .btn.btn-default,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .common-selectbox > .bootstrap-select .btn.btn-default:focus {
  border-color: var(--cl-green) !important;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .13) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .common-selectbox > svg {
  position: absolute !important;
  top: 50% !important;
  right: 12px !important;
  left: auto !important;
  width: 8px !important;
  height: 4px !important;
  margin: 0 !important;
  fill: #b4b8bf !important;
  pointer-events: none;
  transform: translateY(-50%);
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-info-design-modal #coupon_add_frm .common-selectbox > svg,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-info-design-modal #coupon_add_frm .bootstrap-select .btn.btn-default .caret {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-info-design-modal #coupon_add_frm .common-selectbox::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 14px;
  z-index: 2;
  width: 7px;
  height: 7px;
  border-right: 1.5px solid var(--cl-text-muted, #b4b8bf);
  border-bottom: 1.5px solid var(--cl-text-muted, #b4b8bf);
  pointer-events: none;
  transform: translateY(-70%) rotate(45deg);
  transition: transform .18s var(--cl-e-standard, cubic-bezier(.4, 0, .2, 1));
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-info-design-modal #coupon_add_frm .common-selectbox:has(.bootstrap-select.open)::after {
  transform: translateY(-20%) rotate(225deg);
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-info-design-modal.is-readonly #coupon_add_frm .cl-common-form-group,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-info-design-modal.is-readonly #coupon_add_frm .cl-common-form-group:focus-within,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-info-design-modal.is-readonly #coupon_add_frm .common-selectbox > .bootstrap-select .btn.btn-default,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-info-design-modal.is-readonly #coupon_add_frm .common-selectbox > .bootstrap-select .btn.btn-default:focus {
  background: var(--cl-bg-2, #fafbfc) !important;
  border-color: var(--cl-border-2, #e3e6eb) !important;
  box-shadow: none !important;
  cursor: default !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-info-design-modal.is-readonly #coupon_add_frm .cl-common-form-group input,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-info-design-modal.is-readonly #coupon_add_frm .common-selectbox > .bootstrap-select .btn.btn-default,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-info-design-modal.is-readonly #coupon_add_frm .common-selectbox > .bootstrap-select .btn.btn-default .filter-option {
  color: var(--cl-text-sub, #8a8f98) !important;
  -webkit-text-fill-color: var(--cl-text-sub, #8a8f98) !important;
  opacity: 1 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .bootstrap-select > .dropdown-menu {
  top: var(--cl-select-menu-top, calc(100% + 4px)) !important;
  min-width: 100% !important;
  margin: 0 !important;
  padding: 4px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  box-shadow: 0 8px 24px rgba(20, 24, 32, .14) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .bootstrap-select > .dropdown-menu > .inner,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .bootstrap-select > .dropdown-menu .dropdown-menu.inner {
  position: static !important;
  float: none !important;
  min-width: 0 !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow-x: hidden !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .bootstrap-select .dropdown-menu.inner > li + li {
  margin-top: 2px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .bootstrap-select .dropdown-menu.inner > li > a {
  min-height: 0 !important;
  padding: 8px 12px !important;
  border-radius: 6px !important;
  color: var(--cl-text) !important;
  font-size: 12.5px !important;
  font-weight: 400 !important;
  line-height: 18px !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .bootstrap-select .dropdown-menu.inner > li > a:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .bootstrap-select .dropdown-menu.inner > li > a:focus,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .bootstrap-select .dropdown-menu.inner > li.selected > a,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .bootstrap-select .dropdown-menu.inner > li.selected > a:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .bootstrap-select .dropdown-menu.inner > li.selected > a:focus,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .bootstrap-select .dropdown-menu.inner > li.active > a,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .bootstrap-select .dropdown-menu.inner > li.active > a:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .bootstrap-select .dropdown-menu.inner > li.active > a:focus {
  background: #e4f7ec !important;
  color: var(--cl-green-text) !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .coupon-kind-box,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .coupon-autotarget-box,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .coupon-duplicate-row {
  display: flex !important;
  align-items: center;
  flex-wrap: wrap;
  gap: 0 22px;
  min-height: 18px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .item-row.target-grade-row {
  position: relative;
  align-items: flex-start !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 20px 0 !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .item-row.target-grade-row:has(.grade-multi-select.open) {
  z-index: 30;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .target-grade-row .item-title {
  visibility: visible !important;
  padding-top: 12px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .target-grade-row .target-grade-content {
  display: block !important;
  flex: 1 1 0 !important;
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 44px !important;
  max-height: none !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .target-grade-row .target-grade-extra-box:not(:has(*)) {
  display: none !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .target-grade-row .benefit-selectbox,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .target-grade-row .grade-multi-select {
  position: relative;
  width: 200px !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 44px !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .target-grade-row .grade-multi-trigger {
  appearance: none !important;
  -webkit-appearance: none !important;
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  width: 100% !important;
  height: 44px !important;
  padding: 0 34px 0 12px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  color: var(--cl-text) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 42px !important;
  text-align: left !important;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .target-grade-row .grade-multi-trigger-text {
  display: block !important;
  min-width: 0;
  overflow: hidden;
  color: inherit !important;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .target-grade-row .grade-multi-trigger svg {
  position: absolute !important;
  top: 50% !important;
  right: 12px !important;
  width: 8px !important;
  height: 4px !important;
  margin: 0 !important;
  color: var(--cl-text-muted, #b4b8bf) !important;
  fill: var(--cl-text-muted, #b4b8bf) !important;
  transform: translateY(-50%) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .target-grade-row .grade-multi-trigger svg polygon {
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .target-grade-row .grade-multi-trigger:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .target-grade-row .grade-multi-trigger:focus,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .target-grade-row .grade-multi-select.open .grade-multi-trigger {
  padding: 0 34px 0 12px !important;
  border-color: var(--cl-green) !important;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .13) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .target-grade-row .grade-multi-select.open .grade-multi-trigger svg {
  color: var(--cl-text-muted, #b4b8bf) !important;
  fill: var(--cl-text-muted, #b4b8bf) !important;
  transform: translateY(-50%) rotate(180deg) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .target-grade-row .grade-multi-dropdown {
  top: calc(100% + 4px) !important;
  right: auto !important;
  left: 0 !important;
  display: none !important;
  width: 200px !important;
  max-width: 100% !important;
  max-height: 240px !important;
  margin: 0 !important;
  padding: 4px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  box-shadow: 0 14px 40px rgba(20, 24, 32, .2) !important;
  z-index: 20 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .target-grade-row .grade-multi-select.open .grade-multi-dropdown {
  display: block !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .target-grade-row .grade-multi-item {
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  height: auto !important;
  min-height: 38px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 6px !important;
  color: var(--cl-text) !important;
  opacity: 1 !important;
  visibility: visible !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .target-grade-row .grade-multi-item.all-item {
  margin-bottom: 4px !important;
  border-bottom: 1px solid var(--cl-border) !important;
  border-radius: 6px 6px 0 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .target-grade-row .grade-multi-item:hover {
  background: var(--green-tint, #f6fdf9) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .target-grade-row .grade-multi-item.checked {
  background: var(--green-soft, #f1fbf5) !important;
  box-shadow: inset 0 0 0 1px var(--green-line, #b7e7c9) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .target-grade-row .grade-multi-item .newcheckbox {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  min-height: 38px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .target-grade-row .grade-multi-item .newcheckbox label {
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  height: auto !important;
  min-height: 38px !important;
  padding: 0 10px !important;
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  line-height: 20px !important;
  opacity: 1 !important;
  visibility: visible !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .target-grade-row .grade-multi-item .grade-item-text {
  display: block !important;
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  opacity: 1 !important;
  visibility: visible !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .target-grade-row .cl-grade-choice {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  width: 100% !important;
  min-height: 38px !important;
  margin: 0 !important;
  padding: 0 10px !important;
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  opacity: 1 !important;
  visibility: visible !important;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .target-grade-row .cl-grade-choice > input {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: -1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
  border: 0 !important;
  opacity: 0 !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .target-grade-row .cl-grade-choice-check {
  position: relative;
  display: inline-block !important;
  flex: 0 0 16px;
  width: 16px !important;
  height: 16px !important;
  background: #fff;
  border: 1px solid #b9c1cc;
  border-radius: 4px;
  box-sizing: border-box;
  opacity: 1 !important;
  visibility: visible !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .target-grade-row .cl-grade-choice-check::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 5px;
  width: 5px;
  height: 8px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  opacity: 0;
  transform: rotate(45deg);
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .target-grade-row .cl-grade-choice > input:checked + .cl-grade-choice-check {
  background: var(--cl-green) !important;
  border-color: var(--cl-green) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .target-grade-row .cl-grade-choice > input:checked + .cl-grade-choice-check::after {
  opacity: 1;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .item-row.target-grade-count-row {
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .target-grade-count-row > div:last-child {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap;
  min-width: 0;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .target-grade-count-row .cl-common-form-wrap {
  flex: 0 0 200px !important;
  width: 200px !important;
  max-width: 200px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .newcheckbox,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .newcheckbox label {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 18px !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 18px !important;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .newcheckbox label {
  gap: 6px;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .newcheckbox.disabled {
  opacity: .5;
  pointer-events: none;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .newcheckboxSvgRadio,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .newcheckboxSvg {
  position: relative;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .newcheckboxSvgRadio {
  width: 18px !important;
  height: 18px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .newcheckboxSvg {
  width: 16px !important;
  height: 16px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .newcheckboxSvgRadio input,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .newcheckboxSvg input {
  position: absolute !important;
  inset: 0;
  z-index: 1;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  opacity: .00000001 !important;
  cursor: inherit;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .newcheckboxSvgRadio svg,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .newcheckboxSvg svg {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .newcheckboxSvgRadio::before,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .newcheckboxSvgRadio::after,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .newcheckboxSvg::before,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .newcheckboxSvg::after {
  content: "";
  position: absolute;
  box-sizing: border-box;
  pointer-events: none;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .newcheckboxSvgRadio::before {
  inset: 0;
  background: #fff;
  border: 2px solid #dbdcdf;
  border-radius: 50%;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .newcheckboxSvgRadio::after {
  top: 50%;
  left: 50%;
  width: 8px;
  height: 8px;
  background: var(--cl-green);
  border-radius: 50%;
  transform: translate(-50%, -50%) scale(0);
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .newcheckboxSvgRadio:has(input:checked)::before {
  border-color: var(--cl-green);
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .newcheckboxSvgRadio:has(input:checked)::after {
  transform: translate(-50%, -50%) scale(1);
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .newcheckboxSvg::before {
  inset: 0;
  background: #fff;
  border: 1px solid #b9c1cc;
  border-radius: 4px;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .newcheckboxSvg::after {
  top: 3px;
  left: 5px;
  width: 5px;
  height: 8px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  opacity: 0;
  transform: rotate(45deg);
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .newcheckboxSvg:has(input:checked)::before {
  background: var(--cl-green);
  border-color: var(--cl-green);
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .newcheckboxSvg:has(input:checked)::after {
  opacity: 1;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .coupon-count-box,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .coupon-use-count-box,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .benefit-price-p-row .item-title + div,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .min-price-row .item-title + div {
  display: flex !important;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  min-height: 44px;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .coupon-count-box .cl-common-form-wrap {
  flex: 0 0 150px !important;
  width: 150px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .coupon-count-box .cl-common-form-wrap + div {
  margin-left: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 44px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .coupon-count-box .newcheckbox {
  margin-left: 16px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .coupon-count-box .cl-common-form-wrap.disabled .cl-common-form-group {
  background: #f3f4f5 !important;
  color: #d1d3d5 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .coupon-count-box .cl-common-form-wrap.disabled + div {
  color: #d1d3d5 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .coupon-use-count-box .cl-common-form-wrap {
  flex: 0 0 110px !important;
  width: 110px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .benefit-box {
  display: block !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .benefit-price-row {
  display: flex !important;
  align-items: center;
  flex-wrap: nowrap;
  gap: 8px;
  width: 100%;
  margin-top: 12px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .benefit-price-row .cl-common-form-wrap {
  flex: 0 0 200px !important;
  width: 200px !important;
  min-width: 0;
  max-width: 200px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .benefit-price-row .sale-unit-selectbox {
  flex: 0 0 96px !important;
  width: 96px !important;
  margin-left: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .benefit-price-p-row .cl-common-form-wrap,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .min-price-row .cl-common-form-wrap {
  flex: 0 0 200px !important;
  width: 200px !important;
  max-width: 200px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .benefit-price-p-row .cl-common-form-wrap + div,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .min-price-row .cl-common-form-wrap + div {
  margin-left: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .coupon-expire-box {
  display: block !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .coupon-expire-row {
  display: flex !important;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  width: 100%;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .expire-duration-selectbox {
  flex: 0 0 200px !important;
  width: 200px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .expire-duration-value-row {
  flex: 0 0 118px !important;
  width: 118px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .expire-duration-unit-selectbox {
  flex: 0 0 88px !important;
  width: 88px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .coupon-expire-desc-notcode,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .coupon-expire-desc-code {
  width: 100%;
  max-width: 440px;
  margin: 9px 0 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .coupon-use-group {
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: 100% !important;
  margin: 12px 0 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .coupon-use-group > div {
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  overflow: hidden;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .coupon-use-group .group-title {
  min-height: 44px;
  padding: 10px 48px 10px 14px !important;
  background: #f7f8f9 !important;
  border-bottom: 1px solid var(--cl-border) !important;
  color: var(--cl-text) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 20px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .coupon-use-group .group-list {
  padding: 16px 14px !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  line-height: 20px !important;
}

.cl-dashboard-redesign .cl-coupon-group-open {
  position: absolute;
  inset: 0 0 auto auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: var(--cl-text);
}

.cl-dashboard-redesign .cl-coupon-group-open:is(:hover, :focus-visible) {
  background: var(--cl-green-soft);
  color: var(--cl-green-text);
}

.cl-dashboard-redesign.coupon-add-modal .group-title .cl-coupon-group-open svg {
  position: static;
  width: 16px;
  height: 16px;
  transform: none;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .error {
  flex: 1 1 100%;
  width: 100%;
  margin: 6px 0 0 !important;
  color: #ee445f !important;
  font-size: 12.5px !important;
  line-height: 18px !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .hide {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal .modal-footer {
  display: flex !important;
  flex-direction: column;
  width: 100% !important;
  max-width: 100% !important;
  margin: 22px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal .modal-footer .btn {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 100% !important;
  height: 46px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 46px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal .modal-footer .ok-button-dialog {
  background: var(--cl-green) !important;
  border: 1px solid var(--cl-green) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal .modal-footer .close-button-dialog {
  height: 44px !important;
  margin-top: 14px !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 9px !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  line-height: 44px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal .modal-footer .close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal .modal-footer .close-button-dialog:focus {
  background: #eaf9f0 !important;
  color: var(--cl-green-text) !important;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .top-area {
  display: flex !important;
  flex-direction: column;
  width: 100% !important;
  margin: 0 !important;
  padding: 6px 22px 22px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 10px !important;
  color: var(--cl-text-sub) !important;
  box-shadow: none !important;
}

#cl-shopping-coupon-setting-page .coupon-setting-info-box:not(.cl-source-coupon-usage) {
  position: relative;
  display: flex !important;
  align-items: center;
  gap: 14px;
  width: 100% !important;
  margin: 0 !important;
  padding: 21px 22px 15px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-bottom: 0 !important;
  border-radius: 10px 10px 0 0 !important;
  color: var(--cl-text-sub) !important;
  box-shadow: none !important;
}

#cl-shopping-coupon-setting-page .coupon-setting-info-box:not(.cl-source-coupon-usage)::after {
  content: "";
  position: absolute;
  right: 22px;
  bottom: 0;
  left: 22px;
  height: 1px;
  background: #f1f2f5;
  pointer-events: none;
}

#cl-shopping-coupon-setting-page .coupon-setting-info-box .setting-sub-title,
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .top-area > div > div:first-child,
#cl-shopping-coupon-setting-page .top-area .setting-sub-title {
  flex: 0 0 74px !important;
  width: 74px !important;
  margin: 0 !important;
  padding: 8px 0 0 !important;
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  line-height: 19px !important;
  text-align: left !important;
}

#cl-shopping-coupon-setting-page .coupon-setting-info-box .setting-sub-content {
  display: flex !important;
  align-items: center;
  flex: 1 1 0 !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

#cl-shopping-coupon-setting-page .coupon-setting-info-box .setting-sub-title {
  padding-top: 0 !important;
  line-height: 18px !important;
}

#cl-shopping-coupon-setting-page .cl-source-coupon-usage-form {
  width: 100%;
  margin: 0;
}

#cl-shopping-coupon-setting-page .cl-source-coupon-usage {
  position: static;
  display: flex !important;
  flex-direction: row !important;
  align-items: center;
  flex: 0 1 auto;
  gap: 14px;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

#cl-shopping-coupon-setting-page .cl-source-coupon-usage::after {
  display: none !important;
}

#cl-shopping-coupon-setting-page .setting-sub-content-radio-box,
#cl-shopping-coupon-setting-page .setting-sub-content-radio-box .newcheckbox,
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .checkbox-container .newcheckbox {
  display: inline-flex !important;
  align-items: center;
  margin: 0 !important;
}

#cl-shopping-coupon-setting-page .setting-sub-content-radio-box {
  gap: 22px;
}

#cl-shopping-coupon-setting-page .coupon-setting-info-box .setting-sub-content-radio-box {
  align-items: center;
  height: 18px;
  line-height: 18px;
}

#cl-shopping-coupon-setting-page .newcheckbox label,
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .newcheckbox label {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px;
  min-height: 18px;
  margin: 0 !important;
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  cursor: pointer;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .newcheckboxSvg,
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .newcheckboxSvgRadio {
  position: relative;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  flex: 0 0 16px;
  width: 16px !important;
  height: 16px !important;
  margin: 0 !important;
}

#cl-shopping-coupon-setting-page .newcheckboxSvgRadio {
  flex-basis: 18px;
  width: 18px !important;
  height: 18px !important;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .newcheckboxSvg input,
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .newcheckboxSvgRadio input {
  position: absolute !important;
  inset: 0;
  z-index: 1;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  opacity: 0.00000001 !important;
  cursor: inherit;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .newcheckboxSvg svg,
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .newcheckboxSvgRadio svg {
  display: block !important;
  flex: none;
  margin: 0 !important;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .newcheckboxSvg svg.active,
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .newcheckboxSvgRadio svg.active {
  display: none !important;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .newcheckboxSvg input:checked ~ svg,
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .newcheckboxSvgRadio input:checked ~ svg {
  display: none !important;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .newcheckboxSvg input:checked ~ svg.active,
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .newcheckboxSvgRadio input:checked ~ svg.active {
  display: block !important;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .newcheckboxSvg .active path,
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .newcheckboxSvg .active rect,
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .newcheckboxSvgRadio .active path,
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .newcheckboxSvgRadio .active circle {
  fill: var(--cl-green) !important;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .newcheckbox label:has(.newcheckboxSvgRadio) {
  gap: 0;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .newcheckboxSvgRadio {
  flex: 0 0 18px;
  width: 18px !important;
  height: 18px !important;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .newcheckboxSvgRadio svg {
  display: none !important;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .newcheckboxSvgRadio::before {
  content: "";
  display: block;
  width: 18px;
  height: 18px;
  background: #fff;
  border: 2px solid #DBDCDF;
  border-radius: 50%;
  box-sizing: border-box;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .newcheckboxSvgRadio::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 8px;
  height: 8px;
  background: var(--cl-green);
  border-radius: 50%;
  transform: translate(-50%, -50%) scale(0);
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .newcheckboxSvgRadio:has(input:checked)::before {
  border-color: var(--cl-green);
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .newcheckboxSvgRadio:has(input:checked)::after {
  transform: translate(-50%, -50%) scale(1);
}

#cl-shopping-coupon-setting-page .coupon-setting-info-box .newcheckboxSvgRadio::before,
#cl-shopping-coupon-setting-page .coupon-setting-info-box .newcheckboxSvgRadio::after {
  content: none !important;
  display: none !important;
}

#cl-shopping-coupon-setting-page .coupon-setting-info-box .setting-sub-content-radio-box .newcheckbox,
#cl-shopping-coupon-setting-page .coupon-setting-info-box .setting-sub-content-radio-box .newcheckbox label {
  min-height: 18px !important;
  line-height: 18px !important;
}

#cl-shopping-coupon-setting-page .coupon-setting-info-box .setting-sub-content-radio-box .newcheckbox label {
  gap: 6px !important;
}

#cl-shopping-coupon-setting-page .coupon-setting-info-box .setting-sub-content-radio-box .newcheckbox label span {
  display: inline-flex;
  align-items: center;
  height: 18px;
  line-height: 18px !important;
}

#cl-shopping-coupon-setting-page .coupon-setting-info-box .newcheckboxSvgRadio svg {
  display: block !important;
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
}

#cl-shopping-coupon-setting-page .coupon-setting-info-box .newcheckboxSvgRadio svg.active {
  display: none !important;
}

#cl-shopping-coupon-setting-page .coupon-setting-info-box .newcheckboxSvgRadio input[type="radio"]:checked ~ svg {
  display: none !important;
}

#cl-shopping-coupon-setting-page .coupon-setting-info-box .newcheckboxSvgRadio input[type="radio"]:checked ~ svg.active {
  display: block !important;
}

#cl-shopping-coupon-setting-page .coupon-setting-info-box .newcheckboxSvgRadio .pt-radio-ring {
  fill: none !important;
  stroke-width: 2px;
}

#cl-shopping-coupon-setting-page .coupon-setting-info-box .newcheckboxSvgRadio svg:not(.active) .pt-radio-ring {
  stroke: #DBDCDF;
}

#cl-shopping-coupon-setting-page .coupon-setting-info-box .newcheckboxSvgRadio svg.active .pt-radio-ring {
  stroke: var(--cl-green);
}

#cl-shopping-coupon-setting-page .coupon-setting-info-box .newcheckboxSvgRadio svg.active .pt-radio-dot {
  fill: var(--cl-green);
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .top-area > div {
  display: flex !important;
  align-items: flex-start !important;
  gap: 14px;
  min-height: 0 !important;
  padding: 15px 0 !important;
  border-bottom: 1px solid #f1f2f5 !important;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .top-area > div:last-child {
  border-bottom: 0 !important;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .duration-cond,
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .duration-box,
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .date-box,
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .checkbox-condition-box-container,
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .checkbox-container,
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .keyword-box {
  margin-left: 0 !important;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .duration-box {
  display: inline-flex !important;
  align-items: center;
  height: 35px;
  margin-right: 8px;
  overflow-x: auto;
  overflow-y: hidden;
  vertical-align: top;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .duration-box .duration {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  min-width: 58px !important;
  height: 35px !important;
  padding: 0 14px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-right: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 33px !important;
  white-space: nowrap;
  word-break: keep-all;
  cursor: pointer;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .duration-box .duration:first-child {
  border-radius: 6px 0 0 6px;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .duration-box .duration:last-child {
  border-right: 1px solid var(--cl-border) !important;
  border-radius: 0 6px 6px 0;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .duration-box .duration.active {
  background: #e4f7ec !important;
  border-color: #cdefdd !important;
  color: var(--cl-green-text) !important;
  font-weight: 800 !important;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .duration-box .duration.active + .duration {
  border-left-color: #cdefdd !important;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .date-box {
  display: inline-flex !important;
  align-items: center;
  gap: 0;
  height: 35px;
  vertical-align: top;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .date-box .date-input-box {
  position: relative;
  display: inline-flex !important;
  align-items: center;
  width: auto !important;
  min-width: 210px;
  height: 35px !important;
  overflow: visible;
  background: transparent;
  border: 0 !important;
  border-radius: 0 !important;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .cl-source-date-trigger {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  gap: 8px;
  width: auto;
  min-width: 210px;
  height: 35px !important;
  margin: 0 !important;
  padding: 0 12px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 6px !important;
  box-shadow: none !important;
  color: var(--cl-text);
  font-size: 13px;
  font-weight: 400;
  line-height: 33px;
  text-align: left;
  cursor: pointer;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .cl-source-date-trigger:hover,
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .cl-source-date-trigger:focus,
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .cl-source-date-range.is-open .cl-source-date-trigger {
  background: #f1fbf5 !important;
  border-color: #b7e7c9 !important;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .12) !important;
  outline: 0;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .cl-source-date-icon {
  flex: 0 0 auto;
  width: 14px;
  height: 14px;
  background: var(--cl-text-muted);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2'/%3E%3Cpath d='M16 2v4M8 2v4M3 10h18'/%3E%3C/svg%3E") center / 14px 14px no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2'/%3E%3Cpath d='M16 2v4M8 2v4M3 10h18'/%3E%3C/svg%3E") center / 14px 14px no-repeat;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .cl-source-date-label {
  display: block;
  flex: 0 0 auto;
  color: var(--cl-text);
  white-space: nowrap;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .cl-source-date-source {
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  display: block;
  width: 100% !important;
  height: 35px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  opacity: 0;
  pointer-events: none;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .date-hyphen {
  display: none !important;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .date-box .date-input-box > .uis-datepicker-mini {
  top: 43px !important;
  left: 0 !important;
  width: 286px !important;
  padding: 14px 12px 16px !important;
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 12px;
  box-shadow: 0 12px 30px rgba(20, 24, 32, .16);
  z-index: 10010;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .date-box .date-input-box > .uis-datepicker-mini .ui-datepicker-selectduration {
  display: none !important;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .date-box .date-input-box > .uis-datepicker-mini .ui-datepicker {
  margin: 0;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .date-box .date-input-box > .uis-datepicker-mini .ui-datepicker-header {
  height: 30px;
  padding: 0 34px 12px;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .date-box .date-input-box > .uis-datepicker-mini .ui-datepicker-prev-year,
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .date-box .date-input-box > .uis-datepicker-mini .ui-datepicker-next-year {
  display: none !important;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .date-box .date-input-box > .uis-datepicker-mini .ui-datepicker-prev,
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .date-box .date-input-box > .uis-datepicker-mini .ui-datepicker-next {
  top: 0;
  width: 28px;
  height: 28px;
  line-height: 28px;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .date-box .date-input-box > .uis-datepicker-mini .ui-datepicker-prev {
  left: 0;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .date-box .date-input-box > .uis-datepicker-mini .ui-datepicker-next {
  right: 0;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .date-box .date-input-box > .uis-datepicker-mini .ui-datepicker-header .ui-datepicker-title span {
  color: var(--cl-text);
  font-size: 14px;
  font-weight: 800;
  line-height: 28px;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .date-box .date-input-box > .uis-datepicker-mini .ui-datepicker-calendar {
  width: 100%;
  margin: 0;
  border-spacing: 0;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .date-box .date-input-box > .uis-datepicker-mini .ui-datepicker-calendar tbody tr {
  height: 32px;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .date-box .date-input-box > .uis-datepicker-mini .ui-datepicker-calendar thead tr th span {
  width: 32px;
  padding-bottom: 6px;
  color: var(--cl-text-muted);
  font-size: 12px;
  font-weight: 700;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .date-box .date-input-box > .uis-datepicker-mini .ui-datepicker-calendar thead tr th .Sunday {
  color: #ef4444;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .date-box .date-input-box > .uis-datepicker-mini .ui-datepicker-calendar thead tr th .Saturday {
  color: #2563eb;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .date-box .date-input-box > .uis-datepicker-mini .ui-datepicker-calendar tbody tr td a,
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .date-box .date-input-box > .uis-datepicker-mini .ui-datepicker-calendar tbody tr td span {
  width: 28px !important;
  height: 28px !important;
  line-height: 28px !important;
  color: var(--cl-text);
  font-size: 13px;
  font-weight: 500;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .date-box .date-input-box > .uis-datepicker-mini .ui-datepicker-calendar tbody tr td.ui-datepicker-today:not(.dp-highlight) a {
  background: #eef2f6;
  border-radius: 50%;
  color: var(--cl-text);
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .date-box .date-input-box > .uis-datepicker-mini .dp-highlight .ui-state-default {
  width: 28px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  background-color: var(--cl-green) !important;
  border-radius: 50% !important;
  color: #fff !important;
  font-weight: 700;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .date-box .date-input-box > .uis-datepicker-mini .dp-highlight.pd-between::before,
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .date-box .date-input-box > .uis-datepicker-mini .dp-highlight.dp-first::before,
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .date-box .date-input-box > .uis-datepicker-mini .dp-highlight.dp-end::before {
  top: 2px;
  height: 28px;
  background: #dff6e8 !important;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .date-box .date-input-box > .uis-datepicker-mini .dp-highlight.pd-between .ui-state-default {
  width: 100% !important;
  background: transparent !important;
  border-radius: 0 !important;
  color: var(--cl-green-text) !important;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .date-box .date-input-box > .uis-datepicker-mini .dp-highlight.dp-first::before {
  left: 50%;
  width: 50%;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .date-box .date-input-box > .uis-datepicker-mini .dp-highlight.dp-end::before {
  left: 0;
  width: 50%;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .date-box .date-input-box > .uis-datepicker-mini .dp-first.dp-highlight.dp-end::before,
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .date-box .date-input-box > .uis-datepicker-mini .dp-highlight.dp-first .ui-state-default::after,
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .date-box .date-input-box > .uis-datepicker-mini .dp-highlight.dp-end .ui-state-default::after {
  display: none !important;
}

#cl-shopping-coupon-setting-page .checkbox-condition-box-container {
  display: inline-flex !important;
  align-items: center;
  gap: 8px;
  vertical-align: top;
}

#cl-shopping-coupon-setting-page .checkbox-condition-box {
  position: relative;
  display: inline-flex;
  align-items: flex-start;
  width: auto !important;
  min-width: 0 !important;
  height: 35px;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text);
}

#cl-shopping-coupon-setting-page .checkbox-condition-box .checkbox-title {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  min-width: 120px;
  height: 35px;
  padding: 0 30px 0 12px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  color: var(--cl-text);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 33px;
  cursor: pointer;
  transition: background-color .12s, border-color .12s, color .12s;
}

#cl-shopping-coupon-setting-page .checkbox-condition-box.box2 .checkbox-title {
  min-width: 112px;
}

#cl-shopping-coupon-setting-page .checkbox-condition-box .checkbox-title::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 10px;
  display: block;
  width: 14px;
  height: 14px;
  margin: 0 !important;
  padding: 0 !important;
  background: center / 14px 14px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238A8F98' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  font-family: initial !important;
  font-size: 0 !important;
  line-height: 0 !important;
  pointer-events: none;
  transform: translateY(-50%);
  transition: transform .15s;
}

#cl-shopping-coupon-setting-page .checkbox-condition-box .checkbox-title:hover,
#cl-shopping-coupon-setting-page .checkbox-condition-box.is-open .checkbox-title {
  background: #fff;
  border-color: var(--cl-green);
  color: var(--cl-green-text);
}

#cl-shopping-coupon-setting-page .checkbox-condition-box.is-open .checkbox-title::after {
  transform: translateY(-50%) rotate(180deg);
}

#cl-shopping-coupon-setting-page .checkbox-condition-box .checkbox-item {
  position: absolute !important;
  top: calc(100% + 5px) !important;
  left: 0 !important;
  width: auto !important;
  min-width: 190px;
  margin: 0 !important;
  padding: 6px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  box-sizing: border-box;
  box-shadow: 0 8px 24px rgba(20, 24, 32, .14) !important;
  z-index: 10030;
}

#cl-shopping-coupon-setting-page .checkbox-condition-box.box2 .checkbox-item {
  min-width: 236px;
}

#cl-shopping-coupon-setting-page .checkbox-condition-box .checkbox-item ul {
  position: static !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  list-style: none !important;
}

#cl-shopping-coupon-setting-page .checkbox-condition-box .checkbox-item li {
  display: flex !important;
  align-items: center;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 6px;
  color: var(--cl-text);
  font-size: 12.5px;
  line-height: 18px;
  list-style: none;
  white-space: nowrap;
  cursor: pointer;
}

#cl-shopping-coupon-setting-page .checkbox-condition-box .checkbox-item li + li {
  margin-top: 0 !important;
}

#cl-shopping-coupon-setting-page .checkbox-condition-box .checkbox-item li:first-child {
  min-height: 0 !important;
  margin: 0 0 4px !important;
  padding: 8px 10px 10px !important;
  border-bottom: 1px solid var(--cl-border) !important;
  border-radius: 0 !important;
}

#cl-shopping-coupon-setting-page .checkbox-condition-box .checkbox-item li:first-child label {
  flex: 0 0 auto;
  width: auto;
  min-height: 0 !important;
  padding: 0 !important;
  border-radius: 0;
  font-weight: 700 !important;
}

#cl-shopping-coupon-setting-page .checkbox-condition-box .checkbox-item li:has(input:checked):not(.separator) {
  color: var(--cl-text);
  font-weight: 400;
}

#cl-shopping-coupon-setting-page .checkbox-condition-box .checkbox-item li:hover {
  color: var(--cl-text);
}

#cl-shopping-coupon-setting-page .checkbox-condition-box .checkbox-item li:first-child .newcheckbox {
  width: auto;
  min-height: 0 !important;
  padding: 0 !important;
}

#cl-shopping-coupon-setting-page .checkbox-condition-box .checkbox-item .newcheckbox {
  display: flex !important;
  align-items: center !important;
  width: 100%;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  color: inherit !important;
  font-size: 13px !important;
  font-weight: inherit !important;
  line-height: 18px !important;
  cursor: pointer;
}

#cl-shopping-coupon-setting-page .checkbox-condition-box .checkbox-item label {
  display: flex !important;
  align-items: center !important;
  gap: 7px;
  width: 100%;
  min-height: 34px !important;
  margin: 0 !important;
  padding: 8px 10px !important;
  border-radius: 6px;
  color: inherit !important;
  font-size: 13px !important;
  font-weight: inherit !important;
  line-height: 18px !important;
  cursor: pointer;
}

#cl-shopping-coupon-setting-page .checkbox-condition-box .checkbox-item label:hover {
  background: #f1fbf5;
}

#cl-shopping-coupon-setting-page .checkbox-condition-box .checkbox-item .newcheckboxSvg {
  position: relative;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 16px !important;
  height: 16px !important;
  margin: 0 !important;
}

#cl-shopping-coupon-setting-page .checkbox-condition-box .checkbox-item .newcheckboxSvg svg {
  width: 16px !important;
  height: 16px !important;
}

#cl-shopping-coupon-setting-page .checkbox-condition-box .checkbox-item .newcheckboxSvg svg:not(.active) .st6 {
  fill: #fff !important;
}

#cl-shopping-coupon-setting-page .checkbox-condition-box .checkbox-item .newcheckboxSvg svg:not(.active) .st19 {
  fill: #b9c1cc !important;
}

#cl-shopping-coupon-setting-page .checkbox-condition-box .checkbox-item .newcheckboxSvg svg.active rect,
#cl-shopping-coupon-setting-page .checkbox-condition-box .checkbox-item .newcheckboxSvg svg.active .st6 {
  fill: var(--cl-green) !important;
}

#cl-shopping-coupon-setting-page .checkbox-condition-box .checkbox-item .newcheckboxSvg svg.active path,
#cl-shopping-coupon-setting-page .checkbox-condition-box .checkbox-item .newcheckboxSvg svg.active .st19 {
  fill: #fff !important;
}

#cl-shopping-coupon-setting-page .checkbox-condition-box .checkbox-item .newcheckboxSvg svg,
#cl-shopping-coupon-setting-page .checkbox-condition-box .checkbox-item .newcheckboxSvg svg.active,
#cl-shopping-coupon-setting-page .checkbox-condition-box .checkbox-item .newcheckboxSvg input:checked ~ svg,
#cl-shopping-coupon-setting-page .checkbox-condition-box .checkbox-item .newcheckboxSvg input:checked ~ svg.active {
  display: none !important;
}

#cl-shopping-coupon-setting-page .checkbox-condition-box .checkbox-item .newcheckboxSvg::before,
#cl-shopping-coupon-setting-page .checkbox-condition-box .checkbox-item .newcheckboxSvg::after {
  content: "";
  position: absolute;
  box-sizing: border-box;
  pointer-events: none;
}

#cl-shopping-coupon-setting-page .checkbox-condition-box .checkbox-item .newcheckboxSvg::before {
  inset: 0;
  background: #fff;
  border: 1px solid #b9c1cc;
  border-radius: 4px;
}

#cl-shopping-coupon-setting-page .checkbox-condition-box .checkbox-item .newcheckboxSvg::after {
  top: 3px;
  left: 5px;
  width: 5px;
  height: 8px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  opacity: 0;
  transform: rotate(45deg);
}

#cl-shopping-coupon-setting-page .checkbox-condition-box .checkbox-item .newcheckboxSvg:has(input:checked)::before,
#cl-shopping-coupon-setting-page .checkbox-condition-box .checkbox-item .newcheckboxSvg.is-checked::before {
  background: var(--cl-green);
  border-color: var(--cl-green);
}

#cl-shopping-coupon-setting-page .checkbox-condition-box .checkbox-item .newcheckboxSvg:has(input:checked)::after,
#cl-shopping-coupon-setting-page .checkbox-condition-box .checkbox-item .newcheckboxSvg.is-checked::after {
  opacity: 1;
}

#cl-shopping-coupon-setting-page .checkbox-condition-box .checkbox-item li.separator {
  display: none !important;
  height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent;
  pointer-events: none;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .keyword-box {
  position: relative;
  display: inline-flex !important;
  align-items: center;
  width: 276px !important;
  height: 35px !important;
  padding: 0 !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 6px !important;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .keyword-box > div {
  width: 100%;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .keyword-box input {
  width: 100% !important;
  height: 33px !important;
  padding: 0 34px 0 12px !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--cl-text) !important;
  font-size: 13px !important;
  font-weight: 400;
  line-height: 33px !important;
  outline: 0;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .keyword-box input::placeholder {
  color: var(--cl-text-muted);
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .keyword-box .search-btn,
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .keyword-box svg {
  position: absolute !important;
  top: 50%;
  right: 12px;
  width: 14px !important;
  height: 14px !important;
  margin: 0 !important;
  fill: var(--cl-text-muted) !important;
  transform: translateY(-50%);
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .search-btn-area {
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  margin: 16px auto 0 !important;
  padding: 0 !important;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .search-btn-area button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 100px;
  height: 35px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  border-radius: 6px !important;
  box-shadow: none !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 33px !important;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .search-btn-area .btn-primary {
  background: var(--cl-green) !important;
  border: 1px solid var(--cl-green) !important;
  color: #fff !important;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .search-btn-area .btn-default {
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  color: var(--cl-text-sub) !important;
}

#cl-shopping-coupon-setting-page .coupon-setting-box > .search-btn-area {
  margin: 0 0 20px !important;
  padding: 20px 22px 22px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-top: 0 !important;
  border-radius: 0 0 10px 10px !important;
}

#cl-shopping-coupon-setting-page .coupon-setting-box .top-area {
  border-bottom: 0 !important;
  border-radius: 10px 10px 0 0 !important;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .search-result-box {
  display: block !important;
  float: none !important;
  width: 100% !important;
  margin: 0 0 14px !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-size: 15px !important;
  font-weight: 800 !important;
  line-height: 22px !important;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .cl-source-coupon-result-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  width: 100%;
  margin: 0 0 14px;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .cl-source-coupon-result-head .search-result-box {
  flex: 1 1 auto;
  width: auto !important;
  margin: 0 !important;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .cl-source-coupon-result-head .filter-box {
  flex: 0 0 auto;
  margin: 0 !important;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .filter-box {
  position: static !important;
  display: flex !important;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  width: auto !important;
  margin: 0 0 14px auto !important;
  padding: 0 !important;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .filter-box .select-box {
  position: relative;
  display: inline-flex;
  width: auto !important;
  margin: 0 !important;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .filter-box .select-box::after {
  display: none !important;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .filter-box select.cl-coupon-select-source,
#cl-shopping-coupon-history-page .duration-cond select.cl-coupon-select-source {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .cl-coupon-result-select {
  min-width: 104px;
  z-index: 10020;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .cl-coupon-result-select .cl-redesign-select-trigger {
  width: 104px;
  min-width: 104px;
  height: 35px;
  padding: 0 10px 0 12px;
  color: var(--cl-text);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 33px;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .cl-coupon-result-select--sort,
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .cl-coupon-result-select--sort .cl-redesign-select-trigger,
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .cl-coupon-result-select--sort .cl-redesign-select-menu {
  width: 128px;
  min-width: 128px;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .cl-coupon-result-select--limit,
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .cl-coupon-result-select--limit .cl-redesign-select-trigger,
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .cl-coupon-result-select--limit .cl-redesign-select-menu {
  width: 104px;
  min-width: 104px;
}

#cl-shopping-coupon-history-page .cl-coupon-result-select--date-type,
#cl-shopping-coupon-history-page .cl-coupon-result-select--date-type .cl-redesign-select-trigger,
#cl-shopping-coupon-history-page .cl-coupon-result-select--date-type .cl-redesign-select-menu {
  width: 112px;
  min-width: 112px;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .cl-coupon-result-select .cl-redesign-select-menu {
  z-index: 10040;
  width: 104px;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .cl-coupon-result-select .cl-redesign-select-menu li {
  font-size: 13px;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .table-container,
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .history-list,
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .coupon-list {
  width: 100% !important;
  margin: 0 0 20px !important;
  overflow-x: auto !important;
  overflow-y: hidden;
  background: #fff;
  border: 0 !important;
  border-radius: 0;
  box-shadow: none;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) table.table {
  width: 100%;
  margin: 0 !important;
  background: #fff;
  border: 0 !important;
  border-collapse: collapse;
  border-spacing: 0;
  table-layout: auto;
}

#cl-shopping-coupon-setting-page table.table {
  min-width: 920px;
}

#cl-shopping-coupon-history-page table.table,
#cl-shopping-coupon-manage-page table.table {
  min-width: 1200px;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) table.table th,
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) table.table td {
  height: auto !important;
  padding: 12px 10px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--cl-border) !important;
  font-size: 13px !important;
  line-height: 18px !important;
  text-align: center;
  vertical-align: middle !important;
  white-space: nowrap;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) table.table th {
  background: #f7f8fa !important;
  border-top: 1px solid var(--cl-border) !important;
  color: var(--cl-text-sub) !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) table.table td {
  background: #fff !important;
  color: var(--cl-text) !important;
  font-weight: 400 !important;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) table.table tbody tr:hover td {
  background: #fafbfc !important;
}

#cl-shopping-coupon-setting-page table.table td:nth-child(3),
#cl-shopping-coupon-setting-page table.table th:nth-child(3),
#cl-shopping-coupon-history-page table.table td:nth-child(1),
#cl-shopping-coupon-history-page table.table th:nth-child(1),
#cl-shopping-coupon-history-page table.table td:nth-child(3),
#cl-shopping-coupon-history-page table.table th:nth-child(3),
#cl-shopping-coupon-manage-page table.table td:nth-child(2),
#cl-shopping-coupon-manage-page table.table th:nth-child(2) {
  text-align: left;
}

#cl-shopping-coupon-setting-page .coupon-setting-list .list-area table.table label:has(input[type="checkbox"]) {
  position: relative;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  margin: 0 !important;
  cursor: pointer;
  vertical-align: middle;
}

#cl-shopping-coupon-setting-page .coupon-setting-list .list-area table.table label:has(input[type="checkbox"]:disabled) {
  cursor: default;
}

#cl-shopping-coupon-setting-page .coupon-setting-list .list-area table.table input[type="checkbox"] + svg,
#cl-shopping-coupon-setting-page .coupon-setting-list .list-area table.table input[type="checkbox"] + svg + svg {
  display: none !important;
}

#cl-shopping-coupon-setting-page .coupon-setting-list .list-area table.table label:has(input[type="checkbox"])::before,
#cl-shopping-coupon-setting-page .coupon-setting-list .list-area table.table label:has(input[type="checkbox"])::after {
  content: "";
  position: absolute;
  box-sizing: border-box;
  pointer-events: none;
}

#cl-shopping-coupon-setting-page .coupon-setting-list .list-area table.table label:has(input[type="checkbox"])::before {
  inset: 0;
  background: #fff;
  border: 1.5px solid #c9cdd4;
  border-radius: 4px;
  transition: background .12s, border-color .12s;
}

#cl-shopping-coupon-setting-page .coupon-setting-list .list-area table.table label:has(input[type="checkbox"])::after {
  top: 3px;
  left: 5px;
  width: 5px;
  height: 8px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  opacity: 0;
  transform: rotate(45deg);
}

#cl-shopping-coupon-setting-page .coupon-setting-list .list-area table.table label:has(input[type="checkbox"]:checked)::before {
  background: var(--cl-green);
  border-color: var(--cl-green);
}

#cl-shopping-coupon-setting-page .coupon-setting-list .list-area table.table label:has(input[type="checkbox"]:checked)::after {
  opacity: 1;
}

#cl-shopping-coupon-setting-page .coupon-setting-list .list-area table.table label:has(input[type="checkbox"]:disabled)::before {
  background: #f7f8fa;
  border-color: #dfe3e8;
}

#cl-shopping-coupon-manage-page .coupon-manage-list .coupon-list table.table label:has(input[type="checkbox"]) {
  position: relative;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  margin: 0 !important;
  cursor: pointer;
  vertical-align: middle;
}

#cl-shopping-coupon-manage-page .coupon-manage-list .coupon-list table.table label:has(input[type="checkbox"]:disabled) {
  cursor: default;
}

#cl-shopping-coupon-manage-page .coupon-manage-list .coupon-list table.table input[type="checkbox"] + svg,
#cl-shopping-coupon-manage-page .coupon-manage-list .coupon-list table.table input[type="checkbox"] + svg + svg {
  display: none !important;
}

#cl-shopping-coupon-manage-page .coupon-manage-list .coupon-list table.table label:has(input[type="checkbox"])::before,
#cl-shopping-coupon-manage-page .coupon-manage-list .coupon-list table.table label:has(input[type="checkbox"])::after {
  content: "";
  position: absolute;
  box-sizing: border-box;
  pointer-events: none;
}

#cl-shopping-coupon-manage-page .coupon-manage-list .coupon-list table.table label:has(input[type="checkbox"])::before {
  inset: 0;
  background: #fff;
  border: 1.5px solid #c9cdd4;
  border-radius: 4px;
  transition: background .12s, border-color .12s;
}

#cl-shopping-coupon-manage-page .coupon-manage-list .coupon-list table.table label:has(input[type="checkbox"])::after {
  top: 3px;
  left: 5px;
  width: 5px;
  height: 8px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  opacity: 0;
  transform: rotate(45deg);
}

#cl-shopping-coupon-manage-page .coupon-manage-list .coupon-list table.table label:has(input[type="checkbox"]:checked)::before {
  background: var(--cl-green);
  border-color: var(--cl-green);
}

#cl-shopping-coupon-manage-page .coupon-manage-list .coupon-list table.table label:has(input[type="checkbox"]:checked)::after {
  opacity: 1;
}

#cl-shopping-coupon-manage-page .coupon-manage-list .coupon-list table.table label:has(input[type="checkbox"]:disabled)::before {
  background: #f7f8fa;
  border-color: #dfe3e8;
}

/* 여러 쿠폰 행을 합친 회원 정보는 첫 쿠폰과 같은 위치에서 읽히게 한다. */
body.cl-dashboard-redesign-page #cl-shopping-coupon-manage-page .coupon-list table.table tbody td[rowspan] {
  vertical-align: top !important;
}

#cl-shopping-coupon-manage-page .coupon-list thead tr::after,
#cl-shopping-coupon-manage-page .coupon-list tbody tr::after {
  display: none !important;
  content: none !important;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .paging {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  width: 100%;
  margin: 18px 0 0 !important;
  padding: 0 !important;
  background: transparent;
  border-top: 0 !important;
  color: var(--cl-text-sub);
  font-size: 13px;
  font-weight: 400;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .paging a,
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .paging button,
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .paging span,
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .paging strong {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 30px;
  width: auto;
  height: 30px;
  margin: 0;
  padding: 0 8px;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 6px;
  color: var(--cl-text-muted);
  font-size: 13px;
  font-weight: 400;
  line-height: 28px;
  text-decoration: none;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .paging strong,
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .paging .active {
  background: #e4f7ec;
  border-color: var(--cl-green);
  color: var(--cl-green-text);
  font-weight: 800;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .paging .pg:disabled,
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .paging .pg:disabled:hover {
  opacity: .35;
  cursor: default;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .paging .pg.nav svg {
  width: 14px;
  height: 14px;
  display: block;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .shop-pager {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  width: 100%;
  margin: 22px 0 0 !important;
  padding: 0 !important;
  border-top: 0 !important;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .shop-pager .pg {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 30px;
  height: 30px;
  margin: 0;
  padding: 0 8px;
  appearance: none;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 6px;
  color: var(--cl-text-sub);
  font-size: 13px;
  font-weight: 400;
  line-height: normal;
  cursor: pointer;
  text-decoration: none;
  transition: background-color .12s, border-color .12s, color .12s;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .shop-pager .pg.active {
  background: #e4f7ec;
  border-color: var(--cl-green);
  color: var(--cl-green-text);
  font-weight: 700;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .shop-pager .pg:hover:not(.active):not(:disabled) {
  background: #f1fbf5;
  color: var(--cl-green-text);
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .shop-pager .pg:disabled,
:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .shop-pager .pg:disabled:hover {
  background: transparent;
  color: var(--cl-text-muted);
  cursor: default;
  opacity: .45;
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .shop-pager .pg.nav {
  color: var(--cl-text-muted);
}

:is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .shop-pager .pg.nav svg {
  display: block;
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
}

/* Coupon deletion and issued-coupon recall */
body.cl-dashboard-redesign-page .cl-source-coupon-delete-wrap {
  position: fixed;
  inset: 0;
  z-index: 999999;
  background: rgba(20, 24, 32, .45);
}

body.cl-dashboard-redesign-page .cl-source-coupon-delete-wrap + .modal-backdrop {
  opacity: 0 !important;
}

body.cl-dashboard-redesign-page #cl-coupon-delete-modal {
  display: flex !important;
  align-items: center;
  justify-content: center;
  position: fixed !important;
  inset: 0;
  width: 100%;
  height: 100%;
  padding: 16px !important;
  overflow: hidden !important;
}

body.cl-dashboard-redesign-page #cl-coupon-delete-modal > .cl-mobile-btn {
  display: none !important;
}

body.cl-dashboard-redesign-page #cl-coupon-delete-modal .modal-dialog {
  width: 520px !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent;
  transform: none !important;
}

body.cl-dashboard-redesign-page #cl-coupon-delete-modal .modal-content {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: auto !important;
  min-height: 0 !important;
  max-height: calc(100vh - 32px);
  max-height: calc(100dvh - 32px);
  padding: 0 !important;
  overflow: hidden;
  border: 1px solid var(--cl-border);
  border-radius: 14px !important;
  background: #fff;
  box-shadow: 0 20px 50px rgba(20, 24, 32, .25);
  color: var(--cl-text);
  font-family: var(--cl-source-font);
  letter-spacing: 0;
}

body.cl-dashboard-redesign-page #cl-coupon-delete-modal .modal-body {
  flex: 1 1 auto;
  width: 100%;
  max-width: none;
  min-height: 0 !important;
  margin: 0;
  padding: 32px 32px 0 !important;
  overflow: auto;
  color: var(--cl-text-sub);
  font-size: 14px;
  line-height: 22px;
  text-align: center;
  word-break: keep-all;
  overflow-wrap: anywhere;
}

body.cl-dashboard-redesign-page #cl-coupon-delete-modal .modal-title {
  margin: 0 24px 20px !important;
  color: var(--cl-text);
  font-size: 21px !important;
  font-weight: 800;
  line-height: 30px;
}

body.cl-dashboard-redesign-page #cl-coupon-delete-modal .choice-box {
  display: grid;
  gap: 10px;
  margin: 24px 0;
}

body.cl-dashboard-redesign-page #cl-coupon-delete-modal .collect-box {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0;
  padding: 16px;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
  background: #fff;
}

body.cl-dashboard-redesign-page #cl-coupon-delete-modal .collect-box:hover {
  background: var(--cl-green-tint);
}

body.cl-dashboard-redesign-page #cl-coupon-delete-modal .collect-box:has(input:checked) {
  border-color: var(--cl-green);
  background: var(--cl-green-soft);
}

body.cl-dashboard-redesign-page #cl-coupon-delete-modal .radio-box,
body.cl-dashboard-redesign-page #cl-coupon-delete-modal .radio-box label {
  position: relative;
  display: flex;
  align-items: center;
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
  margin: 0;
  padding: 0;
}

body.cl-dashboard-redesign-page #cl-coupon-delete-modal .radio-box input {
  display: block !important;
  visibility: visible !important;
  position: absolute;
  inset: 0;
  width: 18px;
  height: 18px;
  margin: 0;
  opacity: 0;
  cursor: pointer;
}

body.cl-dashboard-redesign-page #cl-coupon-delete-modal .radio-box input:checked + svg + svg {
  fill: var(--cl-green);
}

body.cl-dashboard-redesign-page #cl-coupon-delete-modal .radio-box input:focus-visible ~ svg {
  outline: 2px solid var(--cl-green);
  outline-offset: 3px;
  border-radius: 50%;
}

body.cl-dashboard-redesign-page #cl-coupon-delete-modal .desc-box {
  min-width: 0;
  gap: 4px;
}

body.cl-dashboard-redesign-page #cl-coupon-delete-modal .desc-title {
  color: var(--cl-text);
  font-size: 14px;
  font-weight: 700;
  line-height: 20px;
}

body.cl-dashboard-redesign-page #cl-coupon-delete-modal .desc-content {
  color: var(--cl-text-sub);
  font-size: 13px;
  line-height: 20px;
}

body.cl-dashboard-redesign-page #cl-coupon-delete-modal .modal-footer {
  display: flex;
  flex: none;
  flex-direction: column;
  justify-content: flex-start;
  gap: 14px;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 24px 32px !important;
  border: 0;
}

body.cl-dashboard-redesign-page #cl-coupon-delete-modal .modal-footer::before,
body.cl-dashboard-redesign-page #cl-coupon-delete-modal .modal-footer::after {
  display: none;
}

body.cl-dashboard-redesign-page #cl-coupon-delete-modal .modal-footer .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 100% !important;
  min-width: 0 !important;
  height: 46px !important;
  min-height: 46px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  border: 0 !important;
  border-radius: 9px;
  background: transparent !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px;
  font-weight: 600;
  line-height: 20px !important;
}

body.cl-dashboard-redesign-page #cl-coupon-delete-modal .modal-footer .ok-button-dialog {
  border-radius: 8px;
  background: var(--cl-danger) !important;
  color: #fff !important;
  font-size: 15px;
  font-weight: 700;
}

body.cl-dashboard-redesign-page #cl-coupon-delete-modal .modal-footer .close-button-dialog:hover,
body.cl-dashboard-redesign-page #cl-coupon-delete-modal .modal-footer .close-button-dialog:focus-visible {
  background: var(--cl-green-soft) !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page #cl-coupon-delete-modal .modal-footer .ok-button-dialog:hover,
body.cl-dashboard-redesign-page #cl-coupon-delete-modal .modal-footer .ok-button-dialog:focus {
  border-color: var(--cl-danger) !important;
  background: var(--cl-danger) !important;
}

body.cl-dashboard-redesign-page #cl-coupon-delete-modal .modal-footer .ok-button-dialog:focus-visible {
  outline-color: var(--cl-danger);
}

body.cl-dashboard-redesign-page #cl-coupon-delete-modal .modal-content > .close {
  position: absolute;
  top: 16px;
  right: 16px;
  z-index: 2;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--cl-text-sub);
  font-size: 0;
  line-height: 0;
  opacity: 1;
  transition: background .12s, transform .18s cubic-bezier(.34, 1.56, .64, 1);
}

body.cl-dashboard-redesign-page #cl-coupon-delete-modal .modal-content > .close svg {
  display: block;
  width: 9px !important;
  height: 9px !important;
  fill: currentColor;
}

body.cl-dashboard-redesign-page #cl-coupon-delete-modal .modal-content > .close:hover {
  background: #f1f2f5;
  color: var(--cl-text);
  transform: rotate(90deg);
}

body.cl-dashboard-redesign-page #cl-coupon-delete-modal button:focus-visible {
  outline: 2px solid var(--cl-green);
  outline-offset: 2px;
}

@media (max-width: 600px) {
  body.cl-dashboard-redesign-page #cl-coupon-delete-modal .modal-body {
    padding: 48px 20px 0 !important;
  }

  body.cl-dashboard-redesign-page #cl-coupon-delete-modal .modal-title {
    margin: 0 0 16px !important;
    font-size: 20px !important;
  }

  body.cl-dashboard-redesign-page #cl-coupon-delete-modal .modal-footer {
    padding: 20px !important;
  }

}

#cl-shopping-coupon-setting-page .coupon-btn-area {
  display: flex !important;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  width: 100%;
  margin: 16px 0 0 !important;
  padding: 0 !important;
}

#cl-shopping-coupon-setting-page .coupon-btn-area .button,
#cl-shopping-coupon-manage-page .btn-publish,
#cl-shopping-coupon-manage-page .btn-collect {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-width: 88px;
  height: 35px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  line-height: 33px !important;
  text-align: center;
  cursor: pointer;
}

#cl-shopping-coupon-setting-page .coupon-btn-area .btn-delete {
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  color: var(--cl-text-sub) !important;
}

#cl-shopping-coupon-setting-page .coupon-btn-area .btn-add,
#cl-shopping-coupon-manage-page .btn-publish,
#cl-shopping-coupon-manage-page .btn-collect {
  background: var(--cl-green) !important;
  border: 1px solid var(--cl-green) !important;
  color: #fff !important;
}

#cl-shopping-coupon-manage-page .no-list {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 180px;
  color: var(--cl-text-muted) !important;
  font-size: 13.5px;
  font-weight: 400;
  text-align: center;
}

#cl-shopping-coupon-setting-page table.table tbody tr.no-list,
#cl-shopping-coupon-history-page table.table tbody tr.no-list,
#cl-shopping-coupon-manage-page table.table tbody tr.no-list {
  display: table-row !important;
  min-height: 0 !important;
  border-bottom: 0 !important;
}

#cl-shopping-coupon-setting-page table.table tbody tr.no-list td,
#cl-shopping-coupon-history-page table.table tbody tr.no-list td,
#cl-shopping-coupon-manage-page table.table tbody tr.no-list td {
  display: table-cell !important;
  width: 100%;
  height: 100px !important;
  padding: 0 !important;
  border: 0 !important;
  background: #fff !important;
  text-align: center !important;
  vertical-align: middle !important;
}

#cl-shopping-coupon-history-page .duration-cond {
  display: inline-flex !important;
  align-items: center;
  gap: 8px;
}

#cl-shopping-coupon-history-page .duration-cond .common-selectbox {
  display: inline-flex !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

#cl-shopping-coupon-history-page .duration-cond .bootstrap-select {
  width: 112px !important;
}

#cl-shopping-coupon-history-page .duration-cond .bootstrap-select > .btn.btn-default {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  width: 112px !important;
  height: 35px !important;
  padding: 0 30px 0 12px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 6px !important;
  box-shadow: none !important;
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 33px !important;
}

#cl-shopping-coupon-history-page .duration-cond .bootstrap-select .dropdown-menu {
  margin-top: 4px !important;
  padding: 4px !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  box-shadow: 0 8px 24px rgba(20, 24, 32, .14) !important;
}

#cl-shopping-coupon-history-page .duration-cond .bootstrap-select .dropdown-menu > li > a {
  padding: 8px 12px !important;
  border-radius: 6px;
  color: var(--cl-text) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
}

#cl-shopping-coupon-history-page .duration-cond .bootstrap-select .dropdown-menu > li.selected > a,
#cl-shopping-coupon-history-page .duration-cond .bootstrap-select .dropdown-menu > li > a:hover {
  background: #e4f7ec !important;
  color: var(--cl-green-text) !important;
}

#cl-shopping-coupon-history-page .duration-cond .common-selectbox > svg {
  right: 10px !important;
  left: auto !important;
  z-index: 3;
  fill: var(--cl-text-muted);
  pointer-events: none;
}

#cl-shopping-coupon-history-page .duration-cond .common-selectbox.cl-has-redesign-select > svg,
#cl-shopping-coupon-history-page .duration-cond .common-selectbox.cl-has-redesign-select .bootstrap-select {
  display: none !important;
}

#cl-shopping-coupon-history-page .top-area .checkbox-container ul {
  display: flex !important;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px 22px;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

#cl-shopping-coupon-history-page .top-area .checkbox-container {
  display: flex !important;
  align-items: center;
  min-height: 18px;
}

#cl-shopping-coupon-history-page .top-area .checkbox-container li {
  display: inline-flex;
  align-items: center;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none;
}

#cl-shopping-coupon-history-page .top-area .checkbox-container li.separator {
  flex: 0 0 1px;
  width: 1px !important;
  height: 16px;
  background: var(--cl-border);
}

#cl-shopping-coupon-history-page .top-area .checkbox-container .newcheckbox {
  display: inline-flex !important;
  align-items: center;
  min-height: 18px !important;
  margin: 0 !important;
  line-height: 18px !important;
}

#cl-shopping-coupon-history-page .top-area .checkbox-container .newcheckbox label {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px;
  min-height: 18px;
  margin: 0 !important;
  color: var(--cl-text);
  font-size: 13px;
  font-weight: 400;
  line-height: 18px !important;
  cursor: pointer;
}

#cl-shopping-coupon-history-page .top-area .checkbox-container .newcheckboxSvg {
  position: relative;
  display: inline-flex !important;
  flex: 0 0 16px;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  margin: 0 !important;
  overflow: visible;
  line-height: 0;
}

#cl-shopping-coupon-history-page .top-area .checkbox-container .newcheckboxSvg input[type="checkbox"] {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: 0;
  opacity: 0;
  pointer-events: none;
}

#cl-shopping-coupon-history-page .top-area .checkbox-container .newcheckboxSvg svg {
  display: none !important;
}

#cl-shopping-coupon-history-page .top-area .checkbox-container .newcheckboxSvg::before {
  content: "";
  width: 16px;
  height: 16px;
  background: #fff;
  border: 1px solid #b9c1cc;
  border-radius: 3px;
  box-sizing: border-box;
}

#cl-shopping-coupon-history-page .top-area .checkbox-container .newcheckboxSvg::after {
  content: "";
  position: absolute;
  left: 5px;
  top: 3px;
  width: 5px;
  height: 8px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  opacity: 0;
  transform: rotate(45deg);
}

#cl-shopping-coupon-history-page .top-area .checkbox-container .newcheckboxSvg:has(input[type="checkbox"]:checked)::before {
  background: var(--cl-green);
  border-color: var(--cl-green);
}

#cl-shopping-coupon-history-page .top-area .checkbox-container .newcheckboxSvg:has(input[type="checkbox"]:checked)::after {
  opacity: 1;
}

#cl-shopping-coupon-manage-page .coupon-manage-list .top-area {
  display: flex !important;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-height: 40px;
  margin: 0 0 16px !important;
  padding: 0 !important;
  color: var(--cl-text-sub);
}

#cl-shopping-coupon-manage-page .coupon-manage-list .btn-publish {
  min-width: 116px !important;
  height: 40px !important;
  line-height: 38px !important;
}

#cl-shopping-coupon-manage-page .coupon-manage-list .keyword-box {
  width: 300px !important;
  height: 40px !important;
  margin: 0 !important;
}

#cl-shopping-coupon-manage-page .coupon-manage-list .keyword-box input {
  height: 38px !important;
  line-height: 38px !important;
}

#cl-shopping-coupon-manage-page .coupon-manage-list .filter-box {
  margin: 0 0 0 auto !important;
}

#cl-shopping-coupon-manage-page .coupon-manage-list .cl-coupon-result-select .cl-redesign-select-trigger {
  height: 40px;
  line-height: 38px;
}

#cl-shopping-coupon-manage-page .coupon-manage-list .coupon-list {
  margin-top: 0 !important;
}

#cl-shopping-coupon-manage-page .cl-coupon-target-scope {
  display: flex;
  align-items: center;
  gap: 24px;
  min-height: 24px;
  margin: 0 0 22px;
}

#cl-shopping-coupon-manage-page .cl-coupon-target-option {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  color: var(--cl-text);
  font-size: 13.5px;
  font-weight: 500;
  line-height: 20px;
  cursor: pointer;
}

#cl-shopping-coupon-manage-page .cl-coupon-target-option input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

#cl-shopping-coupon-manage-page .cl-coupon-target-radio {
  position: relative;
  box-sizing: border-box;
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
  background: #fff;
  border: 1.5px solid #c9cdd4;
  border-radius: 50%;
  transition: border-color var(--cl-transition-fast, .12s) ease;
}

#cl-shopping-coupon-manage-page .cl-coupon-target-radio::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 8px;
  height: 8px;
  background: var(--cl-green);
  border-radius: 50%;
  opacity: 0;
  transform: translate(-50%, -50%) scale(.6);
  transition: opacity var(--cl-transition-fast, .12s) ease, transform var(--cl-transition-fast, .12s) ease;
}

#cl-shopping-coupon-manage-page .cl-coupon-target-option input:checked + .cl-coupon-target-radio {
  border-color: var(--cl-green);
}

#cl-shopping-coupon-manage-page .cl-coupon-target-option input:checked + .cl-coupon-target-radio::after {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
}

#cl-shopping-coupon-manage-page .cl-coupon-target-option input:focus-visible + .cl-coupon-target-radio {
  border-color: var(--cl-green);
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .13);
}

#cl-shopping-coupon-manage-page .cl-coupon-target-option:has(input:disabled) {
  color: var(--cl-text-muted);
  cursor: default;
}

#cl-shopping-coupon-manage-page .cl-coupon-selected-count {
  color: var(--cl-text-sub);
}

#cl-shopping-coupon-manage-page .cl-coupon-select-all-row {
  display: flex;
  align-items: center;
  min-height: 24px;
  margin: 0 2px 10px;
}

#cl-shopping-coupon-manage-page .cl-coupon-list-checkbox {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin: 0;
  color: var(--cl-text-sub);
  font-size: 13px;
  font-weight: 500;
  line-height: 20px;
  cursor: pointer;
}

#cl-shopping-coupon-manage-page .cl-coupon-list-checkbox input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

#cl-shopping-coupon-manage-page .cl-coupon-list-checkmark {
  position: relative;
  box-sizing: border-box;
  flex: 0 0 16px;
  width: 16px;
  height: 16px;
  background: #fff;
  border: 1px solid #c9cdd4;
  border-radius: 4px;
}

#cl-shopping-coupon-manage-page .cl-coupon-list-checkmark::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 5px;
  width: 4px;
  height: 8px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  opacity: 0;
  transform: rotate(45deg);
}

#cl-shopping-coupon-manage-page .cl-coupon-list-checkbox input:checked + .cl-coupon-list-checkmark {
  background: var(--cl-green);
  border-color: var(--cl-green);
}

#cl-shopping-coupon-manage-page .cl-coupon-list-checkbox input:checked + .cl-coupon-list-checkmark::after {
  opacity: 1;
}

#cl-shopping-coupon-manage-page .cl-coupon-list-checkbox input:focus-visible + .cl-coupon-list-checkmark {
  border-color: var(--cl-green);
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .13);
}

#cl-shopping-coupon-manage-page .cl-coupon-list-checkbox:has(input:disabled) {
  cursor: default;
  opacity: .55;
}

#cl-shopping-coupon-manage-page .coupon-manage-list .cl-coupon-member-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-top: 0 !important;
  overflow: visible !important;
}

#cl-shopping-coupon-manage-page .cl-coupon-member-card {
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 12px;
  transition: box-shadow .12s ease;
}

#cl-shopping-coupon-manage-page .cl-coupon-member-card.is-expanded {
  box-shadow: 0 4px 16px rgba(20, 24, 32, .07);
}

#cl-shopping-coupon-manage-page .cl-coupon-member-head {
  display: flex;
  align-items: center;
  gap: 14px;
  min-height: 62px;
  padding: 12px 18px;
  cursor: pointer;
  transition: background .12s ease;
}

#cl-shopping-coupon-manage-page .cl-coupon-member-head:hover {
  background: var(--cl-bg-2, #fafbfc);
}

#cl-shopping-coupon-manage-page .cl-coupon-member-check {
  flex: none;
}

#cl-shopping-coupon-manage-page .cl-coupon-member-number {
  flex: 0 0 28px;
  width: 28px;
  color: var(--cl-text-muted);
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
  text-align: center;
}

#cl-shopping-coupon-manage-page .cl-coupon-member-identity {
  display: flex;
  flex: 0 0 230px;
  flex-direction: column;
  min-width: 0;
}

#cl-shopping-coupon-manage-page .cl-coupon-member-identity strong,
#cl-shopping-coupon-manage-page .cl-coupon-member-identity span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#cl-shopping-coupon-manage-page .cl-coupon-member-identity strong {
  color: var(--cl-text);
  font-size: 14px;
  font-weight: 700;
  line-height: 20px;
}

#cl-shopping-coupon-manage-page .cl-coupon-member-identity span {
  color: var(--cl-text-sub);
  font-size: 12px;
  line-height: 18px;
}

#cl-shopping-coupon-manage-page .cl-coupon-member-chips {
  display: flex;
  align-items: center;
  flex: 1 1 auto;
  gap: 6px;
  min-width: 0;
  overflow: hidden;
}

#cl-shopping-coupon-manage-page .cl-coupon-member-chips > span {
  flex: 0 1 auto;
  min-width: 0;
  max-width: 210px;
  padding: 4px 9px;
  overflow: hidden;
  background: var(--cl-bg, #f4f5f9);
  border-radius: 6px;
  color: var(--cl-text-sub);
  font-size: 11px;
  font-weight: 600;
  line-height: 16px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#cl-shopping-coupon-manage-page .cl-coupon-member-chips > .is-more {
  flex: none;
  background: var(--cl-green-badge, #e4f7ec);
  color: var(--cl-green-text);
  font-weight: 700;
}

#cl-shopping-coupon-manage-page.cl-dashboard-redesign .cl-coupon-member-actions {
  display: inline-flex;
  align-items: center;
  flex: none;
  gap: 12px;
  margin-left: auto;
}

#cl-shopping-coupon-manage-page .cl-coupon-member-toggle {
  display: inline-flex;
  align-items: center;
  flex: none;
  gap: 8px;
  min-width: 0;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  color: var(--cl-text-muted);
  cursor: pointer;
}

#cl-shopping-coupon-manage-page .cl-coupon-member-toggle:disabled {
  cursor: default;
}

#cl-shopping-coupon-manage-page .cl-coupon-member-toggle:focus-visible {
  border-radius: 6px;
  outline: 3px solid rgba(3, 199, 90, .13);
  outline-offset: 3px;
}

#cl-shopping-coupon-manage-page .cl-coupon-member-badge {
  display: inline-flex;
  align-items: center;
  padding: 4px 11px;
  background: var(--cl-green-badge, #e4f7ec);
  border-radius: 999px;
  font-size: 12px;
  line-height: 16px;
  white-space: nowrap;
}

#cl-shopping-coupon-manage-page .cl-coupon-member-badge b {
  color: var(--cl-green-text);
  font-weight: 700;
}

#cl-shopping-coupon-manage-page .cl-coupon-member-badge span {
  color: var(--cl-text-muted);
  font-weight: 600;
}

#cl-shopping-coupon-manage-page .cl-coupon-member-toggle svg {
  width: 18px;
  height: 18px;
  transition: transform .18s ease;
}

#cl-shopping-coupon-manage-page .cl-coupon-member-toggle[aria-expanded="true"] svg {
  transform: rotate(180deg);
}

#cl-shopping-coupon-manage-page .cl-coupon-member-body {
  background: #fcfcfd;
  border-top: 1px solid var(--cl-border);
}

#cl-shopping-coupon-manage-page .cl-coupon-member-body[hidden],
#cl-shopping-coupon-manage-page .cl-coupon-extra-row[hidden],
#cl-shopping-coupon-manage-page .cl-coupon-member-more-wrap[hidden] {
  display: none !important;
}

#cl-shopping-coupon-manage-page .cl-coupon-member-table-wrap {
  overflow-x: auto;
}

#cl-shopping-coupon-manage-page .cl-coupon-member-table {
  width: 100%;
  min-width: 720px;
  border-collapse: collapse;
  table-layout: fixed;
}

#cl-shopping-coupon-manage-page .cl-coupon-member-table th {
  padding: 10px 18px;
  background: #f7f8fa;
  border-bottom: 1px solid var(--cl-border);
  color: var(--cl-text-muted);
  font-size: 11px;
  font-weight: 600;
  line-height: 18px;
  text-align: left;
  white-space: nowrap;
}

#cl-shopping-coupon-manage-page .cl-coupon-member-table td {
  padding: 11px 18px;
  border-bottom: 1px solid var(--cl-line, #eef0f4);
  color: var(--cl-text);
  font-size: 12.5px;
  font-weight: 400;
  line-height: 20px;
  text-align: left;
  vertical-align: middle;
}

#cl-shopping-coupon-manage-page .cl-coupon-member-table tr:last-child td {
  border-bottom: 0;
}

#cl-shopping-coupon-manage-page .cl-coupon-member-table th:first-child,
#cl-shopping-coupon-manage-page .cl-coupon-member-table td:first-child {
  width: 25%;
}

#cl-shopping-coupon-manage-page .cl-coupon-member-table th:nth-child(2),
#cl-shopping-coupon-manage-page .cl-coupon-member-table td:nth-child(2),
#cl-shopping-coupon-manage-page .cl-coupon-member-table th:nth-child(3),
#cl-shopping-coupon-manage-page .cl-coupon-member-table td:nth-child(3) {
  width: 15%;
}

#cl-shopping-coupon-manage-page .cl-coupon-member-table th:nth-child(4),
#cl-shopping-coupon-manage-page .cl-coupon-member-table td:nth-child(4) {
  width: 14%;
}

#cl-shopping-coupon-manage-page .cl-coupon-name-cell {
  font-weight: 500 !important;
}

#cl-shopping-coupon-manage-page .cl-coupon-content-cell {
  overflow: hidden;
  color: var(--cl-text-sub) !important;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#cl-shopping-coupon-manage-page .cl-coupon-state {
  display: inline-flex;
  align-items: center;
  min-height: 20px;
  padding: 2px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
  line-height: 16px;
  white-space: nowrap;
}

#cl-shopping-coupon-manage-page .cl-coupon-state.is-usable {
  background: var(--cl-green-badge, #e4f7ec);
  color: var(--cl-green-text);
}

#cl-shopping-coupon-manage-page .cl-coupon-state.is-used {
  background: var(--cl-line, #eef0f4);
  color: var(--cl-text-sub);
}

#cl-shopping-coupon-manage-page .cl-coupon-state.is-expired {
  background: var(--cl-danger-soft, #fdecec);
  color: var(--cl-danger, #e5484d);
}

#cl-shopping-coupon-manage-page .cl-coupon-state.is-revoked {
  background: #fff3e6;
  color: #c6791a;
}

#cl-shopping-coupon-manage-page .cl-coupon-member-more-wrap {
  padding: 12px 18px;
  text-align: center;
}

#cl-shopping-coupon-manage-page .cl-coupon-member-show-all {
  height: 36px;
  padding: 0 18px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
  color: var(--cl-text-sub);
  font-family: inherit;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: color .12s ease, background .12s ease, border-color .12s ease;
}

#cl-shopping-coupon-manage-page .cl-coupon-member-show-all:hover,
#cl-shopping-coupon-manage-page .cl-coupon-member-show-all:focus-visible {
  background: var(--cl-green-soft, #f1fbf5);
  border-color: var(--cl-green-line, #b7e7c9);
  color: var(--cl-green-text);
  outline: 0;
}

#cl-shopping-coupon-manage-page .cl-coupon-member-empty {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 10px;
  color: var(--cl-text-sub);
  font-size: 13px;
}

body.cl-coupon-modal-open {
  overflow: hidden;
}

.cl-dashboard-redesign.cl-coupon-issue-overlay {
  position: fixed;
  inset: 0;
  z-index: 1000000;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  box-sizing: border-box;
  width: auto;
  height: 100vh;
  padding: 20px;
  overflow-y: auto;
  background: rgba(20, 24, 32, .45);
}

.cl-dashboard-redesign.cl-coupon-issue-overlay[hidden] {
  display: none !important;
}

.cl-dashboard-redesign.cl-coupon-issue-confirm-overlay {
  z-index: 1000002;
  align-items: center;
}

.cl-dashboard-redesign .cl-coupon-issue-dialog {
  position: relative;
  box-sizing: border-box;
  width: 560px;
  max-width: min(560px, calc(100vw - 40px));
  margin: auto;
  padding: 44px 34px 34px;
  background: var(--cl-surface, #fff);
  border-radius: 14px;
  box-shadow: 0 20px 50px rgba(20, 24, 32, .25);
}

.cl-dashboard-redesign .cl-coupon-issue-confirm-dialog {
  width: 440px;
  max-width: min(440px, calc(100vw - 40px));
  padding-right: 28px;
  padding-left: 28px;
  text-align: center;
}

.cl-dashboard-redesign .cl-coupon-issue-dialog h2 {
  margin: 0 0 22px;
  color: var(--cl-text);
  font-size: 20px;
  font-weight: 700;
  line-height: 26px;
  text-align: center;
}

.cl-dashboard-redesign .cl-coupon-modal-close {
  position: absolute;
  top: 16px;
  right: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 8px;
  color: var(--cl-text-sub);
  cursor: pointer;
  transition: color .12s ease, background .12s ease, transform .18s cubic-bezier(.34, 1.56, .64, 1);
}

.cl-dashboard-redesign .cl-coupon-modal-close svg {
  display: block;
  width: 15px;
  height: 15px;
}

.cl-dashboard-redesign .cl-coupon-modal-close:hover,
.cl-dashboard-redesign .cl-coupon-modal-close:focus-visible {
  background: var(--cl-bg-3, #f1f2f5);
  color: var(--cl-text);
  outline: 0;
  transform: rotate(90deg);
}

.cl-dashboard-redesign .cl-coupon-issue-search {
  position: relative;
  display: flex;
  align-items: center;
  height: 40px;
  margin-bottom: 12px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
  transition: border-color .12s ease, box-shadow .12s ease;
}

.cl-dashboard-redesign .cl-coupon-issue-search:focus-within {
  border-color: var(--cl-green);
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .13);
}

.cl-dashboard-redesign .cl-coupon-issue-search svg {
  flex: 0 0 16px;
  width: 16px;
  height: 16px;
  margin-left: 13px;
  color: var(--cl-text-sub);
}

.cl-dashboard-redesign .cl-coupon-issue-search input {
  flex: 1 1 auto;
  width: 100%;
  height: 38px;
  padding: 0 13px 0 9px;
  background: transparent;
  border: 0;
  box-shadow: none;
  color: var(--cl-text);
  font: inherit;
  font-size: 13.5px;
  outline: 0;
}

.cl-dashboard-redesign .cl-coupon-issue-search input::placeholder,
.cl-dashboard-redesign .cl-coupon-issue-content::placeholder {
  color: var(--cl-text-muted);
}

.cl-dashboard-redesign .cl-coupon-issue-count {
  margin: 0 2px 8px;
  color: var(--cl-text-muted);
  font-size: 12px;
  line-height: 18px;
}

.cl-dashboard-redesign .cl-coupon-issue-count b {
  color: var(--cl-green-text);
  font-weight: 600;
}

.cl-dashboard-redesign .cl-coupon-issue-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  max-height: min(280px, 38vh);
  margin-bottom: 16px;
  padding-right: 4px;
  overflow-y: auto;
  scrollbar-width: thin;
}

.cl-dashboard-redesign .cl-coupon-issue-item {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 10px;
  box-sizing: border-box;
  padding: 13px 14px;
  margin: 0;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 10px;
  cursor: pointer;
  transition: background .12s ease, border-color .12s ease, box-shadow .12s ease;
}

.cl-dashboard-redesign .cl-coupon-issue-item:hover {
  border-color: var(--cl-border-hover, #d5d9e0);
}

.cl-dashboard-redesign .cl-coupon-issue-item.is-selected {
  background: var(--cl-green-soft, #f1fbf5);
  border-color: var(--cl-green-line, #b7e7c9);
  box-shadow: inset 0 0 0 1px var(--cl-green-line, #b7e7c9);
}

.cl-dashboard-redesign .cl-coupon-issue-item.is-disabled {
  background: var(--cl-bg-2, #fafbfc);
  cursor: default;
  opacity: .55;
}

.cl-dashboard-redesign .cl-coupon-issue-item > input,
.cl-dashboard-redesign .cl-coupon-duplicate-option > input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.cl-dashboard-redesign .cl-coupon-checkbox {
  position: relative;
  box-sizing: border-box;
  flex: 0 0 16px;
  width: 16px;
  height: 16px;
  margin-top: 1px;
  background: #fff;
  border: 1.5px solid #c9cdd4;
  border-radius: 4px;
}

.cl-dashboard-redesign .cl-coupon-checkbox::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 5px;
  width: 4px;
  height: 8px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  opacity: 0;
  transform: rotate(45deg);
}

.cl-dashboard-redesign .cl-coupon-issue-item > input:checked + .cl-coupon-checkbox,
.cl-dashboard-redesign .cl-coupon-duplicate-option > input:checked + .cl-coupon-checkbox {
  background: var(--cl-green);
  border-color: var(--cl-green);
}

.cl-dashboard-redesign .cl-coupon-issue-item > input:checked + .cl-coupon-checkbox::after,
.cl-dashboard-redesign .cl-coupon-duplicate-option > input:checked + .cl-coupon-checkbox::after {
  opacity: 1;
}

.cl-dashboard-redesign .cl-coupon-issue-item:has(input:focus-visible),
.cl-dashboard-redesign .cl-coupon-duplicate-option:has(input:focus-visible) .cl-coupon-checkbox {
  border-color: var(--cl-green);
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .13);
}

.cl-dashboard-redesign .cl-coupon-issue-item-body {
  display: block;
  flex: 1 1 auto;
  min-width: 0;
}

.cl-dashboard-redesign .cl-coupon-issue-item-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.cl-dashboard-redesign .cl-coupon-issue-item-head strong {
  overflow: hidden;
  color: var(--cl-text);
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cl-dashboard-redesign .cl-coupon-issue-item-head > span {
  flex: none;
  color: var(--cl-text-sub);
  font-size: 11px;
  font-weight: 500;
}

.cl-dashboard-redesign .cl-coupon-issue-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 9px;
}

.cl-dashboard-redesign .cl-coupon-issue-chips > span {
  padding: 3px 8px;
  background: var(--cl-bg, #f4f5f9);
  border-radius: 6px;
  color: var(--cl-text-sub);
  font-size: 11px;
  font-weight: 600;
  line-height: 16px;
}

.cl-dashboard-redesign .cl-coupon-issue-empty {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100px;
  color: var(--cl-text-sub);
  font-size: 13px;
}

.cl-dashboard-redesign .cl-coupon-duplicate-row {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 5px;
  margin: 0 0 16px;
}

.cl-dashboard-redesign .cl-coupon-duplicate-option {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin: 0;
  color: var(--cl-text);
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
}

.cl-dashboard-redesign .cl-coupon-help-wrap {
  position: relative;
  display: inline-flex;
  align-items: center;
}

.cl-dashboard-redesign .cl-coupon-help {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  color: var(--cl-green);
  cursor: pointer;
}

.cl-dashboard-redesign .cl-coupon-help svg {
  display: block;
  width: 16px;
  height: 16px;
}

.cl-dashboard-redesign .cl-coupon-help-tooltip {
  position: absolute;
  right: -8px;
  bottom: calc(100% + 9px);
  z-index: 5;
  box-sizing: border-box;
  width: max-content;
  max-width: 240px;
  padding: 8px 10px;
  background: var(--cl-surface, #fff);
  border: 1px solid var(--cl-border, #e5e7eb);
  border-radius: 8px;
  box-shadow: 0 8px 22px rgba(20, 24, 32, .14);
  color: var(--cl-text-sub, #8a8f98);
  font-size: 12px;
  font-weight: 500;
  line-height: 1.5;
  text-align: left;
  word-break: keep-all;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(3px);
  transition: opacity .12s ease, visibility .12s ease, transform .18s cubic-bezier(.4, 0, .2, 1);
}

.cl-dashboard-redesign .cl-coupon-help-tooltip::after {
  content: "";
  position: absolute;
  right: 10px;
  bottom: -5px;
  box-sizing: border-box;
  width: 9px;
  height: 9px;
  background: var(--cl-surface, #fff);
  border-right: 1px solid var(--cl-border, #e5e7eb);
  border-bottom: 1px solid var(--cl-border, #e5e7eb);
  transform: rotate(45deg);
}

.cl-dashboard-redesign .cl-coupon-help-wrap:hover .cl-coupon-help-tooltip {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.cl-dashboard-redesign .cl-coupon-issue-content {
  box-sizing: border-box;
  width: 100%;
  height: 40px;
  padding: 0 13px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
  color: var(--cl-text);
  font: inherit;
  font-size: 13.5px;
  outline: 0;
  transition: border-color .12s ease, box-shadow .12s ease;
}

.cl-dashboard-redesign .cl-coupon-issue-content:focus {
  border-color: var(--cl-green);
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .13);
}

.cl-dashboard-redesign .cl-coupon-issue-summary {
  margin: 22px 0 0;
  color: var(--cl-text-sub);
  font-size: 13.5px;
  line-height: 24px;
  text-align: center;
}

.cl-dashboard-redesign .cl-coupon-issue-summary b,
.cl-dashboard-redesign .cl-coupon-confirm-message b {
  color: var(--cl-green-text);
  font-weight: 700;
}

.cl-dashboard-redesign .cl-coupon-issue-except {
  margin: 6px 0 0;
  color: var(--cl-text-muted);
  font-size: 12px;
  line-height: 20px;
  text-align: center;
}

.cl-dashboard-redesign .cl-coupon-issue-error {
  margin: 14px 0 0;
  color: var(--cl-danger, #e5484d);
  font-size: 13px;
  font-weight: 600;
  line-height: 20px;
  text-align: center;
}

.cl-dashboard-redesign .cl-coupon-issue-error[hidden] {
  display: none;
}

.cl-dashboard-redesign .cl-coupon-issue-actions {
  display: flex;
  flex-direction: column;
  gap: 14px;
  width: 100%;
  margin-top: 30px;
}

.cl-dashboard-redesign .cl-coupon-issue-actions button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 46px;
  margin: 0;
  padding: 0 16px;
  border-radius: 8px;
  font-family: inherit;
  cursor: pointer;
}

.cl-dashboard-redesign .cl-coupon-issue-primary,
.cl-dashboard-redesign .cl-coupon-confirm-primary {
  background: var(--cl-green);
  border: 1px solid var(--cl-green);
  color: #fff;
  font-size: 15px;
  font-weight: 700;
}

.cl-dashboard-redesign .cl-coupon-issue-primary:hover,
.cl-dashboard-redesign .cl-coupon-issue-primary:focus-visible,
.cl-dashboard-redesign .cl-coupon-confirm-primary:hover,
.cl-dashboard-redesign .cl-coupon-confirm-primary:focus-visible {
  background: var(--cl-green-hover, #02b351);
  border-color: var(--cl-green-hover, #02b351);
  outline: 0;
}

.cl-dashboard-redesign .cl-coupon-issue-primary:disabled,
.cl-dashboard-redesign .cl-coupon-confirm-primary:disabled {
  background: var(--cl-bg-3, #f1f2f5);
  border-color: var(--cl-bg-3, #f1f2f5);
  color: var(--cl-text-muted);
  cursor: default;
}

.cl-dashboard-redesign .cl-coupon-issue-cancel {
  background: transparent;
  border: 0;
  color: var(--cl-text-sub);
  font-size: 13.5px;
  font-weight: 600;
}

.cl-dashboard-redesign .cl-coupon-issue-cancel:hover,
.cl-dashboard-redesign .cl-coupon-issue-cancel:focus-visible {
  background: var(--cl-green-soft, #f1fbf5);
  color: var(--cl-green-text);
  outline: 0;
}

.cl-dashboard-redesign .cl-coupon-confirm-message {
  margin: 4px 0 2px;
  color: var(--cl-text-sub);
  font-size: 14px;
  line-height: 24px;
  text-align: center;
}

/* 발급·회수 모달은 카드 안의 리디자인 X 버튼만 사용한다. */
.cl-dashboard-redesign.cl-source-coupon-manage-wrap .modal-default > .cl-mobile-btn.close {
  display: none;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-cmmodal.coupon-manage-modal) {
  position: fixed !important;
  inset: 0 !important;
  z-index: 999999 !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
  width: 100vw !important;
  height: 100vh !important;
  padding: 6vh 16px 40px !important;
  overflow: auto !important;
  background: rgba(0, 0, 0, .45) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-cmmodal.coupon-manage-modal) + .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-cmmodal.coupon-manage-modal) + .modal-backdrop.fade,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-cmmodal.coupon-manage-modal) + .modal-backdrop.in {
  display: none !important;
  opacity: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default:has(.modal-dialog.cl-cmmodal.coupon-manage-modal) {
  position: static !important;
  inset: auto !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
  width: 100% !important;
  height: auto !important;
  min-height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal {
  width: 430px !important;
  max-width: min(94vw, 430px) !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .modal-content {
  box-sizing: border-box;
  position: relative;
  overflow: visible !important;
  padding: 32px 34px 28px !important;
  background: #fff !important;
  border: 0 !important;
  border-radius: 14px !important;
  box-shadow: 0 24px 64px rgba(0, 0, 0, .28) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .modal-header {
  padding: 0 !important;
  border: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .modal-body {
  width: 362px !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .modal-title {
  margin: 0 0 24px !important;
  color: var(--cl-text) !important;
  font-size: 20px !important;
  font-weight: 800 !important;
  line-height: 26px !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .modal-content > .close.close-button-dialog {
  position: absolute !important;
  top: 20px !important;
  right: 22px !important;
  z-index: 2 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub) !important;
  opacity: 1 !important;
  transition: background .18s ease, color .18s ease, transform .24s cubic-bezier(.2, .8, .2, 1) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .modal-content > .close.close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .modal-content > .close.close-button-dialog:focus {
  background: #f1f2f5 !important;
  color: var(--cl-text) !important;
  transform: rotate(90deg) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .modal-content > .close.close-button-dialog svg {
  display: block !important;
  width: 9px !important;
  height: 9px !important;
  fill: currentColor !important;
  stroke: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .coupon-manage-guide {
  margin: -8px 0 30px !important;
  color: var(--cl-text-muted) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 22px !important;
  text-align: center !important;
  word-break: keep-all;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .coupon-keyword-box,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .coupon-content {
  width: 100% !important;
  max-width: none !important;
  margin-right: 0 !important;
  margin-left: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .coupon-keyword-box {
  box-sizing: border-box;
  display: flex !important;
  align-items: center !important;
  height: 42px !important;
  margin-bottom: 14px !important;
  padding: 0 40px 0 14px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .coupon-keyword-box input {
  width: 100% !important;
  height: 40px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--cl-text) !important;
  font-size: 14px !important;
  line-height: 40px !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .coupon-keyword-box input::placeholder {
  color: var(--cl-text-muted) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .coupon-keyword-box svg {
  right: 14px !important;
  width: 16px !important;
  height: 16px !important;
  color: var(--cl-text) !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .coupon-list,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .coupon-list-none {
  box-sizing: border-box;
  width: 100% !important;
  max-width: none !important;
  margin: 0 auto !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .coupon-list {
  height: auto !important;
  max-height: 260px !important;
  overflow-y: auto !important;
  scrollbar-width: thin;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .coupon-list-none {
  min-height: 120px !important;
  align-items: center;
  justify-content: center;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  line-height: 18px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .coupon-list-none[style*="display: none"] {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .coupon-list-none[style*="display: block"] {
  display: flex !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .coupon-list .coupon-row:not(.hide) {
  display: flex !important;
  align-items: flex-start !important;
  padding: 16px 18px !important;
  gap: 12px !important;
  background: #fff !important;
  border-bottom: 1px solid #f0f1f4 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .coupon-list .coupon-row:last-child {
  border-bottom: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .coupon-list .coupon-row.disabled {
  background: #f7f8fa !important;
  opacity: .58 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .coupon-list .coupon-row .newcheckbox,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .coupon-list .coupon-row .newcheckbox label {
  display: inline-flex !important;
  align-items: center !important;
  width: 16px !important;
  height: 16px !important;
  margin: 1px 0 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .coupon-list .coupon-row .newcheckboxSvg {
  position: relative !important;
  display: inline-flex !important;
  flex: 0 0 16px !important;
  width: 16px !important;
  height: 16px !important;
  margin: 0 !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .coupon-list .coupon-row .newcheckboxSvg > svg {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .coupon-list .coupon-row .newcheckboxSvg > input {
  position: absolute !important;
  inset: 0 !important;
  z-index: 2;
  width: 16px !important;
  height: 16px !important;
  margin: 0 !important;
  cursor: pointer;
  opacity: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .coupon-list .coupon-row .newcheckboxSvg::before {
  content: "";
  position: absolute;
  inset: 0;
  box-sizing: border-box;
  background: #fff;
  border: 1.5px solid #c9cdd4;
  border-radius: 4px;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .coupon-list .coupon-row .newcheckboxSvg::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 5px;
  width: 5px;
  height: 8px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  opacity: 0;
  transform: rotate(45deg);
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .coupon-list .coupon-row .newcheckboxSvg:has(input:checked)::before {
  background: var(--cl-green);
  border-color: var(--cl-green);
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .coupon-list .coupon-row .newcheckboxSvg:has(input:checked)::after {
  opacity: 1;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .coupon-list .coupon-row .coupon-info {
  min-width: 0;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .coupon-list .coupon-row .coupon-name {
  color: var(--cl-text) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 20px !important;
  word-break: break-word;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .coupon-list .coupon-row .coupon-desc {
  margin-top: 9px !important;
  color: var(--cl-text-muted) !important;
  font-size: 12.5px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .coupon-content {
  margin-top: 14px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .coupon-content .cl-common-form-wrap {
  float: none !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .coupon-content .cl-common-form-group {
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center !important;
  height: 42px !important;
  padding: 0 14px !important;
  float: none !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .coupon-content .cl-common-form-group input {
  display: block !important;
  flex: 1 1 auto;
  width: 100% !important;
  height: 20px !important;
  min-height: 20px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--cl-text) !important;
  font-size: 14px !important;
  line-height: 20px !important;
  outline: 0 !important;
  vertical-align: middle !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .coupon-content .cl-common-form-group input::placeholder {
  color: var(--cl-text-muted) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .info-str {
  margin: 18px 0 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  line-height: 20px !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .info-str .oper-p .coupon-title {
  color: var(--cl-green-text) !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .info-str .oper-c .coupon-title {
  color: #ee445f !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .modal-footer {
  display: flex !important;
  flex-direction: column;
  width: 362px !important;
  max-width: 100% !important;
  margin: 40px auto 0 !important;
  padding: 0 !important;
  border: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .modal-footer .btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 46px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 46px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .modal-footer .btn-primary,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .modal-footer .ok-button-dialog {
  background: var(--cl-green) !important;
  border: 1px solid var(--cl-green) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .modal-footer .btn-primary:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .modal-footer .btn-primary:focus,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .modal-footer .ok-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .modal-footer .ok-button-dialog:focus {
  background: var(--cl-green-hover) !important;
  border-color: var(--cl-green-hover) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .modal-footer .close-button-dialog {
  height: 44px !important;
  margin-top: 14px !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 9px !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  line-height: 44px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .modal-footer .close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .modal-footer .close-button-dialog:focus {
  background: #eaf9f0 !important;
  color: var(--cl-green-text) !important;
}

@media (max-width: 1024px) {
  :is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .filter-box {
    justify-content: flex-start;
    margin-left: 0 !important;
  }

  #cl-shopping-coupon-manage-page .coupon-manage-list .top-area {
    align-items: flex-start;
    flex-wrap: wrap;
  }

  #cl-shopping-coupon-manage-page .coupon-manage-list .filter-box {
    width: 100% !important;
  }

  #cl-shopping-coupon-manage-page .cl-coupon-member-identity {
    flex-basis: 190px;
  }
}

@media (max-width: 900px) {
  #cl-shopping-coupon-manage-page .cl-coupon-member-chips {
    display: none;
  }

  #cl-shopping-coupon-manage-page .cl-coupon-member-identity {
    flex: 1 1 auto;
  }
}

@media (max-width: 600px) {
  #cl-shopping-coupon-manage-page .cl-coupon-target-scope {
    flex-wrap: wrap;
    gap: 12px 20px;
  }

  .cl-dashboard-redesign.cl-coupon-issue-overlay {
    padding: 12px;
  }

  .cl-dashboard-redesign .cl-coupon-issue-dialog,
  .cl-dashboard-redesign .cl-coupon-issue-confirm-dialog {
    max-width: calc(100vw - 24px);
    padding: 38px 20px 24px;
  }

  .cl-dashboard-redesign .cl-coupon-issue-list {
    max-height: min(240px, 34vh);
  }

  #cl-shopping-coupon-manage-page .cl-coupon-member-head {
    flex-wrap: wrap;
    gap: 9px;
    padding: 12px;
  }

  #cl-shopping-coupon-manage-page.cl-dashboard-redesign .cl-coupon-member-actions {
    flex: 1 0 100%;
    justify-content: flex-end;
  }

  #cl-shopping-coupon-manage-page.cl-dashboard-redesign .cl-coupon-member-actions .btn-collect,
  #cl-shopping-coupon-manage-page.cl-dashboard-redesign .cl-coupon-member-actions .cl-coupon-member-toggle {
    min-height: 44px;
  }

  #cl-shopping-coupon-manage-page .cl-coupon-member-number {
    flex-basis: 20px;
    width: 20px;
    font-size: 12px;
  }

  #cl-shopping-coupon-manage-page .cl-coupon-member-badge {
    padding: 4px 8px;
  }

  #cl-shopping-coupon-manage-page .cl-coupon-member-badge span {
    display: none;
  }

  #cl-shopping-coupon-manage-page .cl-coupon-member-toggle {
    gap: 4px;
  }

  #cl-shopping-coupon-manage-page .cl-coupon-member-table th,
  #cl-shopping-coupon-manage-page .cl-coupon-member-table td {
    padding-right: 14px;
    padding-left: 14px;
  }

  .cl-dashboard-redesign .cl-coupon-issue-item-head {
    align-items: flex-start;
    flex-direction: column;
    gap: 3px;
  }
}

@media (min-width: 769px) and (max-width: 994px) {
  :is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .top-area > div:first-child {
    display: grid !important;
    grid-template-columns: 74px minmax(0, 1fr);
    gap: 10px 14px;
  }

  :is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .top-area > div:first-child > div:first-child {
    grid-row: 1 / span 2;
  }

  :is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .duration-box,
  :is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .date-box {
    grid-column: 2;
    width: 100%;
  }

  :is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .duration-box {
    margin-right: 0;
    overflow: visible;
  }

  :is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .date-box .date-input-box,
  :is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .cl-source-date-trigger {
    width: 100% !important;
    min-width: 0;
  }
}

@media (min-width: 769px) and (max-width: 900px) {
  :is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) {
    margin-left: var(--cl-source-app-gutter) !important;
  }
}

@media (max-width: 768px) {
  :is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) {
    margin-left: var(--cl-source-app-gutter) !important;
    padding: 20px 16px 40px !important;
  }

  :is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .cl-source-coupon-card {
    padding: 18px 16px 22px !important;
  }

  #cl-shopping-coupon-setting-page .coupon-setting-desc-box .left-box {
    padding-right: 18px !important;
  }

  #cl-shopping-coupon-setting-page .cl-source-coupon-pagehead {
    align-items: flex-start;
  }

  #cl-shopping-coupon-setting-page .coupon-setting-info-box:not(.cl-source-coupon-usage),
  :is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .top-area > div {
    display: block !important;
  }

  #cl-shopping-coupon-setting-page .coupon-setting-info-box:not(.cl-source-coupon-usage) .setting-sub-title,
  :is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .top-area > div > div:first-child,
  #cl-shopping-coupon-setting-page .top-area .setting-sub-title {
    width: auto !important;
    margin-bottom: 10px !important;
    padding-top: 0 !important;
  }

  :is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .duration-box,
  :is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .date-box,
  #cl-shopping-coupon-setting-page .checkbox-condition-box-container,
  #cl-shopping-coupon-history-page .duration-cond,
  #cl-shopping-coupon-history-page .top-area .checkbox-container ul,
  #cl-shopping-coupon-manage-page .coupon-manage-list .top-area {
    width: 100%;
  }

  :is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .duration-box .duration {
    flex: 0 0 auto;
    min-width: 58px !important;
    white-space: nowrap;
  }

  :is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .date-box {
    flex-wrap: wrap;
    height: auto;
  }

  :is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .date-box .date-input-box {
    flex: 1 1 100%;
    min-width: 210px;
  }

  :is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .cl-source-date-trigger {
    width: 100%;
    min-width: 0;
  }

  :is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .keyword-box,
  #cl-shopping-coupon-manage-page .coupon-manage-list .keyword-box {
    width: 100% !important;
  }

  #cl-shopping-coupon-setting-page .cl-source-coupon-result-head {
    align-items: flex-start;
    flex-wrap: wrap;
  }

  #cl-shopping-coupon-setting-page .cl-source-coupon-result-head .search-result-box,
  #cl-shopping-coupon-setting-page .cl-source-coupon-result-head .filter-box {
    flex-basis: 100%;
  }
}

/* Shopping inquiry/review page */
#cl-shopping-inquiry-page {
  width: auto;
  max-width: none;
  margin-top: 0;
  margin-right: var(--cl-source-app-gutter);
  margin-left: calc(var(--cl-source-app-gutter) + var(--cl-source-sidebar-w));
  padding: 28px 32px 60px;
  background: transparent;
  color: var(--cl-text);
}

#cl-shopping-inquiry-page,
#cl-shopping-inquiry-page * {
  box-sizing: border-box;
}

#cl-shopping-inquiry-page > .cl-source-shopping-inquiry-shell,
#cl-shopping-inquiry-page .cl-source-inquiry-content,
#cl-shopping-inquiry-page .dashbottom-wrap,
#cl-shopping-inquiry-page .dashbottom-container {
  float: none !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 0;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent;
  border: 0;
  box-shadow: none;
}

#cl-shopping-inquiry-page .dashbottom-container {
  display: block;
  position: relative;
}

#cl-shopping-inquiry-page .cl-source-inquiry-panel > .dashbottom-wrap,
#cl-shopping-inquiry-page .cl-source-inquiry-panel > .dashbottom-wrap > .dashbottom-container {
  width: 100% !important;
  max-width: none !important;
  margin-right: 0 !important;
  margin-left: 0 !important;
  transform: none !important;
}

#cl-shopping-inquiry-page .mobile-title {
  display: none !important;
}

#cl-shopping-inquiry-page .cl-source-inquiry-head {
  margin: 0 0 18px;
}

#cl-shopping-inquiry-page .cl-source-inquiry-breadcrumb {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  color: var(--cl-text);
  font-size: 20px;
  font-weight: 700;
  line-height: 1.35;
}

#cl-shopping-inquiry-page .cl-source-inquiry-breadcrumb .sep {
  color: var(--cl-text-muted);
  font-size: 23px;
  font-weight: 400;
  line-height: 1;
}

#cl-shopping-inquiry-page .cl-source-inquiry-breadcrumb .current {
  color: var(--cl-text-sub);
  font-weight: 700;
}

#cl-shopping-inquiry-page .cl-source-inquiry-desc {
  margin: 10px 0 0;
  color: var(--cl-text-sub);
  font-size: 13px;
  font-weight: 400;
  line-height: 1.45;
}

#cl-shopping-inquiry-page .cl-source-inquiry-panel {
  position: relative;
  overflow: visible;
  width: 100%;
  min-height: 420px;
  padding: 0 24px 28px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 14px;
  box-shadow: 0 2px 6px rgba(24, 39, 75, .04);
}

#cl-shopping-inquiry-page #section-top-menu {
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  overflow: visible;
  overflow-x: visible;
}

#cl-shopping-inquiry-page #section-top-menu .new-nav-container {
  display: flex;
  float: none !important;
  align-items: flex-end;
  justify-content: space-between;
  width: 100% !important;
  max-width: none !important;
  height: auto;
  margin: 0 !important;
  padding: 6px 0 0;
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--cl-border);
  box-shadow: none;
  overflow: visible;
  overflow-x: visible;
  overflow-y: visible;
}

#cl-shopping-inquiry-page #section-top-menu .sub-navbar {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 2px;
  float: none;
  min-width: 0;
  margin: 0;
  padding: 0;
  list-style: none;
  overflow: visible;
}

#cl-shopping-inquiry-page #section-top-menu .new-nav-container > .sub-navbar:first-child {
  margin-right: auto !important;
}

#cl-shopping-inquiry-page #section-top-menu .new-nav-container > .cl-source-inquiry-top-right {
  margin-left: auto;
}

#cl-shopping-inquiry-page #section-top-menu .sub-navbar.f-right {
  display: none;
}

#cl-shopping-inquiry-page #section-top-menu .sub-navbar li {
  flex: 0 0 auto;
  float: none;
  min-width: 0;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
}

#cl-shopping-inquiry-page #section-top-menu .sub-navbar a {
  display: inline-flex;
  align-items: center;
  height: auto;
  margin: 0 0 -1px;
  padding: 14px 20px;
  background: transparent;
  border: 0;
  border-bottom: 2px solid transparent;
  color: var(--cl-text-sub);
  font-size: 15px;
  font-weight: 700;
  line-height: 20px;
  text-decoration: none;
  white-space: nowrap;
  transition: color .12s, border-color .12s;
}

#cl-shopping-inquiry-page #section-top-menu .sub-navbar a:hover {
  color: var(--cl-text);
}

#cl-shopping-inquiry-page #section-top-menu .sub-navbar li.active a {
  color: var(--cl-green-text);
  border-bottom-color: var(--cl-green);
}

#cl-shopping-inquiry-page #section-top-menu .subnav-title {
  color: inherit;
  font: inherit;
  line-height: inherit;
}

#cl-shopping-inquiry-page .cl-source-inquiry-top-right {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  align-self: center;
  gap: 18px;
  margin-left: auto;
}

#cl-shopping-inquiry-page .submenu_navWrap {
  position: relative !important;
  z-index: auto;
  display: block;
  width: 100% !important;
  max-width: none !important;
  height: auto;
  left: auto;
  transform: none;
  margin: 0 !important;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

#cl-shopping-inquiry-page .submenu_nav.qnaReview {
  display: flex;
  align-items: flex-end;
  justify-content: flex-start;
  gap: 12px;
  width: 100%;
  height: auto;
  margin: 0;
  padding: 6px 0 0;
  overflow: visible;
  background: transparent;
  border-top: 0;
  border-right: 0;
  border-bottom: 1px solid var(--cl-border);
  border-left: 0;
  border-radius: 0;
  box-shadow: none;
}

#cl-shopping-inquiry-page .submenu_nav.qnaReview ul {
  display: flex;
  align-items: center;
  gap: 24px;
  flex: 0 0 auto;
  flex-wrap: wrap;
  margin: 0;
  padding: 0;
  list-style: none;
  overflow: visible;
  overflow-x: visible;
}

#cl-shopping-inquiry-page .submenu_nav.qnaReview li {
  flex: 0 0 auto;
  float: none;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

#cl-shopping-inquiry-page .submenu_nav.qnaReview .sub-menu {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  height: auto;
  min-width: 0;
  margin: 0 0 -1px;
  padding: 16px 0 14px;
  color: var(--cl-text-sub);
  border: 0;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  background: transparent;
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
  white-space: nowrap;
  text-decoration: none;
  transition: color .12s, border-color .12s;
}

#cl-shopping-inquiry-page .submenu_nav.qnaReview .sub-menu:hover {
  color: var(--cl-text);
}

#cl-shopping-inquiry-page .submenu_nav.qnaReview .sub-menu.active {
  color: var(--cl-green-text);
  border-bottom-color: var(--cl-green);
  font-weight: 700;
}

#cl-shopping-inquiry-page .submenu_nav.qnaReview .sub-menu span {
  display: inline;
  min-width: 0;
  height: auto;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  color: inherit;
  font-size: inherit;
  font-weight: 800;
  line-height: inherit;
}

#cl-shopping-inquiry-page .btn-naverpay-sync {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  flex: none;
  height: 32px;
  margin: 0;
  padding: 0 12px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  color: var(--cl-text-sub);
  font-size: 12.5px;
  font-weight: 600;
  line-height: 30px;
  box-shadow: none;
}

#cl-shopping-inquiry-page .btn-naverpay-sync-mobile {
  display: none !important;
}

#cl-shopping-inquiry-page .cl-source-inquiry-top-right .btn-naverpay-sync,
#cl-shopping-inquiry-page .cl-source-inquiry-top-right .btn-naverpay-sync.shopping_disabled,
#cl-shopping-inquiry-page .cl-source-inquiry-top-right .btn-naverpay-sync.ss_user_noActive,
#cl-shopping-inquiry-page .cl-source-inquiry-top-right .btn-naverpay-sync:hover,
#cl-shopping-inquiry-page .cl-source-inquiry-top-right .btn-naverpay-sync.shopping_disabled:hover,
#cl-shopping-inquiry-page .cl-source-inquiry-top-right .btn-naverpay-sync.ss_user_noActive:hover {
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  color: var(--cl-text-sub) !important;
  opacity: 1;
}

#cl-shopping-inquiry-page .cl-source-inquiry-top-right .btn-naverpay-sync:hover,
#cl-shopping-inquiry-page .cl-source-inquiry-top-right .btn-naverpay-sync.shopping_disabled:hover,
#cl-shopping-inquiry-page .cl-source-inquiry-top-right .btn-naverpay-sync.ss_user_noActive:hover {
  background: #fafbfc !important;
  border-color: #d5d9e0 !important;
  color: var(--cl-text) !important;
}

#cl-shopping-inquiry-page .btn-naverpay-sync:hover {
  background: #fafbfc;
  border-color: #d5d9e0;
  color: var(--cl-text);
}

#cl-shopping-inquiry-page .cl-source-inquiry-naver-badge {
  display: inline-flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  border-radius: 3px;
  background: #03c75a;
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  line-height: 16px;
}

#cl-shopping-inquiry-page .btn-naverpay-sync .ico-naverpay {
  flex: none;
  width: 16px;
  height: 16px;
  fill: #03c75a;
}

#cl-shopping-inquiry-page .cl-source-inquiry-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  margin: 18px 0 14px;
  padding: 0;
}

#cl-shopping-inquiry-page .cl-source-inquiry-toolbar-left,
#cl-shopping-inquiry-page .cl-source-inquiry-toolbar-right {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

#cl-shopping-inquiry-page .cl-source-inquiry-toolbar-left:empty {
  display: none;
}

#cl-shopping-inquiry-page .answer-filter {
  position: relative;
  flex: none;
  width: auto;
  height: 34px;
  margin: 0;
  padding: 0;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  box-shadow: none;
}

#cl-shopping-inquiry-page .answer-filter select {
  width: 100%;
  min-width: 96px;
  height: 32px;
  margin: 0;
  padding: 0 28px 0 12px;
  appearance: none;
  background: transparent;
  border: 0;
  color: var(--cl-text-sub);
  font-size: 12.5px;
  font-weight: 600;
  line-height: 32px;
  outline: none;
  cursor: pointer;
}

#cl-shopping-inquiry-page .answer-filter > svg {
  position: absolute;
  top: 50%;
  right: 12px;
  width: 8px;
  height: 4px;
  margin: -2px 0 0;
  pointer-events: none;
  fill: var(--cl-text-sub);
}

body.cl-dashboard-redesign-page #cl-shopping-inquiry-page .answer-filter.cl-source-inquiry-filter {
  height: 35px;
  border: 0;
  background: transparent;
}

body.cl-dashboard-redesign-page #cl-shopping-inquiry-page .cl-source-inquiry-filter > :is(select, svg) {
  display: none;
}

body.cl-dashboard-redesign-page #cl-shopping-inquiry-page .cl-source-inquiry-filter .cl-redesign-select-trigger {
  width: 124px;
  height: 35px;
}

body.cl-dashboard-redesign-page #cl-shopping-inquiry-page .cl-source-inquiry-filter .cl-redesign-select-menu {
  z-index: 20;
  list-style: none;
}

#cl-shopping-inquiry-page .qna-container {
  float: none !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 318px;
  margin: 0 !important;
  padding: 0;
  overflow: visible;
  background: #fff;
  border: 0;
  box-shadow: none;
}

#cl-shopping-inquiry-page .admin-qna-box,
#cl-shopping-inquiry-page .content-payment-box,
#cl-shopping-inquiry-page .qna-parent-box,
#cl-shopping-inquiry-page .review-parent-box {
  width: 100%;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}

#cl-shopping-inquiry-page .qna-header,
#cl-shopping-inquiry-page .review-header,
#cl-shopping-inquiry-page .qna-box,
#cl-shopping-inquiry-page .review-box {
  display: grid;
  align-items: center;
  width: 100%;
  margin: 0;
  padding: 0 !important;
  border-right: 0;
  border-left: 0;
  overflow: visible;
}

/* v2 자동폭 표의 1516px 실측 비율을 유지하고, 좁은 화면에서는 보조 열의 가독성을 확보한다. */
#cl-shopping-inquiry-page .qna-header,
#cl-shopping-inquiry-page .qna-box {
  grid-template-columns: minmax(88px, 11.85%) minmax(0, 1fr) minmax(88px, 9.67%) minmax(112px, 16.66%);
}

#cl-shopping-inquiry-page .review-header,
#cl-shopping-inquiry-page .review-box {
  grid-template-columns: minmax(120px, 21.4%) minmax(0, 1fr) minmax(88px, 12.02%) minmax(112px, 20.71%);
}

#cl-shopping-inquiry-page .qna-header,
#cl-shopping-inquiry-page .review-header {
  background: #f7f8fa;
  border-top: 1px solid var(--cl-border);
  border-bottom: 1px solid var(--cl-border);
}

#cl-shopping-inquiry-page .qna-box,
#cl-shopping-inquiry-page .review-box {
  min-height: 44px;
  border-bottom: 1px solid var(--cl-border);
  cursor: pointer;
  transition: background-color .12s;
}

#cl-shopping-inquiry-page .qna-box:hover,
#cl-shopping-inquiry-page .review-box:hover {
  background: #fafbfc;
}

#cl-shopping-inquiry-page h3.qna-title,
#cl-shopping-inquiry-page .qnaR-contentsBox {
  float: none !important;
  width: auto !important;
  max-width: none;
  min-width: 0;
  margin: 0;
  padding: 12px 8px;
  border: 0;
  background: transparent;
  color: var(--cl-text);
  font-size: 13px;
  font-weight: 400;
  line-height: 18px;
  text-align: center;
  word-break: keep-all;
}

#cl-shopping-inquiry-page .qna-header h3.qna-title,
#cl-shopping-inquiry-page .review-header h3.qna-title {
  color: var(--cl-text-sub);
  font-size: 12.5px;
  font-weight: 600;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page #cl-shopping-inquiry-page .qna-header > .qna-title:nth-child(2) {
  text-align: left;
}

#cl-shopping-inquiry-page .qna-box .qna,
#cl-shopping-inquiry-page .review-box .qna {
  display: flex;
  align-items: center;
  gap: 5px;
  text-align: left;
}

#cl-shopping-inquiry-page .qna-box .qna-title,
#cl-shopping-inquiry-page .review-order-name {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-width: 0;
  color: var(--cl-text);
  font-size: 13px;
  font-weight: 500;
  line-height: 18px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#cl-shopping-inquiry-page .qna-box svg,
#cl-shopping-inquiry-page .review-box svg {
  flex: none;
}

#cl-shopping-inquiry-page .qnaRreply {
  color: var(--cl-green-text);
  font-weight: 600;
}

#cl-shopping-inquiry-page .qnaRreply:not(.qna_Replied):not(.no_answer) {
  color: #D98A3D;
}

#cl-shopping-inquiry-page .qnaRreply.qna_Replied {
  color: var(--cl-green-text);
}

#cl-shopping-inquiry-page .qnaRreply.no_answer {
  color: var(--cl-text-sub);
}

#cl-shopping-inquiry-page .qna-name,
#cl-shopping-inquiry-page .review-name,
#cl-shopping-inquiry-page .qnaRdate {
  color: var(--cl-text);
  font-size: 12.5px;
  font-weight: 400;
}

#cl-shopping-inquiry-page .re_starWrap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 2px;
  color: var(--cl-card-pink, #f4778d);
}

#cl-shopping-inquiry-page .re_starimg {
  display: inline-flex;
  width: 15px;
  height: 15px;
}

#cl-shopping-inquiry-page .re_starimg svg {
  width: 15px;
  height: 15px;
}

#cl-shopping-inquiry-page .re_starimg.star_on svg {
  fill: var(--cl-card-pink, #f4778d);
}

#cl-shopping-inquiry-page .re_starimg.star_off svg {
  fill: #e7eaef;
}

#cl-shopping-inquiry-page .qna_Replied-ico {
  display: inline-flex;
  color: var(--cl-green);
}

#cl-shopping-inquiry-page .qna_Replied-ico svg,
#cl-shopping-inquiry-page .ico-naverpay {
  fill: currentColor;
}

#cl-shopping-inquiry-page .qnaR-contents {
  display: none;
  float: none !important;
  width: 100% !important;
  max-width: none;
  margin: 0;
  padding: 18px 20px 20px;
  background: #fafbfc;
  border-bottom: 1px solid var(--cl-border);
  color: var(--cl-text);
  font-size: 13px;
  line-height: 1.55;
}

#cl-shopping-inquiry-page .qna-title-box,
#cl-shopping-inquiry-page .product-data,
#cl-shopping-inquiry-page .qna-privacy,
#cl-shopping-inquiry-page .answer-content {
  margin: 0 0 14px;
  padding: 14px 16px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
}

#cl-shopping-inquiry-page .qna-title-box .qna-title,
#cl-shopping-inquiry-page .qna-title-box p,
#cl-shopping-inquiry-page .qna-privacy p {
  margin: 0 0 6px;
  color: var(--cl-text-sub);
  font-size: 12.5px;
  line-height: 1.5;
}

#cl-shopping-inquiry-page .qna-title-box p:last-child,
#cl-shopping-inquiry-page .qna-privacy p:last-child {
  margin-bottom: 0;
}

#cl-shopping-inquiry-page .product-data a {
  display: flex;
  align-items: center;
  gap: 12px;
  color: inherit;
  text-decoration: none;
}

#cl-shopping-inquiry-page .product-data img,
#cl-shopping-inquiry-page .empty-img {
  flex: none;
  width: 42px;
  height: 42px;
  overflow: hidden;
  border-radius: 6px;
  background: #e7eaef;
  object-fit: cover;
}

#cl-shopping-inquiry-page .qna-image {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
}

#cl-shopping-inquiry-page .qna-image img {
  display: block;
  width: 72px;
  height: 72px;
  object-fit: cover;
  border-radius: 6px;
  border: 1px solid var(--cl-border);
}

#cl-shopping-inquiry-page .qna-btn-box,
#cl-shopping-inquiry-page .mypage-button {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  margin: 14px 0 0;
}

#cl-shopping-inquiry-page .qna-btn-box button,
#cl-shopping-inquiry-page .mypage-button .btn,
#cl-shopping-inquiry-page .product-url a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  height: 34px;
  margin: 0;
  padding: 0 14px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  color: var(--cl-text);
  font-size: 12.5px;
  font-weight: 600;
  line-height: 32px;
  text-decoration: none;
  box-shadow: none;
  cursor: pointer;
  transition: background-color .12s, border-color .12s, color .12s;
}

#cl-shopping-inquiry-page .qna-btn-box button:hover,
#cl-shopping-inquiry-page .mypage-button .btn:hover,
#cl-shopping-inquiry-page .product-url a:hover {
  background: #fafbfc;
  border-color: #d5d9e0;
}

#cl-shopping-inquiry-page .review-write-btn,
#cl-shopping-inquiry-page .qna-edit-btn {
  background: var(--cl-green) !important;
  border-color: var(--cl-green) !important;
  color: #fff !important;
}

#cl-shopping-inquiry-page .review-write-btn:hover,
#cl-shopping-inquiry-page .qna-edit-btn:hover {
  background: var(--cl-green-hover) !important;
  border-color: var(--cl-green-hover) !important;
  color: #fff !important;
}

#cl-shopping-inquiry-page .review-del-btn,
#cl-shopping-inquiry-page .qna-delete-btn {
  color: #e5484d !important;
}

#cl-shopping-inquiry-page .review-del-btn:hover,
#cl-shopping-inquiry-page .qna-delete-btn:hover {
  background: #fdecee !important;
  border-color: #f5c4c7 !important;
}

#cl-shopping-inquiry-page .answer-title {
  margin: 0 0 8px;
  color: var(--cl-text);
  font-size: 13px;
  font-weight: 700;
}

#cl-shopping-inquiry-page .answer-date {
  margin-left: 8px;
  color: var(--cl-text-sub);
  font-size: 12px;
  font-weight: 400;
}

#cl-shopping-inquiry-page .answer-editor {
  display: none;
  margin-top: 14px;
}

#cl-shopping-inquiry-page .answer-editor textarea {
  display: block;
  float: none;
  width: 100%;
  max-width: 100%;
  margin: 0;
  min-height: 120px;
  padding: 12px 14px;
  resize: vertical;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
  color: var(--cl-text);
  font-size: 13px;
  line-height: 1.5;
  outline: none;
}

#cl-shopping-inquiry-page .answer-editor textarea:focus {
  border-color: var(--cl-green);
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .1);
}

#cl-shopping-inquiry-page .none-qna {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 260px;
  border-bottom: 0;
  color: var(--cl-text-muted);
  font-size: 13px;
  font-weight: 400;
}

#cl-shopping-inquiry-page .search-section {
  position: relative;
  z-index: 90;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  margin: 20px 0 0;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}

#cl-shopping-inquiry-page .search-section > * {
  margin-right: 0 !important;
}

#cl-shopping-inquiry-page .search-section .search-input,
#cl-shopping-inquiry-page .search-section .search-btn {
  height: 34px;
  box-sizing: border-box;
}

#cl-shopping-inquiry-page .search-section .cl-source-inquiry-native-select {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  opacity: 0;
  pointer-events: none;
}

#cl-shopping-inquiry-page .search-section .cl-source-inquiry-search-select {
  z-index: 120;
}

#cl-shopping-inquiry-page .search-section .cl-source-inquiry-search-select .cl-redesign-select-trigger {
  width: auto;
  min-width: 90px;
  height: 34px;
  margin: 0;
  padding: 7px 10px 7px 12px;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 400;
}

#cl-shopping-inquiry-page .search-section .cl-source-inquiry-search-select .cl-redesign-select-menu {
  top: auto;
  bottom: calc(100% + 4px);
  z-index: 200;
  min-width: 120px;
}

#cl-shopping-inquiry-page .search-section .cl-source-inquiry-search-select .cl-redesign-select-arrow {
  width: 14px;
  height: 14px;
}

#cl-shopping-inquiry-page .search-section .search-input {
  width: 280px;
  margin: 0;
  padding: 8px 12px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  color: var(--cl-text);
  font-size: 13px;
  font-weight: 400;
  line-height: 32px;
  outline: none;
}

#cl-shopping-inquiry-page .search-section .search-input::placeholder {
  color: var(--cl-text-muted);
}

#cl-shopping-inquiry-page .search-section .search-input:focus,
#cl-shopping-inquiry-page .search-section .cl-source-inquiry-search-select .cl-redesign-select-trigger:focus {
  border-color: var(--cl-green);
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .1);
}

#cl-shopping-inquiry-page .search-section .search-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  margin: 0;
  padding: 0 20px;
  background: var(--cl-green);
  border: 1px solid var(--cl-green);
  border-radius: 6px;
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  line-height: 32px;
  cursor: pointer;
}

#cl-shopping-inquiry-page .search-section .search-btn:hover,
#cl-shopping-inquiry-page .search-section .search-btn:focus {
  background: var(--cl-green-hover);
  border-color: var(--cl-green-hover);
  color: #fff;
  outline: 0;
}

@media (max-width: 1024px) {
  #cl-shopping-inquiry-page .submenu_nav.qnaReview {
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
  }

  #cl-shopping-inquiry-page .cl-source-inquiry-top-right {
    margin-left: auto;
  }
}

@media (max-width: 768px) {
  #cl-shopping-inquiry-page {
    margin-left: var(--cl-source-app-gutter);
    padding: 20px 16px 40px;
  }

  #cl-shopping-inquiry-page .cl-source-inquiry-panel {
    padding: 0 16px 22px;
  }

  #cl-shopping-inquiry-page .cl-source-inquiry-top-right .btn-naverpay-sync-pc {
    display: inline-flex !important;
  }

  #cl-shopping-inquiry-page #section-top-menu .new-nav-container,
  #cl-shopping-inquiry-page .submenu_nav.qnaReview {
    overflow-x: auto;
    overflow-y: hidden;
    align-items: flex-end;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }

  #cl-shopping-inquiry-page #section-top-menu .new-nav-container::-webkit-scrollbar,
  #cl-shopping-inquiry-page .submenu_nav.qnaReview::-webkit-scrollbar {
    display: none;
    width: 0;
    height: 0;
  }

  #cl-shopping-inquiry-page #section-top-menu .sub-navbar,
  #cl-shopping-inquiry-page .submenu_nav.qnaReview ul {
    flex: none;
    flex-wrap: nowrap;
  }

  #cl-shopping-inquiry-page #section-top-menu .sub-navbar a,
  #cl-shopping-inquiry-page .submenu_nav.qnaReview .sub-menu {
    margin-bottom: 0;
    padding-right: 14px;
    padding-left: 14px;
  }

  #cl-shopping-inquiry-page .qna-container {
    overflow-x: auto;
  }

  #cl-shopping-inquiry-page .qna-header,
  #cl-shopping-inquiry-page .qna-box {
    min-width: 720px;
    grid-template-columns: 116px minmax(220px, 1fr) 126px 126px;
  }

  #cl-shopping-inquiry-page .review-header,
  #cl-shopping-inquiry-page .review-box {
    min-width: 720px;
    grid-template-columns: 132px minmax(220px, 1fr) 126px 126px;
  }

  #cl-shopping-inquiry-page .qnaR-contents {
    min-width: 0;
    max-width: 100%;
    padding: 16px 12px;
    overflow-wrap: anywhere;
  }

  #cl-shopping-inquiry-page .qnaR-contents .qna-title,
  #cl-shopping-inquiry-page .qnaR-contents .product-data a {
    min-width: 0;
    max-width: 100%;
  }

  #cl-shopping-inquiry-page .qnaR-contents .qna-btn-box,
  #cl-shopping-inquiry-page .qnaR-contents .mypage-button {
    flex-wrap: wrap;
  }

  #cl-shopping-inquiry-page .qnaR-contents .qna-btn-box button,
  #cl-shopping-inquiry-page .qnaR-contents .mypage-button .btn {
    flex: 1 1 auto;
    max-width: 100%;
    min-height: 44px;
  }

  #cl-shopping-inquiry-page .search-section {
    justify-content: flex-start;
    flex-wrap: wrap;
    overflow: visible;
  }

  #cl-shopping-inquiry-page .search-section .search-input {
    flex: 1 1 120px;
    min-width: 0;
    width: auto;
  }

  #cl-shopping-inquiry-page .search-section .cl-source-inquiry-search-select,
  #cl-shopping-inquiry-page .search-section .search-btn {
    flex: none;
  }
}

/* 쇼핑설정: 배송을 포함한 모든 탭은 공통 패널 폭을 사용한다. */
#cl-shopping-settings-page {
  --cl-setting-panel-w: 760px;
  width: auto !important;
  max-width: none !important;
  margin-top: 0 !important;
  margin-right: var(--cl-source-app-gutter) !important;
  margin-left: calc(var(--cl-source-app-gutter) + var(--cl-source-sidebar-w)) !important;
  padding: 28px 32px 60px !important;
  background: transparent !important;
  color: var(--cl-text);
}

#cl-shopping-settings-page,
#cl-shopping-settings-page * {
  box-sizing: border-box;
}

#cl-shopping-settings-page .dashbottom-container,
#cl-shopping-settings-page .shopping-dashboard,
#cl-shopping-settings-page .col-md-10 {
  display: block !important;
  float: none !important;
  width: 100% !important;
  max-width: var(--cl-setting-panel-w) !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

#cl-shopping-settings-page .dashbottom-container {
  max-width: none !important;
}

#cl-shopping-settings-page #section-top-menu,
#cl-shopping-settings-page .mobile-title {
  display: none !important;
}

#cl-shopping-settings-page .cl-source-setting-head {
  margin: 0 0 28px;
}

#cl-shopping-settings-page .cl-source-setting-breadcrumb {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  color: var(--cl-text);
  font-size: 20px;
  font-weight: 700;
  line-height: 1.35;
}

#cl-shopping-settings-page .cl-source-setting-breadcrumb .sep {
  color: var(--cl-text-muted);
  font-size: 23px;
  font-weight: 400;
  line-height: 1;
}

#cl-shopping-settings-page .cl-source-setting-breadcrumb .current {
  color: var(--cl-text-sub);
  font-weight: 700;
}

#cl-shopping-settings-page .cl-source-setting-desc {
  margin: 12px 0 0 !important;
  padding: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 18px !important;
}

#cl-shopping-settings-page .submenu_navWrap,
#cl-shopping-settings-page .shopping-dashboard,
#cl-shopping-settings-page .settingBtnSaveWrap {
  width: 100% !important;
  max-width: var(--cl-setting-panel-w) !important;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page .submenu_navWrap {
  position: relative !important;
  inset: auto !important;
  z-index: auto;
  display: block !important;
  height: 51px !important;
  margin: 0 !important;
  padding: 0 24px !important;
  overflow: visible !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-bottom: 0 !important;
  border-radius: var(--cl-radius-lg) var(--cl-radius-lg) 0 0 !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page .submenu_navWrap::before {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 1px;
  background: var(--cl-border);
  content: "";
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page .submenu_navWrap .submenu_nav {
  display: flex !important;
  float: none !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 2px !important;
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page .submenu_navWrap .submenu_nav ul {
  display: flex !important;
  align-items: center;
  flex-wrap: wrap;
  gap: 28px;
  width: auto !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  list-style: none;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page .submenu_navWrap .submenu_nav li {
  float: none !important;
  width: auto !important;
  min-width: 0 !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page .submenu_navWrap .submenu_nav li + li {
  border-left: 0 !important;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page .submenu_navWrap .submenu_nav .sub-menu {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  height: 100% !important;
  min-width: 0;
  margin: 0 !important;
  padding: 14px 2px !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 2px solid transparent !important;
  border-radius: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 20px !important;
  text-decoration: none !important;
  white-space: nowrap;
  position: relative;
  z-index: 1;
  transform: none;
  transition: color .12s, border-color .12s;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page .submenu_navWrap .submenu_nav .sub-menu:hover {
  color: var(--cl-text) !important;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page .submenu_navWrap .submenu_nav .sub-menu.active {
  border-bottom-color: var(--cl-green) !important;
  color: var(--cl-green-text) !important;
  font-weight: 700 !important;
}

#cl-shopping-settings-page .setting-box {
  width: 100% !important;
  max-width: var(--cl-setting-panel-w) !important;
  margin: 0 !important;
  padding: 26px 24px 26px !important;
  overflow: visible !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-top: 0 !important;
  border-radius: 0 0 var(--cl-radius-lg) var(--cl-radius-lg) !important;
  box-shadow: var(--cl-shadow-panel) !important;
}

/* 법적 필수정보는 레거시 float/고정 높이 없이 폼과 저장 영역을 순서대로 배치한다. */
body.cl-dashboard-redesign-page #cl-shopping-settings-page[data-setting-tab="legal"] #pc_setting_form {
  margin: 0;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page[data-setting-tab="legal"] .setting-box {
  float: none;
  height: auto;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page[data-setting-tab="legal"] :is(.setting-sub-content-title, .cl-common-form-group) {
  float: none;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page[data-setting-tab="legal"] .settingBtnSaveWrap {
  position: static;
  float: none;
}

#cl-shopping-settings-page:not([data-setting-tab="delivery"]) .setting-box {
  border-bottom: 0 !important;
  border-radius: 0 !important;
}

#cl-shopping-settings-page .setting-sub-box {
  display: block !important;
  float: none !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

#cl-shopping-settings-page .setting-subInfoBox {
  display: flex !important;
  float: none !important;
  align-items: flex-start;
  gap: 28px;
  width: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 30px 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid #f0f1f4 !important;
  box-shadow: none !important;
}

#cl-shopping-settings-page .setting-subInfoBox:first-child {
  padding-top: 8px !important;
}

#cl-shopping-settings-page .setting-subInfoBox:last-child {
  border-bottom: 0 !important;
}

#cl-shopping-settings-page .setting-subInfoBox:has(input[name="b_no_member"]) {
  border-bottom: 1px solid #f0f1f4 !important;
}

#cl-shopping-settings-page .setting-sub-title {
  display: flex !important;
  float: none !important;
  align-items: center;
  flex: 0 0 170px;
  gap: 6px;
  width: 170px !important;
  max-width: 170px !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 2px 0 0 !important;
  color: var(--cl-text) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 22px !important;
  text-align: left !important;
}

#cl-shopping-settings-page .setting-sub-title.tax-use .cl-tax-state-info-icon {
  position: static !important;
  top: auto !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  flex: 0 0 16px;
  width: 16px !important;
  height: 16px !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-accent-blue) !important;
  fill: var(--cl-accent-blue) !important;
  font-size: 16px !important;
  line-height: 16px !important;
  vertical-align: middle !important;
  transform: none !important;
}

#cl-shopping-settings-page .setting-sub-title.tax-use .cl-tax-state-info-icon path {
  fill: currentColor !important;
}

#cl-shopping-settings-page .setting-sub-content,
#cl-shopping-settings-page .setting-sub-content-box {
  float: none !important;
  flex: 1 1 auto;
  width: auto !important;
  max-width: 580px;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text-sub);
}

#cl-shopping-settings-page .setting-sub-content-box > .setting-sub-content + .setting-sub-content {
  margin-top: 24px !important;
}

#cl-shopping-settings-page .setting-sub-content-title,
#cl-shopping-settings-page .box-sub-content-title,
#cl-shopping-settings-page .mb-5,
#cl-shopping-settings-page .site-code-label,
#cl-shopping-settings-page .site-key-label {
  display: flex;
  align-items: center;
  gap: 5px;
  margin: 0 0 8px !important;
  padding: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 18px !important;
}

#cl-shopping-settings-page .box-sub-content-title {
  justify-content: space-between;
  max-width: 580px;
}

#cl-shopping-settings-page[data-setting-tab="pay"] .setting-sub-content-title,
#cl-shopping-settings-page[data-setting-tab="pay"] .box-sub-content-title,
#cl-shopping-settings-page[data-setting-tab="pay"] .mb-5,
#cl-shopping-settings-page[data-setting-tab="pay"] .site-code-label,
#cl-shopping-settings-page[data-setting-tab="pay"] .site-key-label {
  color: var(--cl-text) !important;
  font-weight: 700 !important;
}

#cl-shopping-settings-page[data-setting-tab="pay"] .pay-card[data-mode="disabled"] > .setting-sub-content-title,
#cl-shopping-settings-page[data-setting-tab="pay"] .pay-escrow[data-mode="disabled"] > .setting-sub-content-title:not(.escrow-check) {
  color: #d1d3d5 !important;
}

#cl-shopping-settings-page .setting-text-box,
#cl-shopping-settings-page .pg-code-input,
#cl-shopping-settings-page .npay-code-input,
#cl-shopping-settings-page .nshopping-input {
  float: none !important;
  width: 100% !important;
  max-width: 460px !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 0 22px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

#cl-shopping-settings-page .cl-common-form-wrap.nonplace-holder {
  float: none !important;
  width: 100% !important;
  max-width: 460px !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

#cl-shopping-settings-page .setting-text-box.cl-common-form-wrap.nonplace-holder,
#cl-shopping-settings-page .pg-code-input.cl-common-form-wrap.nonplace-holder,
#cl-shopping-settings-page .npay-code-input.cl-common-form-wrap.nonplace-holder,
#cl-shopping-settings-page .nshopping-input.cl-common-form-wrap.nonplace-holder {
  margin: 0 !important;
}

#cl-shopping-settings-page .setting-text-box.cl-common-form-wrap.nonplace-holder + .setting-sub-content-title,
#cl-shopping-settings-page .pg-code-input.cl-common-form-wrap.nonplace-holder + .setting-sub-content-title,
#cl-shopping-settings-page .npay-code-input.cl-common-form-wrap.nonplace-holder + .setting-sub-content-title,
#cl-shopping-settings-page .nshopping-input.cl-common-form-wrap.nonplace-holder + .setting-sub-content-title {
  margin-top: 22px !important;
}

#cl-shopping-settings-page .cl-common-form-wrap.nonplace-holder .cl-common-form-group {
  display: flex !important;
  align-items: center;
  width: 100% !important;
  min-height: 44px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
}

#cl-shopping-settings-page .cl-common-form-wrap.nonplace-holder.readOnly .cl-common-form-group,
#cl-shopping-settings-page .cl-common-form-wrap.nonplace-holder.readonly .cl-common-form-group {
  background: #f4f5f9 !important;
}

#cl-shopping-settings-page .cl-common-form-wrap.nonplace-holder input,
#cl-shopping-settings-page .cl-common-form-wrap.nonplace-holder .cl-common-form-group > span {
  width: 100% !important;
  height: 42px !important;
  margin: 0 !important;
  padding: 0 13px !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--cl-text) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 42px !important;
  outline: 0 !important;
}

#cl-shopping-settings-page .cl-common-form-wrap.nonplace-holder input::placeholder {
  color: var(--cl-text-muted) !important;
}

#cl-shopping-settings-page .cl-common-form-wrap.nonplace-holder:focus-within .cl-common-form-group {
  border-color: var(--cl-green) !important;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .13) !important;
}

#cl-shopping-settings-page .cl-common-form-wrap.nonplace-holder.readOnly input,
#cl-shopping-settings-page .cl-common-form-wrap.nonplace-holder.readOnly .cl-common-form-group > span,
#cl-shopping-settings-page .cl-common-form-wrap.nonplace-holder.readonly input,
#cl-shopping-settings-page .cl-common-form-wrap.nonplace-holder.readonly .cl-common-form-group > span {
  color: var(--cl-text-muted) !important;
}

#cl-shopping-settings-page .settingBtnSaveWrap {
  display: flex !important;
  justify-content: flex-end;
  margin: 0 !important;
  padding: 20px 24px 26px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-top: 0 !important;
  border-radius: 0 0 var(--cl-radius-lg) var(--cl-radius-lg) !important;
  box-shadow: var(--cl-shadow-panel) !important;
}

#cl-shopping-settings-page[data-setting-tab="naverpay"] .settingBtnSaveWrap {
  position: relative;
  padding-top: 26px !important;
}

#cl-shopping-settings-page[data-setting-tab="naverpay"] .settingBtnSaveWrap::before {
  position: absolute;
  top: 0;
  right: 24px;
  left: 24px;
  border-top: 1px solid var(--cl-line);
  content: "";
}

#cl-shopping-settings-page .setting-button,
#cl-shopping-settings-page .settingBtnSaveWrap .setting-button,
#cl-shopping-settings-page .setting-savePc,
#cl-shopping-settings-page .setting-saveMobile {
  --cl-disabled-button-border-width: 0px;
  position: static !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-width: 124px !important;
  height: 44px !important;
  margin: 0 !important;
  padding: 0 32px !important;
  background: var(--cl-green) !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  text-align: center;
  cursor: pointer;
}

#cl-shopping-settings-page .settingBtnSaveWrap .setting-button,
#cl-shopping-settings-page .settingBtnSaveWrap .setting-button.pc-setting-btn,
#cl-shopping-settings-page .settingBtnSaveWrap .setting-button.w-pc-setting-btn {
  flex: 0 0 100px !important;
  width: 100px !important;
  min-width: 100px !important;
  max-width: 100px !important;
  height: 44px !important;
  min-height: 44px !important;
  padding: 0 !important;
}

#cl-shopping-settings-page .setting-button:hover,
#cl-shopping-settings-page .settingBtnSaveWrap .setting-button:hover {
  background: var(--cl-green-hover) !important;
  border-color: var(--cl-green-hover) !important;
}

#cl-shopping-settings-page .setting-button.shopping_disabled,
#cl-shopping-settings-page .setting-button.ss_user_noActive {
  background: #e9ebee !important;
  border-color: #e9ebee !important;
  color: var(--cl-text-muted) !important;
}

#cl-shopping-settings-page .newcheckbox {
  display: inline-flex !important;
  align-items: center;
  float: none !important;
  min-height: 18px;
  margin: 0 !important;
  padding: 0 !important;
}

#cl-shopping-settings-page .newcheckbox label,
#cl-shopping-settings-page .setting-sub-content-radio-box {
  display: inline-flex !important;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  min-height: 18px;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 18px !important;
  cursor: pointer;
}

#cl-shopping-settings-page .setting-sub-content-radio-box {
  gap: 22px;
}

#cl-shopping-settings-page .setting-sub-title.tax-use + .setting-sub-content > .setting-sub-content-radio-box + div {
  margin-top: 6px !important;
}

#cl-shopping-settings-page .setting-sub-title.tax-use + .setting-sub-content > .setting-sub-content-radio-box + div .setting-noticeText {
  margin: 0 !important;
}

#cl-shopping-settings-page .newcheckboxSvgRadio {
  position: relative !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  flex: 0 0 18px;
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
  padding: 0 !important;
}

#cl-shopping-settings-page .newcheckboxSvgRadio input[type="radio"] {
  position: absolute !important;
  inset: 0;
  z-index: 2;
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
  opacity: 0;
  cursor: pointer;
}

#cl-shopping-settings-page .newcheckboxSvgRadio svg {
  display: none !important;
}

#cl-shopping-settings-page .newcheckboxSvgRadio::before,
#cl-shopping-settings-page .newcheckboxSvgRadio::after {
  content: "";
  display: block;
  box-sizing: border-box;
  border-radius: 50%;
  pointer-events: none;
}

#cl-shopping-settings-page .newcheckboxSvgRadio::before {
  width: 18px;
  height: 18px;
  border: 2px solid #dbdcdf;
  background: #fff;
}

#cl-shopping-settings-page .newcheckboxSvgRadio::after {
  position: absolute;
  top: 5px;
  left: 5px;
  width: 8px;
  height: 8px;
  background: var(--cl-green);
  opacity: 0;
}

#cl-shopping-settings-page .newcheckboxSvgRadio:has(input[type="radio"]:checked)::before {
  border-color: var(--cl-green);
}

#cl-shopping-settings-page .newcheckboxSvgRadio:has(input[type="radio"]:checked)::after {
  opacity: 1;
}

#cl-shopping-settings-page .pg-keyinput-box.active .newcheckboxSvgRadio::before,
#cl-shopping-settings-page .pay-box.active .newcheckboxSvgRadio::before {
  border-color: var(--cl-green);
}

#cl-shopping-settings-page .pg-keyinput-box.active .newcheckboxSvgRadio::after,
#cl-shopping-settings-page .pay-box.active .newcheckboxSvgRadio::after {
  opacity: 1;
}

#cl-shopping-settings-page .pg-keyinput-box:not(.active) .newcheckboxSvgRadio::before {
  border-color: #dbdcdf;
}

#cl-shopping-settings-page .pg-keyinput-box:not(.active) .newcheckboxSvgRadio::after {
  opacity: 0;
}

#cl-shopping-settings-page .newcheckbox.disabled,
#cl-shopping-settings-page .newcheckboxSvgRadio:has(input[type="radio"]:disabled) {
  opacity: .55;
  pointer-events: none;
}

#cl-shopping-settings-page .switch_onoff_btn {
  display: inline-flex !important;
  align-items: center;
  flex: 0 0 auto;
  margin-left: auto;
}

#cl-shopping-settings-page .switch_onoff_btn .switch {
  position: relative !important;
  display: inline-block !important;
  width: 36px !important;
  height: 20px !important;
  margin: 0 !important;
  padding: 0 !important;
}

#cl-shopping-settings-page .switch_onoff_btn .switch-input {
  position: absolute !important;
  inset: 0;
  z-index: 2;
  width: 36px !important;
  height: 20px !important;
  margin: 0 !important;
  opacity: 0;
  cursor: pointer;
}

#cl-shopping-settings-page .switch_onoff_btn .switch-set-label {
  position: absolute;
  inset: 0;
  display: block;
  width: 36px;
  height: 20px;
  background: #d5d9e0;
  border: 0;
  border-radius: 999px;
  font-size: 0;
  transition: background .18s;
}

#cl-shopping-settings-page .switch_onoff_btn .switch-set-label::before,
#cl-shopping-settings-page .switch_onoff_btn .switch-set-label::after {
  display: none !important;
}

#cl-shopping-settings-page .switch_onoff_btn .switch-set-handle {
  position: absolute;
  top: 3px;
  left: 3px;
  display: block;
  width: 14px;
  height: 14px;
  background: #fff;
  border-radius: 50%;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .2);
  transition: transform .18s;
}

#cl-shopping-settings-page .switch_onoff_btn .switch-input:checked ~ .switch-set-label {
  background: var(--cl-green);
}

#cl-shopping-settings-page .switch_onoff_btn .switch-input:checked ~ .switch-set-handle {
  transform: translateX(16px);
}

#cl-shopping-settings-page .common-selectbox,
#cl-shopping-settings-page .setting-common-select,
#cl-shopping-settings-page .setting-pay-select,
#cl-shopping-settings-page .setting-npay-select {
  position: relative;
  display: inline-flex !important;
  align-items: center;
  width: auto;
  min-width: 112px;
  height: 35px;
  margin: 0;
  padding: 0;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: var(--cl-radius-sm);
  box-shadow: none;
}

#cl-shopping-settings-page .setting-npay-select,
#cl-shopping-settings-page .common-selectbox:has(select[name="nshop_action_grade"]) {
  min-width: 200px;
}

#cl-shopping-settings-page .common-selectbox:hover,
#cl-shopping-settings-page .common-selectbox:focus-within {
  background: #fafbfc;
  border-color: #d5d9e0;
}

#cl-shopping-settings-page .common-selectbox select {
  width: 100%;
  height: 33px;
  min-width: 112px;
  margin: 0;
  padding: 0 30px 0 12px;
  appearance: none;
  -webkit-appearance: none;
  background: transparent;
  border: 0;
  box-shadow: none;
  color: var(--cl-text);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 33px;
  outline: none;
  cursor: pointer;
}

#cl-shopping-settings-page .common-selectbox > .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn) {
  width: 100% !important;
  max-width: none;
  height: 33px;
}

#cl-shopping-settings-page .common-selectbox > .bootstrap-select .dropdown-toggle .bs-caret {
  display: none;
}

#cl-shopping-settings-page .common-selectbox > .bootstrap-select .btn.btn-default,
#cl-shopping-settings-page .common-selectbox > .bootstrap-select .btn.btn-default:hover,
#cl-shopping-settings-page .common-selectbox > .bootstrap-select .btn.btn-default:focus,
#cl-shopping-settings-page .common-selectbox > .bootstrap-select .btn.btn-default:active,
#cl-shopping-settings-page .common-selectbox > .bootstrap-select.open .btn.btn-default {
  width: 100%;
  max-width: none;
  height: 33px;
  min-height: 33px;
  margin: 0;
  padding: 0 30px 0 12px;
  background: transparent !important;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  color: var(--cl-text);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 33px;
  outline: 0 !important;
}

#cl-shopping-settings-page .common-selectbox > .bootstrap-select .filter-option,
#cl-shopping-settings-page .common-selectbox > .bootstrap-select .filter-option-inner,
#cl-shopping-settings-page .common-selectbox > .bootstrap-select .filter-option-inner-inner {
  height: 33px;
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: 33px;
}

#cl-shopping-settings-page .common-selectbox > .bootstrap-select > .dropdown-menu {
  top: var(--cl-select-menu-top, calc(100% + 4px));
  min-width: 100%;
  margin: 0;
  padding: 4px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(20, 24, 32, .14);
}

#cl-shopping-settings-page .common-selectbox > .bootstrap-select .dropdown-menu.inner {
  position: static;
  min-width: 0;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

#cl-shopping-settings-page .common-selectbox > .bootstrap-select .dropdown-menu > li > a {
  min-height: 0;
  padding: 8px 12px;
  border-radius: var(--cl-radius-sm);
  color: var(--cl-text);
  font-size: 12.5px;
  font-weight: 400;
  line-height: 18px;
}

#cl-shopping-settings-page .common-selectbox > .bootstrap-select .dropdown-menu > li > a:hover,
#cl-shopping-settings-page .common-selectbox > .bootstrap-select .dropdown-menu > li > a:focus,
#cl-shopping-settings-page .common-selectbox > .bootstrap-select .dropdown-menu > .active > a,
#cl-shopping-settings-page .common-selectbox > .bootstrap-select .dropdown-menu > .active > a:hover,
#cl-shopping-settings-page .common-selectbox > .bootstrap-select .dropdown-menu > .active > a:focus,
#cl-shopping-settings-page .common-selectbox > .bootstrap-select .dropdown-menu > .selected > a,
#cl-shopping-settings-page .common-selectbox > .bootstrap-select .dropdown-menu > .selected > a:hover,
#cl-shopping-settings-page .common-selectbox > .bootstrap-select .dropdown-menu > .selected > a:focus {
  background: #e4f7ec;
  color: var(--cl-green-text);
}

#cl-shopping-settings-page .common-selectbox > .bootstrap-select .dropdown-menu > .active > a,
#cl-shopping-settings-page .common-selectbox > .bootstrap-select .dropdown-menu > .selected > a {
  font-weight: 700;
}

#cl-shopping-settings-page .common-selectbox > svg {
  position: absolute !important;
  top: 50% !important;
  right: 12px !important;
  left: auto !important;
  width: 14px !important;
  height: 14px !important;
  margin: 0 !important;
  transform: translateY(-50%) !important;
  pointer-events: none;
  fill: var(--cl-text-muted);
}

#cl-shopping-settings-page .common-selectbox::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 10px;
  width: 14px;
  height: 14px;
  margin: 0;
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23B4B8BF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M6 9l6 6 6-6'/></svg>") center / 14px 14px no-repeat;
  transform: translateY(-50%);
  pointer-events: none;
}

#cl-shopping-settings-page .pg-text {
  max-width: 600px;
}

#cl-shopping-settings-page .pg-text p:first-child,
#cl-shopping-settings-page .pg-text .mb-15 {
  margin: 0 0 12px !important;
  color: var(--cl-text) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 22px !important;
}

#cl-shopping-settings-page .pg-text .pg-info-text,
#cl-shopping-settings-page .pg-text .no_comp_text1,
#cl-shopping-settings-page .pg-text .no_comp_text2 {
  margin: 0 0 8px !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.85 !important;
}

#cl-shopping-settings-page .pg-text .no_comp_text1 {
  color: var(--cl-text-muted) !important;
}

#cl-shopping-settings-page .pg-text .no_comp_text2 {
  color: var(--cl-green-text) !important;
}

#cl-shopping-settings-page .pg-text p,
#cl-shopping-settings-page .pg-info-text,
#cl-shopping-settings-page .setting-noticeText,
#cl-shopping-settings-page .pg_info_txt,
#cl-shopping-settings-page .setting_pay_gabia_text,
#cl-shopping-settings-page .setting_cdNotice p,
#cl-shopping-settings-page .setting-vcnt-setting,
#cl-shopping-settings-page .setting-kakaopay-setting,
#cl-shopping-settings-page .setting-tosspay-setting {
  margin: 6px 0 14px !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.8 !important;
}

#cl-shopping-settings-page .no_comp_text2,
#cl-shopping-settings-page .pg_info_txt .pg_info_comp_code,
#cl-shopping-settings-page .pg_info_txt .pg_info_comp_key {
  color: var(--cl-green-text) !important;
}

#cl-shopping-settings-page .pg-code-input-wrap + .pg_info_txt {
  margin-top: 6px !important;
}

#cl-shopping-settings-page .pay-apply-wrap,
#cl-shopping-settings-page .pg-key {
  max-width: 580px;
}

#cl-shopping-settings-page .pay-apply-box {
  display: flex;
  flex-direction: column;
  gap: 12px;
  max-width: 580px;
}

#cl-shopping-settings-page .pay-box,
#cl-shopping-settings-page .pg-keyinput-box {
  display: flex !important;
  align-items: flex-start;
  gap: 12px;
  width: 100% !important;
  margin: 0 !important;
  padding: 18px 20px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  cursor: pointer;
}

#cl-shopping-settings-page .pay-box.active,
#cl-shopping-settings-page .pg-keyinput-box.active {
  border-color: var(--cl-green) !important;
  box-shadow: 0 0 0 1px var(--cl-green) !important;
}

#cl-shopping-settings-page .pay-box .radio-box,
#cl-shopping-settings-page .pg-keyinput-box .radio-box {
  flex: 0 0 18px;
  width: 18px;
  margin: 1px 0 0 !important;
}

#cl-shopping-settings-page .pay-box .info-box,
#cl-shopping-settings-page .pg-keyinput-box .info-box {
  flex: 1 1 auto;
  min-width: 0;
  color: var(--cl-text-sub);
}

#cl-shopping-settings-page .pay-box .logo-box,
#cl-shopping-settings-page .pg-keyinput-box .logo-box {
  display: flex;
  align-items: center;
  min-height: 22px;
  margin: 0 0 12px !important;
  padding: 0 !important;
}

#cl-shopping-settings-page .pay-box .logo-box img,
#cl-shopping-settings-page .pg-keyinput-box .logo-box img {
  display: block;
  width: auto !important;
  height: auto !important;
  max-width: 112px;
  max-height: 22px;
  margin: 0 !important;
  object-fit: contain;
  object-position: left center;
}

#cl-shopping-settings-page .pay-box .info-box-1,
#cl-shopping-settings-page .pay-box .info-box-2,
#cl-shopping-settings-page .pg-keyinput-box .info-box-1,
#cl-shopping-settings-page .pg-keyinput-box .info-box-2 {
  display: flex;
  gap: 10px;
  padding: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 12.5px !important;
  line-height: 1.9 !important;
}

#cl-shopping-settings-page .pay-box .left,
#cl-shopping-settings-page .pg-keyinput-box .left {
  flex: 0 0 66px;
  color: var(--cl-text-muted) !important;
}

#cl-shopping-settings-page .emphasize_text {
  color: var(--cl-danger) !important;
}

#cl-shopping-settings-page .pay-box .card_str,
#cl-shopping-settings-page .pay-box .card_str .emphasize_text,
#cl-shopping-settings-page .pg-select-list-wrap .pg-keyinput-box .card_str,
#cl-shopping-settings-page .pg-select-list-wrap .pg-keyinput-box .card_str .emphasize_text {
  color: #f27f79 !important;
}

#cl-shopping-settings-page .pgKeybtn_wrap {
  display: flex !important;
  justify-content: flex-end;
  gap: 8px;
  max-width: 580px;
  margin: 12px 0 0 !important;
}

#cl-shopping-settings-page .pay-apply-wrap > .pgKeybtn_wrap {
  margin-top: 12px !important;
}

#cl-shopping-settings-page .pgKeybtn_wrap .btn,
#cl-shopping-settings-page .pg-btn,
#cl-shopping-settings-page .pg-btn-gabia,
#cl-shopping-settings-page .pg-key-btn,
#cl-shopping-settings-page .cl-pg-key-btn,
#cl-shopping-settings-page .sub-btn-pg,
#cl-shopping-settings-page .npay-request-btn,
#cl-shopping-settings-page .npay-btn,
#cl-shopping-settings-page #bank-add,
#cl-shopping-settings-page .btn-add-template {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: auto !important;
  min-width: 0 !important;
  height: 42px !important;
  margin: 0 !important;
  padding: 0 20px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  text-decoration: none !important;
}

#cl-shopping-settings-page .pay-apply-wrap > .pgKeybtn_wrap .btn {
  height: 40px !important;
}

#cl-shopping-settings-page .pay-apply-wrap > .pgKeybtn_wrap #pg-keyinput-btn {
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
}

#cl-shopping-settings-page .pay-apply-wrap > .pgKeybtn_wrap #pg-keyinput-btn:hover,
#cl-shopping-settings-page .pay-apply-wrap > .pgKeybtn_wrap #pg-keyinput-btn:focus {
  border-color: var(--cl-border-hover) !important;
  background: var(--cl-bg-subtle) !important;
  color: var(--cl-text-sub) !important;
  outline: 0 !important;
}

#cl-shopping-settings-page .pgKeybtn_wrap .btn.active,
#cl-shopping-settings-page .pg-btn.active,
#cl-shopping-settings-page .pg-btn-gabia,
#cl-shopping-settings-page .pg-key-btn.active,
#cl-shopping-settings-page .cl-pg-key-btn.active,
#cl-shopping-settings-page .sub-btn-pg.active,
#cl-shopping-settings-page #pg-btn-id,
#cl-shopping-settings-page #pg-keyinput-btn-apply,
#cl-shopping-settings-page .npay-btn#npay-btn,
#cl-shopping-settings-page .npay-request-btn.npaybtnActivate,
#cl-shopping-settings-page .btn-add-template {
  background: var(--cl-green) !important;
  border-color: var(--cl-green) !important;
  color: #fff !important;
}

#cl-shopping-settings-page .pgKeybtn_wrap .btn:hover,
#cl-shopping-settings-page .pg-btn:hover,
#cl-shopping-settings-page .pg-key-btn:hover,
#cl-shopping-settings-page .cl-pg-key-btn:hover,
#cl-shopping-settings-page .sub-btn-pg:hover,
#cl-shopping-settings-page .npay-btn:hover,
#cl-shopping-settings-page #bank-add:hover,
#cl-shopping-settings-page .btn-add-template:hover {
  border-color: var(--cl-green) !important;
  color: var(--cl-green-text) !important;
}

#cl-shopping-settings-page .pgKeybtn_wrap .btn.active:hover,
#cl-shopping-settings-page .pg-btn.active:hover,
#cl-shopping-settings-page .pg-btn-gabia:hover,
#cl-shopping-settings-page .pg-key-btn.active:hover,
#cl-shopping-settings-page .cl-pg-key-btn.active:hover,
#cl-shopping-settings-page .sub-btn-pg.active:hover,
#cl-shopping-settings-page #pg-btn-id:hover,
#cl-shopping-settings-page #pg-keyinput-btn-apply:hover,
#cl-shopping-settings-page .npay-btn#npay-btn:hover,
#cl-shopping-settings-page .btn-add-template:hover {
  background: var(--cl-green-hover) !important;
  border-color: var(--cl-green-hover) !important;
  color: #fff !important;
}

#cl-shopping-settings-page .pg-tab-box {
  display: flex !important;
  gap: 8px;
  max-width: 580px;
  margin: 0 0 20px !important;
  padding: 0 !important;
}

#cl-shopping-settings-page .pg-selectbox-wrap {
  position: relative !important;
  display: flex !important;
  align-items: center;
  width: 100% !important;
  max-width: 580px;
  min-height: 50px !important;
  margin: 0 !important;
  padding: 14px 44px 14px 20px !important;
  background: #f6fbf8 !important;
  border: 1px solid var(--cl-green-line) !important;
  border-radius: 8px !important;
  color: var(--cl-green-text) !important;
  cursor: pointer;
}

#cl-shopping-settings-page .pg-selectbox-wrap .logo_list {
  display: none !important;
  align-items: center;
  float: none !important;
  margin: 0 22px 0 0 !important;
}

#cl-shopping-settings-page .pg-selectbox-wrap .logo_list.active {
  display: inline-flex !important;
}

#cl-shopping-settings-page .pg-selectbox-wrap .logo_list img {
  width: auto !important;
  max-width: 104px;
  max-height: 24px;
  margin: 0 !important;
}

#cl-shopping-settings-page .pg-selectbox-wrap .pg_comp_text {
  margin: 0 0 0 8px !important;
  color: var(--cl-green-text) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 20px !important;
}

#cl-shopping-settings-page .pg-selectbox-wrap svg {
  position: absolute !important;
  top: 50% !important;
  right: 20px !important;
  width: 16px !important;
  height: 16px !important;
  margin: 0 !important;
  fill: currentColor !important;
  transform: translateY(-50%) !important;
}

#cl-shopping-settings-page .pg-selectbox-wrap.open svg {
  transform: translateY(-50%) rotate(180deg) !important;
}

#cl-shopping-settings-page .pg-select-list-wrap {
  position: relative !important;
  width: 100%;
  max-width: 580px;
  margin: 8px 0 0 !important;
  padding: 0 !important;
  background: transparent !important;
}

#cl-shopping-settings-page .setting_pay_apply_content > .pg-key {
  max-width: 580px !important;
  height: auto !important;
  margin: 18px 0 0 !important;
  position: relative !important;
}

#cl-shopping-settings-page .pg-selectbox-wrap .logo_list {
  gap: 6px !important;
  margin: 0 !important;
}

#cl-shopping-settings-page .pg-selectbox-wrap .logo_list img {
  width: auto !important;
  height: auto !important;
  max-width: 112px !important;
  max-height: 24px !important;
  margin: 0 !important;
  float: none !important;
}

#cl-shopping-settings-page .pg-select-list-wrap .pg-keyinput-box {
  align-items: flex-start !important;
  column-gap: 12px !important;
  min-height: 0 !important;
  margin: 0 0 12px !important;
  padding: 18px 20px !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
}

#cl-shopping-settings-page .pg-select-list-wrap .pg-keyinput-box:last-child {
  margin-bottom: 0 !important;
}

#cl-shopping-settings-page .pg-select-list-wrap .pg-keyinput-box.active {
  padding: 18px 20px !important;
  border-color: var(--cl-green) !important;
  box-shadow: 0 0 0 1px var(--cl-green) !important;
}

#cl-shopping-settings-page .pg-select-list-wrap .pg-keyinput-box > .radio-box {
  margin-top: 1px !important;
  padding-top: 0 !important;
}

#cl-shopping-settings-page .pg-select-list-wrap .pg-keyinput-box > .info-box {
  display: flex !important;
  flex-direction: column !important;
  row-gap: 0 !important;
  padding-bottom: 0 !important;
}

#cl-shopping-settings-page .pg-select-list-wrap .pg-keyinput-box > .info-box .logo-box,
#cl-shopping-settings-page .pg-select-list-wrap .pg-keyinput-box.kcp-box > .info-box .logo-box {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-height: 22px !important;
  margin: 0 0 12px !important;
  padding: 0 !important;
  column-gap: 8px !important;
}

#cl-shopping-settings-page .pg-select-list-wrap .pg-keyinput-box > .info-box .logo-box img {
  width: auto !important;
  height: auto !important;
  max-width: 112px !important;
  max-height: 22px !important;
  margin: 0 !important;
}

#cl-shopping-settings-page .pg-select-list-wrap .pg-keyinput-box .pg_comp_text {
  margin: 0 0 0 8px !important;
  color: var(--cl-green-text) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 18px !important;
}

#cl-shopping-settings-page .pg-select-list-wrap .pg-keyinput-box .info-box > div {
  column-gap: 10px !important;
}

#cl-shopping-settings-page .pg-select-list-wrap .pg-keyinput-box .info-box-1,
#cl-shopping-settings-page .pg-select-list-wrap .pg-keyinput-box .info-box-2 {
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 12.5px !important;
  line-height: 1.9 !important;
}

#cl-shopping-settings-page .pg-select-list-wrap .pg-keyinput-box .card_str {
  color: #f27f79 !important;
  font-size: inherit !important;
}

#cl-shopping-settings-page .pg-select-list-wrap .pg-keyinput-box .card_str .emphasize_text {
  color: #f27f79 !important;
  font-size: inherit !important;
}

#cl-shopping-settings-page .pg-select-list-wrap .pgKeybtn_wrap {
  max-width: 100% !important;
  margin: 10px 0 0 !important;
  gap: 8px !important;
  column-gap: 8px !important;
}

#cl-shopping-settings-page .pg-select-list-wrap .pg-key-btn,
#cl-shopping-settings-page .pg-select-list-wrap .cl-pg-key-btn {
  min-width: 98px !important;
  max-width: none !important;
  height: 40px !important;
  margin-top: 0 !important;
  padding: 0 18px !important;
}

#cl-shopping-settings-page .pg-code-input-wrap {
  max-width: 580px;
  margin-top: 18px !important;
}

#cl-shopping-settings-page .pg-code-input-wrap .cl-common-form-wrap.nonplace-holder {
  max-width: 580px !important;
}

#cl-shopping-settings-page .pg-code-input-wrap .pg-code-input {
  width: 100% !important;
  max-width: 580px !important;
  margin: 0 !important;
}

#cl-shopping-settings-page .pg-code-input-wrap .pg-code-input + div {
  width: 100% !important;
  max-width: 580px !important;
  margin-top: 22px !important;
}

#cl-shopping-settings-page .pay-card,
#cl-shopping-settings-page .pay-escrow,
#cl-shopping-settings-page .pay-vcnt,
#cl-shopping-settings-page .pay-phone,
#cl-shopping-settings-page .pay-kakaopay,
#cl-shopping-settings-page .pay-tosspay,
#cl-shopping-settings-page .pay-bank,
#cl-shopping-settings-page .product-margin {
  position: relative;
  width: 100% !important;
  max-width: 580px !important;
  margin: 0 !important;
  padding: 0 0 24px !important;
  border-bottom: 1px solid #f0f1f4 !important;
}

#cl-shopping-settings-page .pay-card:not(.hide) {
  display: flex !important;
  flex-direction: column;
  align-items: stretch;
  overflow: visible;
}

#cl-shopping-settings-page .pay-card .box-sub-content-title {
  position: relative !important;
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  width: 100% !important;
  max-width: 580px !important;
  min-height: 24px;
  margin: 0 0 22px !important;
  line-height: 24px !important;
}

#cl-shopping-settings-page .pay-escrow > .box-sub-content-title {
  margin: 0 0 22px !important;
}

#cl-shopping-settings-page .pay-card .box-sub-content-title .switch_onoff_btn {
  position: static !important;
  right: auto !important;
}

#cl-shopping-settings-page .pay-card > .setting-sub-content-title {
  margin: 0 0 10px !important;
}

#cl-shopping-settings-page .pay-card .setting-text-box {
  width: 100% !important;
  max-width: 580px !important;
  margin: 0 !important;
  overflow: visible !important;
}

#cl-shopping-settings-page .pay-card .setting-pay-select {
  display: inline-flex !important;
  align-items: center;
  gap: 8px;
  width: auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 35px;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

#cl-shopping-settings-page .pay-card .setting-pay-select::after,
#cl-shopping-settings-page .pay-card .setting-pay-select > svg {
  display: none !important;
}

#cl-shopping-settings-page .pay-card .setting-pay-select > select {
  width: 66px !important;
  min-width: 66px !important;
  height: 35px !important;
  padding: 0 28px 0 12px !important;
  background: #fff url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23B4B8BF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M6 9l6 6 6-6'/></svg>") right 8px center / 14px 14px no-repeat !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: var(--cl-radius-sm) !important;
  line-height: 33px !important;
}

#cl-shopping-settings-page .pay-card .setting-pay-select > .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn),
#cl-shopping-settings-page .pay-card .setting-pay-select > .bootstrap-select.dropdown {
  flex: 0 0 66px !important;
  width: 66px !important;
  max-width: 66px !important;
  min-width: 66px !important;
  height: 35px !important;
  margin: 0 !important;
}

#cl-shopping-settings-page .pay-card .setting-pay-select > .bootstrap-select .btn.btn-default,
#cl-shopping-settings-page .pay-card .setting-pay-select > .bootstrap-select .btn.btn-default:hover,
#cl-shopping-settings-page .pay-card .setting-pay-select > .bootstrap-select .btn.btn-default:focus,
#cl-shopping-settings-page .pay-card .setting-pay-select > .bootstrap-select .btn.btn-default:active,
#cl-shopping-settings-page .pay-card .setting-pay-select > .bootstrap-select.open .btn.btn-default {
  position: relative;
  width: 66px !important;
  max-width: 66px !important;
  height: 35px !important;
  min-height: 35px !important;
  margin: 0 !important;
  padding: 0 28px 0 12px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: var(--cl-radius-sm) !important;
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 33px !important;
}

#cl-shopping-settings-page .pay-card .setting-pay-select > .bootstrap-select.open .btn.btn-default,
#cl-shopping-settings-page .pay-card .setting-pay-select > .bootstrap-select .btn.btn-default:focus {
  border-color: var(--cl-green) !important;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .13) !important;
}

#cl-shopping-settings-page .pay-card .setting-pay-select > .bootstrap-select .btn.btn-default::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 8px;
  width: 14px;
  height: 14px;
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23B4B8BF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M6 9l6 6 6-6'/></svg>") center / 14px 14px no-repeat;
  transform: translateY(-50%);
  pointer-events: none;
}

#cl-shopping-settings-page .pay-card .setting-pay-select > .bootstrap-select .filter-option,
#cl-shopping-settings-page .pay-card .setting-pay-select > .bootstrap-select .filter-option-inner,
#cl-shopping-settings-page .pay-card .setting-pay-select > .bootstrap-select .filter-option-inner-inner {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: 33px !important;
  min-height: 33px !important;
  margin: 0 !important;
  padding: 0 !important;
  color: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  line-height: 33px !important;
  overflow: hidden !important;
  text-align: left !important;
  text-overflow: clip !important;
  white-space: nowrap !important;
}

#cl-shopping-settings-page .pay-card .setting-pay-select > .bootstrap-select .dropdown-toggle .filter-option {
  position: static !important;
  float: none !important;
  flex: 0 1 auto !important;
  color: var(--cl-text) !important;
}

#cl-shopping-settings-page .pay-card .setting-pay-select > .bootstrap-select .filter-option-inner-inner {
  color: var(--cl-text) !important;
}

#cl-shopping-settings-page .pay-card .setting-pay-select > .bootstrap-select > .dropdown-menu {
  top: var(--cl-select-menu-top, calc(100% + 4px)) !important;
  width: 66px !important;
  min-width: 66px !important;
  max-width: 66px !important;
  max-height: 184px !important;
  margin: 0 !important;
  padding: 4px !important;
  overflow: hidden !important;
}

#cl-shopping-settings-page .pay-card .setting-pay-select > .bootstrap-select > .dropdown-menu > .inner,
#cl-shopping-settings-page .pay-card .setting-pay-select > .bootstrap-select > .dropdown-menu .dropdown-menu.inner {
  width: 100% !important;
  min-width: 0 !important;
  max-height: 176px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  scrollbar-width: thin;
  scrollbar-color: #d8dce3 transparent;
}

#cl-shopping-settings-page .pay-card .setting-pay-select > .bootstrap-select > .dropdown-menu .dropdown-menu.inner::-webkit-scrollbar {
  width: 7px;
}

#cl-shopping-settings-page .pay-card .setting-pay-select > .bootstrap-select > .dropdown-menu .dropdown-menu.inner::-webkit-scrollbar-thumb {
  background: #d8dce3;
  border: 2px solid transparent;
  border-radius: 999px;
  background-clip: padding-box;
}

#cl-shopping-settings-page .pay-card .setting-pay-select > .bootstrap-select > .dropdown-menu .dropdown-menu.inner::-webkit-scrollbar-track {
  background: transparent;
}

#cl-shopping-settings-page .pay-card .setting-pay-select > .bootstrap-select > .dropdown-menu .dropdown-menu.inner > li > a {
  display: flex !important;
  align-items: center;
  min-height: 34px !important;
  padding: 8px 10px !important;
  line-height: 18px !important;
}

#cl-shopping-settings-page .pay-card .setting-pay-select > .bootstrap-select > .dropdown-menu .dropdown-menu.inner > li > a .text {
  display: block;
  width: 100%;
  color: inherit;
  line-height: inherit;
}

#cl-shopping-settings-page .pay-card .setting-pay-select > span {
  display: inline-flex !important;
  align-items: center;
  height: 35px;
  margin: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 35px !important;
  white-space: nowrap;
}

#cl-shopping-settings-page .pay-card .setting_cdNotice {
  display: block !important;
  float: none !important;
  clear: both !important;
  width: 100% !important;
  max-width: 580px !important;
  margin: 10px 0 0 !important;
  padding: 0 !important;
}

#cl-shopping-settings-page .pay-card .setting_cdNotice p {
  margin: 0 !important;
}

#cl-shopping-settings-page .pay-card > [class*="description-"] {
  display: block !important;
  float: none !important;
  clear: both !important;
  width: 100% !important;
  max-width: 580px !important;
  margin: 28px 0 0 !important;
  padding: 0 !important;
}

#cl-shopping-settings-page .pay-card > [class*="description-"].hide {
  display: none !important;
}

#cl-shopping-settings-page .pay-card > [class*="description-"] p {
  margin: 0 0 6px !important;
  color: var(--cl-text) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 20px !important;
}

#cl-shopping-settings-page .pay-card > [class*="description-"] ul {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  line-height: 1.8 !important;
  list-style: none !important;
}

#cl-shopping-settings-page .pay-card > [class*="description-"] li {
  position: relative;
  display: block !important;
  margin: 0 !important;
  padding: 0 0 0 12px !important;
  color: inherit !important;
  font-size: inherit !important;
  line-height: inherit !important;
  list-style: none !important;
}

#cl-shopping-settings-page .pay-card > [class*="description-"] li::before {
  content: "*";
  position: absolute;
  left: 0;
  top: 0;
  color: currentColor;
}

#cl-shopping-settings-page .pay-bank,
#cl-shopping-settings-page .setting-sub-content-box > .setting-sub-content:last-child {
  border-bottom: 0 !important;
  padding-bottom: 0 !important;
}

#cl-shopping-settings-page .pay-escrow .pg-key {
  width: 100% !important;
  max-width: 580px !important;
  margin: 6px 0 26px !important;
  padding: 0 !important;
}

#cl-shopping-settings-page .pay-escrow .pg-key p {
  margin: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.8 !important;
}

#cl-shopping-settings-page .pay-escrow .escrow-check.mb-40 {
  height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}

#cl-shopping-settings-page .pay-escrow > .setting-sub-content-title.escrow-check {
  display: flex !important;
  margin: 0 0 12px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

#cl-shopping-settings-page .pay-escrow .setting-sub-content-radio-box.escrow-image {
  display: block !important;
  width: 100% !important;
  max-width: 580px !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

#cl-shopping-settings-page .pay-escrow .escrow-disabled {
  background: transparent !important;
}

#cl-shopping-settings-page .pay-escrow > .setting-sub-content-title.escrow-check.shopping_disabled:not(.newcheckbox):not(button):not(.btn-batch-proc):not(.tracking-option):not(.delivery-edit):not(#admin-memo):not(#submit-change):not(#submit-change-m):not(.memo-btn),
#cl-shopping-settings-page .pay-escrow .setting-sub-content-radio-box.escrow-image.shopping_disabled:not(.newcheckbox):not(button):not(.btn-batch-proc):not(.tracking-option):not(.delivery-edit):not(#admin-memo):not(#submit-change):not(#submit-change-m):not(.memo-btn),
#cl-shopping-settings-page .pay-escrow .escrow-image .shopping_disabled:not(.newcheckbox):not(button):not(.btn-batch-proc):not(.tracking-option):not(.delivery-edit):not(#admin-memo):not(#submit-change):not(#submit-change-m):not(.memo-btn),
#cl-shopping-settings-page .pay-escrow .escrow-image .bootstrap-select.shopping_disabled:not(.newcheckbox):not(button):not(.btn-batch-proc):not(.tracking-option):not(.delivery-edit):not(#admin-memo):not(#submit-change):not(#submit-change-m):not(.memo-btn) {
  background: transparent !important;
  background-color: transparent !important;
  opacity: 1 !important;
}

#cl-shopping-settings-page .pay-escrow .escrow-image .bootstrap-select.shopping_disabled .btn.btn-default,
#cl-shopping-settings-page .pay-escrow .escrow-image .dropdown.bootstrap-select.shopping_disabled button,
#cl-shopping-settings-page .pay-escrow .escrow-image .dropdown.bootstrap-select.shopping_disabled .btn.dropdown-toggle {
  background: #fff !important;
  background-color: #fff !important;
  opacity: 1 !important;
}

#cl-shopping-settings-page .pay-escrow .escrow-image > .dropdown.bootstrap-select {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  max-width: 220px !important;
  margin: 0 !important;
  padding: 0 !important;
}

#cl-shopping-settings-page .pay-escrow .escrow-image > .dropdown.bootstrap-select.hide {
  display: none !important;
}

#cl-shopping-settings-page .pay-escrow .escrow-image > .dropdown.bootstrap-select .btn.dropdown-toggle,
#cl-shopping-settings-page .pay-escrow .escrow-image > .dropdown.bootstrap-select .btn.dropdown-toggle:hover,
#cl-shopping-settings-page .pay-escrow .escrow-image > .dropdown.bootstrap-select .btn.dropdown-toggle:focus,
#cl-shopping-settings-page .pay-escrow .escrow-image > .dropdown.bootstrap-select.open .btn.dropdown-toggle {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100% !important;
  height: 92px !important;
  min-height: 92px !important;
  margin: 0 !important;
  padding: 10px 13px 10px 12px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub) !important;
  outline: 0 !important;
}

#cl-shopping-settings-page .pay-escrow .escrow-image > .dropdown.bootstrap-select.open .btn.dropdown-toggle,
#cl-shopping-settings-page .pay-escrow .escrow-image > .dropdown.bootstrap-select .btn.dropdown-toggle:focus {
  border-color: var(--cl-green) !important;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .13) !important;
}

#cl-shopping-settings-page .pay-escrow .escrow-image > .dropdown.bootstrap-select .btn.dropdown-toggle > span {
  display: inline-flex !important;
  align-items: center;
  min-width: 0;
  max-width: calc(100% - 28px);
  height: 100%;
}

#cl-shopping-settings-page .pay-escrow .escrow-image > .dropdown.bootstrap-select .btn.dropdown-toggle > svg {
  flex: 0 0 14px;
  width: 14px !important;
  height: 14px !important;
  margin: 0 !important;
  fill: var(--cl-text-muted) !important;
  transition: transform .15s;
}

#cl-shopping-settings-page .pay-escrow .escrow-image > .dropdown.bootstrap-select.open .btn.dropdown-toggle > svg {
  transform: rotate(180deg);
}

#cl-shopping-settings-page .pay-escrow .escrow-image img {
  display: block !important;
  width: auto !important;
  height: auto !important;
  max-width: 190px !important;
  max-height: 70px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #fff !important;
  border: 1px solid #edf0f4 !important;
  border-radius: 6px !important;
  object-fit: contain;
}

#cl-shopping-settings-page .pay-escrow .escrow-image > .dropdown.bootstrap-select > .dropdown-menu {
  top: var(--cl-select-menu-top, calc(100% + 6px)) !important;
  left: 0 !important;
  width: 100% !important;
  min-width: 100% !important;
  max-width: 220px !important;
  max-height: 400px !important;
  margin: 0 !important;
  padding: 6px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  box-shadow: 0 8px 24px rgba(20, 24, 32, .14) !important;
  scrollbar-width: thin;
  scrollbar-color: #d8dce3 transparent;
}

#cl-shopping-settings-page .pay-escrow .escrow-image > .dropdown.bootstrap-select > .dropdown-menu::-webkit-scrollbar {
  width: 7px;
}

#cl-shopping-settings-page .pay-escrow .escrow-image > .dropdown.bootstrap-select > .dropdown-menu::-webkit-scrollbar-thumb {
  background: #d8dce3;
  border: 2px solid transparent;
  border-radius: 999px;
  background-clip: padding-box;
}

#cl-shopping-settings-page .pay-escrow .escrow-image > .dropdown.bootstrap-select > .dropdown-menu::-webkit-scrollbar-track {
  background: transparent;
}

#cl-shopping-settings-page .pay-escrow .escrow-image > .dropdown.bootstrap-select > .dropdown-menu > li {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
}

#cl-shopping-settings-page .pay-escrow .escrow-image > .dropdown.bootstrap-select > .dropdown-menu > li + li {
  margin-top: 4px !important;
}

#cl-shopping-settings-page .pay-escrow .escrow-image > .dropdown.bootstrap-select > .dropdown-menu > li > a,
#cl-shopping-settings-page .pay-escrow .escrow-image > .dropdown.bootstrap-select > .dropdown-menu > li > a:hover,
#cl-shopping-settings-page .pay-escrow .escrow-image > .dropdown.bootstrap-select > .dropdown-menu > li > a:focus {
  display: flex !important;
  align-items: center;
  min-height: 82px;
  margin: 0 !important;
  padding: 9px 11px !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 6px !important;
  box-shadow: none !important;
}

#cl-shopping-settings-page .pay-escrow .escrow-image > .dropdown.bootstrap-select > .dropdown-menu > li.active > a,
#cl-shopping-settings-page .pay-escrow .escrow-image > .dropdown.bootstrap-select > .dropdown-menu > li > a:hover,
#cl-shopping-settings-page .pay-escrow .escrow-image > .dropdown.bootstrap-select > .dropdown-menu > li > a:focus {
  background: #e4f7ec !important;
}

#cl-shopping-settings-page .pay-escrow .escrow-image > .dropdown.bootstrap-select > .dropdown-menu > li.active img {
  border-color: var(--cl-green) !important;
  box-shadow: 0 0 0 1px var(--cl-green) !important;
}

#cl-shopping-settings-page .bank-list {
  display: flex !important;
  align-items: center;
  gap: 10px;
  width: 100%;
  max-width: 580px;
  margin: 0 0 10px !important;
}

#cl-shopping-settings-page .bank-list-blank,
#cl-shopping-settings-page .bank-list-blank-wrap {
  display: flex !important;
  align-items: center;
  flex: 1 1 auto;
  gap: 10px;
  width: 100%;
  max-width: none !important;
  min-width: 0;
  margin: 0 !important;
  float: none !important;
}

#cl-shopping-settings-page .bank-list-blank-wrap {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

#cl-shopping-settings-page .bank-list .bank-list-blank-wrap .cl-common-form-wrap {
  width: 100% !important;
  max-width: none !important;
  min-width: 0;
  margin: 0 !important;
  float: none !important;
  flex: none;
}

#cl-shopping-settings-page .bank-list .bank-list-blank-wrap .cl-common-form-group,
#cl-shopping-settings-page .bank-list .bank-list-blank-wrap input {
  width: 100% !important;
}

#cl-shopping-settings-page .delete-bank {
  position: static !important;
  display: inline-flex !important;
  align-items: center;
  align-self: center;
  justify-content: center;
  flex: 0 0 15px;
  width: 15px;
  height: 18px;
  margin: 0 !important;
  top: auto !important;
  float: none !important;
  color: var(--cl-danger);
  cursor: pointer;
}

#cl-shopping-settings-page .delete-bank.hide {
  display: none !important;
  flex: 0 0 0 !important;
  width: 0 !important;
}

#cl-shopping-settings-page .delete-bank svg {
  width: 14px;
  height: 15px;
  fill: currentColor;
}

#cl-shopping-settings-page #bank-add {
  width: 100% !important;
  max-width: 580px;
  border-style: dashed !important;
}

#cl-shopping-settings-page #bank-add + .setting-sub-content-title {
  margin-top: 22px !important;
}

#cl-shopping-settings-page .setting-depositdue-select {
  display: flex !important;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  width: 100% !important;
  max-width: 580px;
  min-width: 0 !important;
  height: auto;
  min-height: 35px;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

#cl-shopping-settings-page .setting-depositdue-select:hover,
#cl-shopping-settings-page .setting-depositdue-select:focus-within {
  border: 0 !important;
  background: transparent !important;
}

#cl-shopping-settings-page .setting-depositdue-select > span {
  flex: 0 0 auto;
  margin: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page .setting-depositdue-select > span:last-child {
  flex: 1 1 220px;
  min-width: 0;
  white-space: normal;
  overflow-wrap: anywhere;
}

#cl-shopping-settings-page .setting-depositdue-select > svg,
#cl-shopping-settings-page .setting-depositdue-select::after {
  display: none !important;
}

#cl-shopping-settings-page .setting-depositdue-select > select {
  flex: 0 0 78px !important;
  width: 78px !important;
  min-width: 78px !important;
  height: 35px !important;
  padding: 0 28px 0 12px !important;
  background: #fff url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23B4B8BF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M6 9l6 6 6-6'/></svg>") right 8px center / 14px 14px no-repeat !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: var(--cl-radius-sm) !important;
  line-height: 33px !important;
}

#cl-shopping-settings-page .setting-depositdue-select > .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn),
#cl-shopping-settings-page .setting-depositdue-select > .bootstrap-select.dropdown {
  flex: 0 0 78px !important;
  width: 78px !important;
  max-width: 78px !important;
  min-width: 78px !important;
  height: 35px !important;
  margin: 0 !important;
}

#cl-shopping-settings-page .setting-depositdue-select > .bootstrap-select .btn.btn-default,
#cl-shopping-settings-page .setting-depositdue-select > .bootstrap-select .btn.btn-default:hover,
#cl-shopping-settings-page .setting-depositdue-select > .bootstrap-select .btn.btn-default:focus,
#cl-shopping-settings-page .setting-depositdue-select > .bootstrap-select .btn.btn-default:active,
#cl-shopping-settings-page .setting-depositdue-select > .bootstrap-select.open .btn.btn-default {
  position: relative;
  width: 78px !important;
  max-width: 78px !important;
  height: 35px !important;
  min-height: 35px !important;
  margin: 0 !important;
  padding: 0 28px 0 12px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: var(--cl-radius-sm) !important;
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 33px !important;
}

#cl-shopping-settings-page .setting-depositdue-select > .bootstrap-select.open .btn.btn-default,
#cl-shopping-settings-page .setting-depositdue-select > .bootstrap-select .btn.btn-default:focus {
  border-color: var(--cl-green) !important;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .13) !important;
}

#cl-shopping-settings-page .setting-depositdue-select > .bootstrap-select .btn.btn-default::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 8px;
  width: 14px;
  height: 14px;
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23B4B8BF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M6 9l6 6 6-6'/></svg>") center / 14px 14px no-repeat;
  transform: translateY(-50%);
  pointer-events: none;
}

#cl-shopping-settings-page .setting-depositdue-select > .bootstrap-select .filter-option,
#cl-shopping-settings-page .setting-depositdue-select > .bootstrap-select .filter-option-inner,
#cl-shopping-settings-page .setting-depositdue-select > .bootstrap-select .filter-option-inner-inner {
  display: block !important;
  width: 100% !important;
  height: 33px !important;
  margin: 0 !important;
  padding: 0 !important;
  color: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  line-height: 33px !important;
  overflow: hidden !important;
  text-align: left !important;
  white-space: nowrap !important;
}

#cl-shopping-settings-page .setting-depositdue-select > .bootstrap-select .dropdown-toggle .filter-option {
  position: static !important;
  float: none !important;
}

#cl-shopping-settings-page .setting-depositdue-select > .bootstrap-select > .dropdown-menu {
  top: var(--cl-select-menu-top, calc(100% + 4px)) !important;
  width: 78px !important;
  min-width: 78px !important;
  max-width: 78px !important;
  max-height: 184px !important;
  margin: 0 !important;
  padding: 4px !important;
  overflow: hidden !important;
}

#cl-shopping-settings-page .setting-depositdue-select > .bootstrap-select > .dropdown-menu > .inner,
#cl-shopping-settings-page .setting-depositdue-select > .bootstrap-select .dropdown-menu.inner {
  width: 100% !important;
  min-width: 0 !important;
  max-height: 176px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  scrollbar-width: thin;
  scrollbar-color: #d8dce3 transparent;
}

#cl-shopping-settings-page .setting-depositdue-select > .bootstrap-select > .dropdown-menu .dropdown-menu.inner::-webkit-scrollbar {
  width: 7px;
}

#cl-shopping-settings-page .setting-depositdue-select > .bootstrap-select > .dropdown-menu .dropdown-menu.inner::-webkit-scrollbar-thumb {
  background: #d8dce3;
  border: 2px solid transparent;
  border-radius: 999px;
  background-clip: padding-box;
}

#cl-shopping-settings-page .setting-depositdue-select > .bootstrap-select > .dropdown-menu .dropdown-menu.inner::-webkit-scrollbar-track {
  background: transparent;
}

#cl-shopping-settings-page .setting-depositdue-select > .bootstrap-select > .dropdown-menu .dropdown-menu.inner > li > a {
  display: flex !important;
  align-items: center;
  min-height: 34px !important;
  padding: 8px 10px !important;
  line-height: 18px !important;
}

#cl-shopping-settings-page .setting-depositdue-select > .bootstrap-select > .dropdown-menu .dropdown-menu.inner > li > a .text {
  display: block;
  width: 100%;
  color: inherit;
  line-height: inherit;
}

#cl-shopping-settings-page .setting-delivery-template .setting-sub-content-desc,
#cl-shopping-settings-page .setting-sub-content-desc {
  max-width: 580px;
  margin: 0 0 20px !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 1.7 !important;
}

#cl-shopping-settings-page .btn-add-template {
  float: none !important;
  clear: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px;
  width: auto !important;
  min-width: 0 !important;
  height: 42px !important;
  min-height: 0 !important;
  margin: 0 0 20px !important;
  padding: 0 20px !important;
  border: 0 !important;
  border-radius: 8px !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}

#cl-shopping-settings-page .btn-add-template svg {
  width: 16px !important;
  height: 16px !important;
  flex: 0 0 auto;
  margin: 0 !important;
  fill: none !important;
  stroke: currentColor;
  stroke-width: 2.4;
  stroke-linecap: round;
}

#cl-shopping-settings-page .delivery-template-area {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 100%;
  max-width: 580px;
  margin: 0 !important;
  padding: 0 !important;
  clear: both;
}

#cl-shopping-settings-page .template-row-box {
  display: block !important;
  width: 100%;
  max-width: 580px;
  margin: 0 !important;
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 12px;
  box-shadow: none !important;
}

#cl-shopping-settings-page .template-row-title-box {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 48px;
  margin: 0 !important;
  padding: 15px 20px !important;
  background: #fff !important;
  border: 0 !important;
  border-bottom: 1px solid var(--cl-border) !important;
  border-radius: 0 !important;
}

#cl-shopping-settings-page .template-row-title {
  display: block !important;
  flex: 1 1 auto;
  min-width: 0;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text);
  font-size: 14.5px;
  font-weight: 700;
  line-height: 20px !important;
  word-break: break-all;
}

#cl-shopping-settings-page .template-row-buttons {
  display: flex !important;
  align-items: center;
  flex: 0 0 auto !important;
  gap: 14px;
  margin: 0 !important;
  color: var(--cl-text-muted);
  fill: currentColor;
  opacity: 0;
  pointer-events: none;
  text-align: left !important;
  transition: opacity .16s ease, color .16s ease;
}

#cl-shopping-settings-page .template-row-box:hover .template-row-buttons,
#cl-shopping-settings-page .template-row-box:focus-within .template-row-buttons {
  opacity: 1;
  pointer-events: auto;
}

#cl-shopping-settings-page .template-row-buttons span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  cursor: pointer;
}

#cl-shopping-settings-page .template-row-buttons svg {
  width: 17px;
  height: 17px;
  display: block;
  fill: none !important;
  stroke: currentColor;
}

#cl-shopping-settings-page .template-row-buttons .btn-delete-template,
#cl-shopping-settings-page .template-row-buttons .btn-delete-template:hover,
#cl-shopping-settings-page .template-row-buttons .btn-delete-template:focus {
  color: var(--cl-danger) !important;
}

#cl-shopping-settings-page .template-row-buttons span:hover {
  color: var(--cl-green-text);
}

/* 배송설정 복제·삭제 확인은 공통 모달을 재사용하고 레거시 제목·본문 서체만 초기화한다. */
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap :is(.cl-delivery-copy-confirm, .cl-delivery-delete-confirm) .modal-body .modal-title {
  font-family: inherit;
  font-size: 20px;
  letter-spacing: 0;
}

body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap :is(.cl-delivery-copy-confirm, .cl-delivery-delete-confirm) .modal-body > p {
  margin: 0;
  color: var(--cl-text-sub);
  font-family: inherit;
  font-size: 13.5px;
  line-height: 1.6;
  letter-spacing: 0;
}

/* 공통 primary의 hover/focus보다 우선해 삭제 실행 버튼의 danger 색상을 유지한다. */
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-settings-dialog-wrap .modal-default .modal-dialog.cl-delivery-delete-confirm .modal-content > .modal-footer > button.ok-button-dialog {
  background: var(--cl-danger) !important;
  color: #fff !important;
}

.cl-delivery-action-popover,
body.cl-dashboard-redesign-page .cl-delivery-action-popover,
#cl-shopping-settings-page .cl-delivery-action-popover {
  min-width: 42px;
  max-width: none;
  padding: 0 !important;
  background: rgba(34, 36, 40, .94) !important;
  border: 0 !important;
  border-radius: 6px !important;
  box-shadow: var(--cl-shadow-tip) !important;
}

.cl-delivery-action-popover .popover-title,
body.cl-dashboard-redesign-page .cl-delivery-action-popover .popover-title,
#cl-shopping-settings-page .cl-delivery-action-popover .popover-title {
  display: none !important;
}

.cl-delivery-action-popover .popover-content,
body.cl-dashboard-redesign-page .cl-delivery-action-popover .popover-content,
#cl-shopping-settings-page .cl-delivery-action-popover .popover-content {
  padding: 5px 8px !important;
  color: #fff !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 18px !important;
  text-align: center !important;
  white-space: nowrap !important;
}

.cl-delivery-action-popover .arrow,
.cl-delivery-action-popover .arrow:after,
.cl-delivery-action-popover .arrow::after {
  border-color: transparent !important;
}

.cl-delivery-action-popover.top .arrow,
.cl-delivery-action-popover.top > .arrow,
body.cl-dashboard-redesign-page .cl-delivery-action-popover.top > .arrow,
#cl-shopping-settings-page .cl-delivery-action-popover.top > .arrow {
  border-top-color: rgba(34, 36, 40, .94) !important;
}

.cl-delivery-action-popover.top .arrow:after,
.cl-delivery-action-popover.top .arrow::after,
.cl-delivery-action-popover.top > .arrow:after,
.cl-delivery-action-popover.top > .arrow::after,
body.cl-dashboard-redesign-page .cl-delivery-action-popover.top > .arrow:after,
body.cl-dashboard-redesign-page .cl-delivery-action-popover.top > .arrow::after,
#cl-shopping-settings-page .cl-delivery-action-popover.top > .arrow:after,
#cl-shopping-settings-page .cl-delivery-action-popover.top > .arrow::after {
  border-top-color: rgba(34, 36, 40, .94) !important;
}

.cl-delivery-action-popover.right .arrow,
.cl-delivery-action-popover.right > .arrow,
body.cl-dashboard-redesign-page .cl-delivery-action-popover.right > .arrow,
#cl-shopping-settings-page .cl-delivery-action-popover.right > .arrow {
  border-right-color: rgba(34, 36, 40, .94) !important;
}

.cl-delivery-action-popover.right .arrow:after,
.cl-delivery-action-popover.right .arrow::after,
.cl-delivery-action-popover.right > .arrow:after,
.cl-delivery-action-popover.right > .arrow::after,
body.cl-dashboard-redesign-page .cl-delivery-action-popover.right > .arrow:after,
body.cl-dashboard-redesign-page .cl-delivery-action-popover.right > .arrow::after,
#cl-shopping-settings-page .cl-delivery-action-popover.right > .arrow:after,
#cl-shopping-settings-page .cl-delivery-action-popover.right > .arrow::after {
  border-right-color: rgba(34, 36, 40, .94) !important;
}

.cl-delivery-action-popover.bottom .arrow,
.cl-delivery-action-popover.bottom > .arrow,
body.cl-dashboard-redesign-page .cl-delivery-action-popover.bottom > .arrow,
#cl-shopping-settings-page .cl-delivery-action-popover.bottom > .arrow {
  border-bottom-color: rgba(34, 36, 40, .94) !important;
}

.cl-delivery-action-popover.bottom .arrow:after,
.cl-delivery-action-popover.bottom .arrow::after,
.cl-delivery-action-popover.bottom > .arrow:after,
.cl-delivery-action-popover.bottom > .arrow::after,
body.cl-dashboard-redesign-page .cl-delivery-action-popover.bottom > .arrow:after,
body.cl-dashboard-redesign-page .cl-delivery-action-popover.bottom > .arrow::after,
#cl-shopping-settings-page .cl-delivery-action-popover.bottom > .arrow:after,
#cl-shopping-settings-page .cl-delivery-action-popover.bottom > .arrow::after {
  border-bottom-color: rgba(34, 36, 40, .94) !important;
}

.cl-delivery-action-popover.left .arrow,
.cl-delivery-action-popover.left > .arrow,
body.cl-dashboard-redesign-page .cl-delivery-action-popover.left > .arrow,
#cl-shopping-settings-page .cl-delivery-action-popover.left > .arrow {
  border-left-color: rgba(34, 36, 40, .94) !important;
}

.cl-delivery-action-popover.left .arrow:after,
.cl-delivery-action-popover.left .arrow::after,
.cl-delivery-action-popover.left > .arrow:after,
.cl-delivery-action-popover.left > .arrow::after,
body.cl-dashboard-redesign-page .cl-delivery-action-popover.left > .arrow:after,
body.cl-dashboard-redesign-page .cl-delivery-action-popover.left > .arrow::after,
#cl-shopping-settings-page .cl-delivery-action-popover.left > .arrow:after,
#cl-shopping-settings-page .cl-delivery-action-popover.left > .arrow::after {
  border-left-color: rgba(34, 36, 40, .94) !important;
}

body.cl-dashboard-redesign-page .popover.cl-delivery-action-popover > .arrow {
  width: 10px !important;
  height: 5px !important;
  border: 0 !important;
  background: transparent !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .popover.cl-delivery-action-popover > .arrow::after {
  display: none !important;
  content: none !important;
  border: 0 !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page .popover.cl-delivery-action-popover > .arrow::before {
  content: "" !important;
  position: absolute !important;
  display: block !important;
  width: 0 !important;
  height: 0 !important;
  border-style: solid !important;
}

body.cl-dashboard-redesign-page .popover.cl-delivery-action-popover.top > .arrow {
  bottom: -5px !important;
  left: 50% !important;
  margin-left: -5px !important;
}

body.cl-dashboard-redesign-page .popover.cl-delivery-action-popover.top > .arrow::before {
  top: 0 !important;
  left: 0 !important;
  border-width: 5px 5px 0 5px !important;
  border-color: rgba(34, 36, 40, .94) transparent transparent transparent !important;
}

body.cl-dashboard-redesign-page .popover.cl-delivery-action-popover.right > .arrow {
  top: 50% !important;
  left: -5px !important;
  width: 5px !important;
  height: 10px !important;
  margin-top: -5px !important;
}

body.cl-dashboard-redesign-page .popover.cl-delivery-action-popover.right > .arrow::before {
  top: 0 !important;
  left: 0 !important;
  border-width: 5px 5px 5px 0 !important;
  border-color: transparent rgba(34, 36, 40, .94) transparent transparent !important;
}

body.cl-dashboard-redesign-page .popover.cl-delivery-action-popover.bottom > .arrow {
  top: -5px !important;
  left: 50% !important;
  margin-left: -5px !important;
}

body.cl-dashboard-redesign-page .popover.cl-delivery-action-popover.bottom > .arrow::before {
  top: 0 !important;
  left: 0 !important;
  border-width: 0 5px 5px 5px !important;
  border-color: transparent transparent rgba(34, 36, 40, .94) transparent !important;
}

body.cl-dashboard-redesign-page .popover.cl-delivery-action-popover.left > .arrow {
  top: 50% !important;
  right: -5px !important;
  width: 5px !important;
  height: 10px !important;
  margin-top: -5px !important;
}

body.cl-dashboard-redesign-page .popover.cl-delivery-action-popover.left > .arrow::before {
  top: 0 !important;
  left: 0 !important;
  border-width: 5px 0 5px 5px !important;
  border-color: transparent transparent transparent rgba(34, 36, 40, .94) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.delivery-template-modal) {
  position: fixed !important;
  inset: 0 !important;
  z-index: 999999 !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
  width: 100vw !important;
  height: 100vh !important;
  min-height: 100vh !important;
  padding: 40px 16px !important;
  overflow: auto !important;
  background: rgba(0, 0, 0, .45) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.delivery-template-modal) + .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.delivery-template-modal) + .modal-backdrop.fade,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.delivery-template-modal) + .modal-backdrop.in {
  display: none !important;
  opacity: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default:has(.modal-dialog.delivery-template-modal) {
  position: static !important;
  inset: auto !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
  width: 100% !important;
  height: auto !important;
  min-height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default:has(.modal-dialog.delivery-template-modal) > .cl-mobile-btn.close {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.delivery-template-modal {
  width: calc(100vw - 40px) !important;
  max-width: 660px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  border: 0 !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.delivery-template-modal .modal-content {
  position: relative;
  overflow: visible !important;
  padding: 36px 40px 30px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: var(--cl-radius-lg) !important;
  box-shadow: 0 24px 64px rgba(0, 0, 0, .28) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.delivery-template-modal .modal-body {
  width: 100% !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.65 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.delivery-template-modal .modal-title {
  margin: 0 34px 28px !important;
  color: var(--cl-text) !important;
  font-size: 22px !important;
  font-weight: 800 !important;
  line-height: 28px !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.delivery-template-modal .modal-content > .close.close-button-dialog {
  position: absolute !important;
  top: 14px !important;
  right: 14px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub) !important;
  font-size: 0 !important;
  line-height: 1 !important;
  opacity: 1 !important;
  transition: background-color .12s, color .15s, transform .18s cubic-bezier(.34, 1.56, .64, 1) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.delivery-template-modal .modal-content > .close.close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.delivery-template-modal .modal-content > .close.close-button-dialog:focus {
  background: #f1f2f5 !important;
  color: var(--cl-text) !important;
  outline: 0 !important;
  transform: rotate(90deg) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.delivery-template-modal .modal-content > .close.close-button-dialog svg {
  display: block;
  width: 9px !important;
  height: 9px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .delivery-template-layer,
body.cl-dashboard-redesign-page .delivery-template-modal #deliveryTemplateForm {
  width: 100%;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .setting-delivery-template {
  position: relative !important;
  width: 100% !important;
  max-width: 580px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .setting-delivery-template .setting-sub-content-desc {
  width: var(--cl-delivery-intro-width, calc(100% - 156px)) !important;
  max-width: var(--cl-delivery-intro-max-width, 410px) !important;
  margin: var(--cl-delivery-intro-margin, 0 156px 18px 0) !important;
  padding: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  word-break: keep-all !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .setting-delivery-template .setting-sub-content-desc br {
  display: none !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .setting-delivery-template .btn-add-template {
  position: var(--cl-delivery-add-position, absolute) !important;
  top: 0 !important;
  right: 0 !important;
  float: none !important;
  clear: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  width: var(--cl-delivery-add-width, auto) !important;
  min-width: 132px !important;
  height: var(--cl-delivery-add-height, 38px) !important;
  min-height: var(--cl-delivery-add-height, 38px) !important;
  margin: 0 !important;
  padding: 0 14px !important;
  background: var(--cl-green) !important;
  border: 1px solid var(--cl-green) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: #fff !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .setting-delivery-template .btn-add-template:hover,
body.cl-dashboard-redesign-page .delivery-template-modal .setting-delivery-template .btn-add-template:focus {
  background: var(--cl-green-hover) !important;
  border-color: var(--cl-green-hover) !important;
  color: #fff !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .setting-delivery-template .btn-add-template svg {
  display: block !important;
  flex: 0 0 14px !important;
  width: 14px !important;
  height: 14px !important;
  margin: 0 !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .setting-delivery-template .delivery-template-area {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  width: 100% !important;
  max-width: none !important;
  max-height: 420px !important;
  margin: 18px 0 0 !important;
  padding: 0 4px 0 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  clear: none !important;
  scrollbar-width: thin;
  scrollbar-color: #d8dce3 transparent;
}

body.cl-dashboard-redesign-page .delivery-template-modal .setting-delivery-template .delivery-template-area::-webkit-scrollbar {
  width: 7px;
}

body.cl-dashboard-redesign-page .delivery-template-modal .setting-delivery-template .delivery-template-area::-webkit-scrollbar-thumb {
  background: #d8dce3;
  border: 2px solid transparent;
  border-radius: 999px;
  background-clip: padding-box;
}

body.cl-dashboard-redesign-page .delivery-template-modal .setting-delivery-template .delivery-template-area::-webkit-scrollbar-track {
  background: transparent;
}

body.cl-dashboard-redesign-page .delivery-template-modal .setting-delivery-template .template-row-box {
  display: block !important;
  flex: 0 0 auto !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  overflow: hidden !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 10px !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .setting-delivery-template .template-row-box:empty {
  display: none !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .setting-delivery-template .delivery-template-empty {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 76px !important;
  padding: 20px !important;
  background: var(--cl-bg-subtle, #fafbfc) !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 10px !important;
  color: var(--cl-text-muted) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .setting-delivery-template .delivery-template-empty.is-error {
  color: var(--cl-danger) !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .setting-delivery-template .template-row-title-box {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  min-height: 48px !important;
  margin: 0 !important;
  padding: 14px 18px !important;
  background: #fff !important;
  border: 0 !important;
  border-bottom: 1px solid var(--cl-border) !important;
  border-radius: 0 !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .setting-delivery-template .template-row-title {
  display: block !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  color: var(--cl-text) !important;
  font-size: 14.5px !important;
  font-weight: 700 !important;
  line-height: 20px !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  word-break: keep-all !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .setting-delivery-template .template-row-buttons {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex: 0 0 auto !important;
  gap: 8px !important;
  margin: 0 !important;
  color: var(--cl-text-muted) !important;
  fill: currentColor !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  text-align: right !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .setting-delivery-template .template-row-buttons span {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 28px !important;
  height: 28px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border-radius: 7px !important;
  color: inherit !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .setting-delivery-template .template-row-buttons span:hover,
body.cl-dashboard-redesign-page .delivery-template-modal .setting-delivery-template .template-row-buttons span:focus {
  background: #eaf9f1 !important;
  color: var(--cl-green-text) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .setting-delivery-template .template-row-buttons .btn-delete-template:hover,
body.cl-dashboard-redesign-page .delivery-template-modal .setting-delivery-template .template-row-buttons .btn-delete-template:focus {
  background: rgba(238, 68, 95, .1) !important;
  color: var(--cl-danger) !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .setting-delivery-template .template-row-buttons svg {
  display: block !important;
  width: 15px !important;
  height: 15px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .setting-delivery-template .template-row-content {
  margin: 0 !important;
  padding: 14px 18px 16px !important;
  background: #fff !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  word-break: keep-all !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .setting-delivery-template .template-row-content > span.cm-popover-info {
  position: static !important;
  display: flex !important;
  align-items: center !important;
  width: max-content !important;
  margin: 6px 0 0 !important;
  color: var(--cl-green-text) !important;
  line-height: inherit !important;
  vertical-align: baseline !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .delivery-template-layer .item-row {
  display: grid !important;
  grid-template-columns: 118px minmax(0, 1fr);
  gap: 20px;
  align-items: flex-start;
  margin: 0 !important;
  padding: 20px 0 !important;
  border: 0 !important;
  box-shadow: inset 0 -1px #f0f1f4;
}

body.cl-dashboard-redesign-page .delivery-template-modal .delivery-template-layer .item-row:first-child {
  padding-top: 0 !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .delivery-template-layer .item-row:last-child {
  padding-bottom: 20px !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .delivery-template-layer .item-row > div:first-child {
  display: block !important;
  min-height: 0;
  padding-top: 0 !important;
  padding-right: 0 !important;
  color: var(--cl-text) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 20px !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .delivery-template-layer .item-row > div:nth-child(2) {
  min-width: 0;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  line-height: 1.65 !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .cm-popover-info {
  position: static !important;
  top: auto !important;
  display: inline-block !important;
  width: 14px !important;
  height: 14px !important;
  margin: 0 0 0 5px !important;
  fill: var(--cl-accent-blue, #03C75A) !important;
  color: var(--cl-accent-blue, #03C75A) !important;
  vertical-align: -2px;
}

body.cl-dashboard-redesign-page .delivery-template-modal input.form-control,
body.cl-dashboard-redesign-page .delivery-template-modal select.form-control {
  box-sizing: border-box !important;
  height: 40px !important;
  min-height: 40px !important;
  padding: 0 13px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 38px !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal input.form-control:focus,
body.cl-dashboard-redesign-page .delivery-template-modal select.form-control:focus,
body.cl-dashboard-redesign-page .delivery-template-modal .bootstrap-select.open > .dropdown-toggle,
body.cl-dashboard-redesign-page .delivery-template-modal .bootstrap-select > .dropdown-toggle:focus {
  border-color: var(--cl-green) !important;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .13) !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal input.form-control[readonly],
body.cl-dashboard-redesign-page .delivery-template-modal input.form-control:disabled,
body.cl-dashboard-redesign-page .delivery-template-modal select.form-control:disabled {
  background: #f7f8fa !important;
  color: var(--cl-text-muted) !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .delivery-template-layer .item-row > div:nth-child(2) > .bootstrap-select:first-child,
body.cl-dashboard-redesign-page .delivery-template-modal .delivery-template-layer .item-row > div:nth-child(2) > select.form-control:first-child + .bootstrap-select {
  margin-bottom: 5px !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .error-box,
body.cl-dashboard-redesign-page .delivery-template-modal input.form-control.error-box,
body.cl-dashboard-redesign-page .delivery-template-modal select.form-control.error-box,
body.cl-dashboard-redesign-page .delivery-template-modal .bootstrap-select.error-box > .dropdown-toggle {
  border-color: var(--cl-danger) !important;
  box-shadow: 0 0 0 3px rgba(238, 68, 95, .12) !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .error {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  width: 100%;
  margin: 6px 0 0 !important;
  color: var(--cl-danger) !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  line-height: 18px !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .error svg {
  flex: 0 0 auto;
  display: block !important;
  width: 13px !important;
  height: 13px !important;
  margin: 0 !important;
  transform: none !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .error svg path,
body.cl-dashboard-redesign-page .delivery-template-modal .error svg rect {
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .m5t,
body.cl-dashboard-redesign-page .delivery-template-modal .m10t,
body.cl-dashboard-redesign-page .delivery-template-modal .m15t {
  margin-top: 8px !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .row-sub-title {
  display: flex;
  align-items: center;
  gap: 5px;
  margin: 16px 0 7px !important;
  color: var(--cl-text-sub) !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  line-height: 18px !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .row-sub-title:first-child {
  margin-top: 0 !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .m5t:has(> input.form-control),
body.cl-dashboard-redesign-page .delivery-template-modal .m10t:has(> input.form-control),
body.cl-dashboard-redesign-page .delivery-template-modal .m15t:has(> input.form-control),
body.cl-dashboard-redesign-page .delivery-template-modal .make-to-order-row .m5t {
  display: flex !important;
  align-items: center;
  gap: 8px;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  line-height: 20px !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .m5t input.form-control,
body.cl-dashboard-redesign-page .delivery-template-modal .m10t input.form-control,
body.cl-dashboard-redesign-page .delivery-template-modal .m15t input.form-control {
  flex: 1 1 auto;
  max-width: 160px;
}

body.cl-dashboard-redesign-page .delivery-template-modal .free-condition-row:not([style*="display: none"]) {
  display: block !important;
  float: none !important;
  width: 100%;
}

body.cl-dashboard-redesign-page .delivery-template-modal .fix-row.free-condition-row > .row-sub-title,
body.cl-dashboard-redesign-page .delivery-template-modal .free-condition-row:not(.fix-row) > .row-sub-title:first-child {
  display: flex;
  width: 100%;
  margin: 0 0 7px !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .fix-row.free-condition-row > .m5t {
  display: flex !important;
  align-items: center;
  flex-wrap: nowrap;
  gap: 8px;
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  margin-top: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  line-height: 20px !important;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .delivery-template-modal .fix-row.free-condition-row > .m5t input.form-control {
  flex: 1 1 0;
  width: auto !important;
  min-width: 0;
  max-width: none;
  text-align: right;
}

body.cl-dashboard-redesign-page .delivery-template-modal .free-condition-row:not(.fix-row) {
  margin-top: 16px !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .free-condition-row:not(.fix-row) > .m5t {
  display: flex !important;
  align-items: center;
  flex-wrap: nowrap;
  gap: 8px;
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  line-height: 20px !important;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .delivery-template-modal .free-condition-row:not(.fix-row) > .m5t input.form-control {
  flex: 1 1 0;
  width: auto !important;
  min-width: 0;
  max-width: none;
  text-align: right;
}

body.cl-dashboard-redesign-page .delivery-template-modal .free-condition-row:not(.fix-row) > .row-sub-title.m10t {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  margin-top: 10px !important;
  color: var(--cl-text-sub) !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  line-height: 18px !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .free-condition-row:not(.fix-row) > .row-sub-title.m10t .cm-popover-info {
  flex: 0 0 13px;
  display: block !important;
  width: 13px !important;
  height: 13px !important;
  margin: 2px 0 0 !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .free-condition-row > .error.m5t {
  display: flex !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  gap: 6px !important;
  width: 100%;
  margin: 6px 0 0 !important;
  color: var(--cl-danger) !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  line-height: 18px !important;
  white-space: normal !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .free-condition-row > .error.m5t svg {
  flex: 0 0 13px;
  display: block !important;
  width: 13px !important;
  height: 13px !important;
  margin: 0 !important;
  transform: none !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .mix-yn-row,
body.cl-dashboard-redesign-page .delivery-template-modal .additional-yn-row,
body.cl-dashboard-redesign-page .delivery-template-modal .pay-type-row,
body.cl-dashboard-redesign-page .delivery-template-modal .make-to-order-yn-row,
body.cl-dashboard-redesign-page .delivery-template-modal .install-fee-yn-row {
  display: inline-flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center;
  gap: 22px;
  width: auto !important;
  max-width: 100%;
}

/* 상세 입력칸이 열려도 사용 여부 라디오는 항목 제목 높이를 유지한다. */
body.cl-dashboard-redesign-page .delivery-template-modal .additional-yn-row,
body.cl-dashboard-redesign-page .delivery-template-modal .make-to-order-yn-row {
  align-items: flex-start;
}

body.cl-dashboard-redesign-page .delivery-template-modal .additional-yn-row > .additional-row {
  margin-top: 0 !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .delivery-type-row {
  box-sizing: border-box;
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap;
  align-items: center;
  gap: 0;
  width: 100%;
}

body.cl-dashboard-redesign-page .delivery-template-modal .delivery-type-row::before {
  content: "";
  order: 1;
  flex: 0 0 100%;
  width: 100%;
  height: 10px;
  pointer-events: none;
}

body.cl-dashboard-redesign-page .delivery-template-modal label {
  position: relative;
  display: inline-flex !important;
  align-items: center;
  flex: 0 0 auto;
  gap: 6px;
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  line-height: 20px !important;
  white-space: nowrap;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .delivery-template-modal .delivery-type-row > label:not(.btn-delivery-type) {
  order: 2;
  flex: 0 0 auto;
  height: 20px;
  align-items: center !important;
  line-height: 20px !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal label input[type="radio"],
body.cl-dashboard-redesign-page .delivery-template-modal label input[type="checkbox"] {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: 0 !important;
  opacity: 0 !important;
  pointer-events: none;
}

body.cl-dashboard-redesign-page .delivery-template-modal label input[type="radio"] + svg,
body.cl-dashboard-redesign-page .delivery-template-modal label input[type="checkbox"] + svg,
body.cl-dashboard-redesign-page .delivery-template-modal label input[type="radio"] + svg + svg,
body.cl-dashboard-redesign-page .delivery-template-modal label input[type="checkbox"] + svg + svg {
  flex: 0 0 auto;
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal label input[type="checkbox"] + svg,
body.cl-dashboard-redesign-page .delivery-template-modal label input[type="checkbox"] + svg + svg {
  width: 16px !important;
  height: 16px !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal label input[type="radio"] + svg,
body.cl-dashboard-redesign-page .delivery-template-modal label input[type="checkbox"] + svg {
  display: block;
  color: #c9cdd4;
}

body.cl-dashboard-redesign-page .delivery-template-modal label input[type="radio"] + svg + svg,
body.cl-dashboard-redesign-page .delivery-template-modal label input[type="checkbox"] + svg + svg {
  display: none;
  color: var(--cl-green);
}

body.cl-dashboard-redesign-page .delivery-template-modal label input[type="radio"]:checked + svg,
body.cl-dashboard-redesign-page .delivery-template-modal label input[type="checkbox"]:checked + svg {
  display: none;
}

body.cl-dashboard-redesign-page .delivery-template-modal label input[type="radio"]:checked + svg + svg,
body.cl-dashboard-redesign-page .delivery-template-modal label input[type="checkbox"]:checked + svg + svg {
  display: block;
}

body.cl-dashboard-redesign-page .delivery-template-modal label:has(> input[type="checkbox"]) {
  display: inline-grid !important;
  grid-template-columns: 16px auto;
  align-items: center !important;
  height: 20px;
  min-height: 20px;
  column-gap: 7px;
  line-height: 20px !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal label:has(> input[type="checkbox"]) > input[type="checkbox"] + svg,
body.cl-dashboard-redesign-page .delivery-template-modal label:has(> input[type="checkbox"]) > input[type="checkbox"] + svg + svg {
  align-self: center;
  justify-self: center;
  display: block !important;
  flex: 0 0 16px;
  grid-column: 1;
  grid-row: 1;
  position: static !important;
  width: 16px !important;
  height: 16px !important;
  min-width: 16px !important;
  max-width: 16px !important;
  margin: 0 !important;
  inset: auto !important;
  transform: none !important;
  vertical-align: top !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal label:has(> input[type="checkbox"]) > input[type="checkbox"]:not(:checked) + svg + svg,
body.cl-dashboard-redesign-page .delivery-template-modal label:has(> input[type="checkbox"]) > input[type="checkbox"]:checked + svg {
  display: none !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal label:not(.btn-delivery-type):not(:has(> input[type="radio"] + div)) > input[type="radio"] + svg,
body.cl-dashboard-redesign-page .delivery-template-modal label:not(.btn-delivery-type):not(:has(> input[type="radio"] + div)) > input[type="radio"] + svg + svg {
  display: none !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal label:not(.btn-delivery-type):not(:has(> input[type="radio"] + div)):has(> input[type="radio"])::before,
body.cl-dashboard-redesign-page .delivery-template-modal label:not(.btn-delivery-type):not(:has(> input[type="radio"] + div)):has(> input[type="radio"])::after {
  content: "";
  display: block;
  box-sizing: border-box;
  border-radius: 50%;
  pointer-events: none;
}

body.cl-dashboard-redesign-page .delivery-template-modal label:not(.btn-delivery-type):not(:has(> input[type="radio"] + div)):has(> input[type="radio"])::before {
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
  background: #fff;
  border: 2px solid #dbdcdf;
}

body.cl-dashboard-redesign-page .delivery-template-modal label:not(.btn-delivery-type):not(:has(> input[type="radio"] + div)):has(> input[type="radio"])::after {
  position: absolute;
  top: 50%;
  left: 5px;
  width: 8px;
  height: 8px;
  background: var(--cl-green);
  transform: translateY(-50%) scale(0);
  transition: transform .12s;
}

body.cl-dashboard-redesign-page .delivery-template-modal label:not(.btn-delivery-type):not(:has(> input[type="radio"] + div)):has(> input[type="radio"]:checked)::before {
  border-color: var(--cl-green);
}

body.cl-dashboard-redesign-page .delivery-template-modal label:not(.btn-delivery-type):not(:has(> input[type="radio"] + div)):has(> input[type="radio"]:checked)::after {
  transform: translateY(-50%) scale(1);
}

body.cl-dashboard-redesign-page .delivery-template-modal .btn-delivery-type {
  display: inline-flex !important;
  flex: 0 0 50% !important;
  order: 0;
  box-sizing: border-box;
  width: 50% !important;
  min-width: 0;
  max-width: 50% !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .btn-delivery-type:nth-of-type(2) {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .btn-delivery-type > div {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  height: 40px;
  padding: 0 18px;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-left: 0 !important;
  border-radius: 0;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px;
  font-weight: 600;
  line-height: 38px;
  transition: background-color .12s, border-color .12s, color .12s;
}

body.cl-dashboard-redesign-page .delivery-template-modal .btn-delivery-type > div::before {
  content: "";
  display: none;
  box-sizing: border-box;
  flex: 0 0 auto;
  width: 12px;
  height: 7px;
  margin: -2px 7px 0 0;
  border-left: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(-45deg);
}

body.cl-dashboard-redesign-page .delivery-template-modal .price-type-detail-method-row label > div {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: 100% !important;
  min-width: 0;
  height: 40px;
  padding: 0 18px;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-left: 0 !important;
  border-radius: 0;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px;
  font-weight: 600;
  line-height: 38px;
  transition: background-color .12s, color .12s;
}

body.cl-dashboard-redesign-page .delivery-template-modal .btn-delivery-type:first-of-type > div {
  border-left: 1px solid var(--cl-border) !important;
  border-radius: 6px 0 0 6px;
}

body.cl-dashboard-redesign-page .delivery-template-modal .btn-delivery-type:nth-of-type(2) > div {
  border-radius: 0 6px 6px 0;
}

body.cl-dashboard-redesign-page .delivery-template-modal .price-type-detail-method-row label:first-of-type > div {
  border-left: 1px solid var(--cl-border) !important;
  border-radius: 6px 0 0 6px;
}

body.cl-dashboard-redesign-page .delivery-template-modal .price-type-detail-method-row label:last-of-type > div {
  border-radius: 0 6px 6px 0;
}

body.cl-dashboard-redesign-page .delivery-template-modal .delivery-type-row > label:not(.btn-delivery-type) {
  margin-right: 26px !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .delivery-type-row > label:not(.btn-delivery-type):last-of-type {
  margin-right: 0 !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .price-type-detail-method-row label > input:checked + div {
  background: #fff !important;
  border-color: var(--cl-green) !important;
  color: var(--cl-green-text) !important;
  font-weight: 700;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .price-type-detail-method-row label:hover > div {
  background: #fafbfc !important;
  color: var(--cl-text) !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .price-type-detail-method-row label:hover > input:checked + div {
  background: #fff !important;
  border-color: var(--cl-green) !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .price-type-detail-method-row label:not(:first-of-type) > input:checked + div {
  margin-left: -1px;
  border-left: 1px solid var(--cl-green) !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .btn-delivery-type:hover > div {
  background: #fafbfc !important;
  color: var(--cl-text) !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .btn-delivery-type > input:checked + div,
body.cl-dashboard-redesign-page .delivery-template-modal .btn-delivery-type:hover > input:checked + div {
  background: #fff !important;
  border-color: var(--cl-green) !important;
  color: var(--cl-green-text) !important;
  font-weight: 700;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .btn-delivery-type:not(:first-of-type) > input:checked + div {
  margin-left: -1px;
  border-left: 1px solid var(--cl-green) !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .btn-delivery-type > input:checked + div::before {
  display: block;
}

body.cl-dashboard-redesign-page .delivery-template-modal .btn-delivery-type > input:focus + div {
  box-shadow: none !important;
}

@media (max-width: 520px) {
  body.cl-dashboard-redesign-page .delivery-template-modal .btn-delivery-type {
    flex: 0 0 50% !important;
    width: 50% !important;
    min-width: 0;
    max-width: 50% !important;
  }

  body.cl-dashboard-redesign-page .delivery-template-modal .btn-delivery-type > div {
    width: 100%;
    min-width: 0;
  }
}

body.cl-dashboard-redesign-page .delivery-template-modal .price-type-detail-method-row label > input:focus + div {
  border-color: var(--cl-green) !important;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .13) !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .delivery-company-row,
body.cl-dashboard-redesign-page .delivery-template-modal .additional-row,
body.cl-dashboard-redesign-page .delivery-template-modal .make-to-order-row,
body.cl-dashboard-redesign-page .delivery-template-modal .quantity-row,
body.cl-dashboard-redesign-page .delivery-template-modal .weight-row {
  width: 100%;
}

body.cl-dashboard-redesign-page .delivery-template-modal .delivery-company-row {
  order: 3;
  flex: 0 0 100%;
  margin-top: 16px;
}

body.cl-dashboard-redesign-page .delivery-template-modal .disabled-area {
  opacity: .55;
}

body.cl-dashboard-redesign-page .delivery-template-modal .bootstrap-select.form-control,
body.cl-dashboard-redesign-page .delivery-template-modal .bootstrap-select {
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .bootstrap-select > .dropdown-toggle,
body.cl-dashboard-redesign-page .delivery-template-modal .bootstrap-select > .dropdown-toggle:hover,
body.cl-dashboard-redesign-page .delivery-template-modal .bootstrap-select > .dropdown-toggle:focus {
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center;
  width: 100% !important;
  height: 40px !important;
  min-height: 40px !important;
  padding: 0 36px 0 13px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .bootstrap-select.open > .dropdown-toggle,
body.cl-dashboard-redesign-page .delivery-template-modal .bootstrap-select > .dropdown-toggle:focus {
  border-color: var(--cl-green) !important;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .13) !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .bootstrap-select > .dropdown-toggle .filter-option,
body.cl-dashboard-redesign-page .delivery-template-modal .bootstrap-select > .dropdown-toggle .filter-option-inner,
body.cl-dashboard-redesign-page .delivery-template-modal .bootstrap-select > .dropdown-toggle .filter-option-inner-inner {
  display: flex !important;
  align-items: center !important;
  min-width: 0;
  height: 100%;
  overflow: hidden;
  width: 100%;
  color: inherit !important;
  line-height: 1 !important;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .delivery-template-modal .bootstrap-select > .dropdown-toggle .filter-option {
  float: none !important;
  gap: 4px;
}

body.cl-dashboard-redesign-page .delivery-template-modal .bootstrap-select > .dropdown-toggle .filter-option-inner-inner {
  gap: 4px;
}

body.cl-dashboard-redesign-page .delivery-template-modal .delivery-company-row .bootstrap-select > .dropdown-toggle .filter-option svg,
body.cl-dashboard-redesign-page .delivery-template-modal .delivery-company-row .bootstrap-select > .dropdown-toggle .filter-option img {
  display: block !important;
  flex: 0 0 auto;
  align-self: center !important;
  width: 24px !important;
  height: 24px !important;
  margin: 0 !important;
  color: var(--cl-blue, #03C75A);
  fill: currentColor;
  vertical-align: middle !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .bootstrap-select > .dropdown-toggle .caret {
  position: absolute !important;
  top: 50% !important;
  right: 13px !important;
  width: 7px !important;
  height: 7px !important;
  margin: -5px 0 0 !important;
  border: 0 !important;
  border-right: 1.5px solid var(--cl-text-muted) !important;
  border-bottom: 1.5px solid var(--cl-text-muted) !important;
  transform: rotate(45deg);
}

body.cl-dashboard-redesign-page .delivery-template-modal .bootstrap-select.open > .dropdown-toggle .caret {
  margin-top: -1px !important;
  transform: rotate(225deg);
}

body.cl-dashboard-redesign-page .delivery-template-modal .bootstrap-select > .dropdown-menu {
  overflow: hidden !important;
  margin: 6px 0 0 !important;
  padding: 6px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 10px !important;
  box-shadow: 0 10px 28px rgba(20, 24, 32, .12) !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .bootstrap-select > .dropdown-menu .dropdown-menu.inner {
  max-height: 220px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow-y: auto !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .bootstrap-select > .dropdown-menu li > a {
  display: flex !important;
  align-items: center;
  box-sizing: border-box !important;
  height: 40px !important;
  min-height: 40px !important;
  padding: 0 10px !important;
  border-radius: 7px;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  line-height: 1 !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .bootstrap-select > .dropdown-menu li > a span.text,
body.cl-dashboard-redesign-page .delivery-template-modal .bootstrap-select > .dropdown-menu li > a .text {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px;
  min-height: 18px;
  line-height: 18px !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .bootstrap-select > .dropdown-menu li > a span.text > *,
body.cl-dashboard-redesign-page .delivery-template-modal .bootstrap-select > .dropdown-menu li > a .text > * {
  display: block;
  flex: 0 0 auto;
  align-self: center;
  vertical-align: middle;
}

body.cl-dashboard-redesign-page .delivery-template-modal .bootstrap-select > .dropdown-menu li.selected > a,
body.cl-dashboard-redesign-page .delivery-template-modal .bootstrap-select > .dropdown-menu li > a:hover,
body.cl-dashboard-redesign-page .delivery-template-modal .bootstrap-select > .dropdown-menu li > a:focus {
  background: #e4f7ec !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .price-type-detail-method-row {
  display: flex;
  align-items: center;
  gap: 0;
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  margin-top: 16px !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .price-type-detail-method-row label {
  display: inline-flex !important;
  flex: 0 0 50% !important;
  box-sizing: border-box;
  width: 50% !important;
  min-width: 0 !important;
  max-width: 50% !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .quantity-differential,
body.cl-dashboard-redesign-page .delivery-template-modal .weight-differential,
body.cl-dashboard-redesign-page .delivery-template-modal .quantity-repeat,
body.cl-dashboard-redesign-page .delivery-template-modal .weight-repeat {
  box-sizing: border-box;
  width: 100%;
  margin-top: 12px;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
}

body.cl-dashboard-redesign-page .delivery-template-modal .quantity-differential table,
body.cl-dashboard-redesign-page .delivery-template-modal .weight-differential table {
  display: block;
  width: 100%;
  margin: 0;
  border-collapse: separate;
  border-spacing: 0;
}

body.cl-dashboard-redesign-page .delivery-template-modal .quantity-differential colgroup,
body.cl-dashboard-redesign-page .delivery-template-modal .weight-differential colgroup {
  display: none;
}

body.cl-dashboard-redesign-page .delivery-template-modal .quantity-differential tbody,
body.cl-dashboard-redesign-page .delivery-template-modal .weight-differential tbody {
  display: block;
  width: 100%;
}

body.cl-dashboard-redesign-page .delivery-template-modal .quantity-differential tr,
body.cl-dashboard-redesign-page .delivery-template-modal .weight-differential tr {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 24px;
  column-gap: 10px;
  align-items: center;
  width: 100%;
  margin: 0 0 10px;
}

body.cl-dashboard-redesign-page .delivery-template-modal .quantity-differential tr:last-child,
body.cl-dashboard-redesign-page .delivery-template-modal .weight-differential tr:last-child {
  margin-bottom: 0;
}

body.cl-dashboard-redesign-page .delivery-template-modal .quantity-differential td,
body.cl-dashboard-redesign-page .delivery-template-modal .weight-differential td {
  display: flex !important;
  flex-direction: row;
  align-items: center;
  gap: 8px;
  min-width: 0;
  padding: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  line-height: 20px !important;
  vertical-align: middle;
  white-space: nowrap;
}

  body.cl-dashboard-redesign-page .delivery-template-modal .quantity-differential td:last-child,
  body.cl-dashboard-redesign-page .delivery-template-modal .weight-differential td:last-child {
  align-items: center;
  justify-content: flex-start;
  width: auto;
  padding-right: 0 !important;
  padding-top: 0 !important;
  text-align: center;
}

body.cl-dashboard-redesign-page .delivery-template-modal .quantity-differential input.form-control,
body.cl-dashboard-redesign-page .delivery-template-modal .weight-differential input.form-control {
  display: inline-flex;
  flex: 1 1 0;
  min-width: 0;
  width: auto !important;
  height: 40px !important;
  min-height: 40px !important;
  line-height: 40px !important;
  text-align: right;
}

body.cl-dashboard-redesign-page .delivery-template-modal .quantity-differential input[name="quantity_differential_value[]"],
body.cl-dashboard-redesign-page .delivery-template-modal .weight-differential input[name="weight_differential_value[]"] {
  width: auto !important;
  max-width: none !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .quantity-differential input[name="quantity_differential_price[]"],
body.cl-dashboard-redesign-page .delivery-template-modal .weight-differential input[name="weight_differential_price[]"] {
  width: auto !important;
  max-width: none !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .quantity-repeat,
body.cl-dashboard-redesign-page .delivery-template-modal .weight-repeat {
  width: 100%;
  margin-top: 12px;
}

body.cl-dashboard-redesign-page .delivery-template-modal .quantity-repeat > .m5t,
body.cl-dashboard-redesign-page .delivery-template-modal .quantity-repeat > .m10t,
body.cl-dashboard-redesign-page .delivery-template-modal .weight-repeat > .m5t,
body.cl-dashboard-redesign-page .delivery-template-modal .weight-repeat > .m10t {
  display: flex !important;
  align-items: center;
  flex-wrap: nowrap;
  gap: 8px;
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  line-height: 20px !important;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .delivery-template-modal .quantity-repeat input.form-control,
body.cl-dashboard-redesign-page .delivery-template-modal .weight-repeat input.form-control {
  flex: 1 1 0;
  width: auto !important;
  min-width: 0;
  max-width: none !important;
  text-align: right;
}

body.cl-dashboard-redesign-page .delivery-template-modal .quantity-differential input.form-control[readonly],
body.cl-dashboard-redesign-page .delivery-template-modal .weight-differential input.form-control[readonly] {
  background: #f7f8fa !important;
  color: var(--cl-text-sub) !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .quantity-differential > div,
body.cl-dashboard-redesign-page .delivery-template-modal .weight-differential > div {
  width: 100%;
  margin-top: 12px;
}

body.cl-dashboard-redesign-page .delivery-template-modal .btn-quantity-diff,
body.cl-dashboard-redesign-page .delivery-template-modal .btn-weight-diff {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 100% !important;
  min-width: 0 !important;
  height: 40px !important;
  margin-top: 0 !important;
  padding: 0 16px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 6px !important;
  color: var(--cl-green-text) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 20px !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .quantity-row.weight-row > .row-sub-title.m10t {
  display: flex !important;
  align-items: flex-start;
  gap: 6px;
  margin: 8px 0 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  line-height: 18px !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .quantity-row.weight-row > .row-sub-title.m10t .cm-popover-info {
  flex: 0 0 13px;
  display: block !important;
  width: 13px !important;
  height: 13px !important;
  margin: 2px 0 0 !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .btn-quantity-diff:hover,
body.cl-dashboard-redesign-page .delivery-template-modal .btn-quantity-diff:focus,
body.cl-dashboard-redesign-page .delivery-template-modal .btn-weight-diff:hover,
body.cl-dashboard-redesign-page .delivery-template-modal .btn-weight-diff:focus {
  background: var(--cl-green-soft) !important;
  border-color: var(--cl-green) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .delivery-template-modal .btn-delete-condition-row {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  color: var(--cl-danger) !important;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .delivery-template-modal .btn-delete-condition-row svg {
  width: 14px !important;
  height: 14px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.delivery-template-modal .modal-footer {
  display: flex !important;
  flex-direction: column;
  gap: 14px;
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 20px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.delivery-template-modal .modal-footer .btn {
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.delivery-template-modal .modal-footer .ok-button-dialog,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.delivery-template-modal .modal-footer .ok-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.delivery-template-modal .modal-footer .ok-button-dialog:focus {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  order: 1;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 46px !important;
  margin: 0 !important;
  padding: 0 18px !important;
  background: var(--cl-green) !important;
  border: 1px solid var(--cl-green) !important;
  border-radius: 9px !important;
  box-shadow: none !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  text-decoration: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.delivery-template-modal .modal-footer .ok-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.delivery-template-modal .modal-footer .ok-button-dialog:focus {
  background: var(--cl-green-hover) !important;
  border-color: var(--cl-green-hover) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.delivery-template-modal .modal-footer .close-button-dialog {
  order: 2;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-delivery-condition-delete) {
  position: fixed !important;
  inset: 0 !important;
  z-index: 1000002 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100vw !important;
  height: 100vh !important;
  padding: 24px !important;
  overflow: auto !important;
  background: rgba(0, 0, 0, .45) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-delivery-condition-delete) + .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-delivery-condition-delete) + .modal-backdrop.fade,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-delivery-condition-delete) + .modal-backdrop.in {
  display: none !important;
  opacity: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default:has(.modal-dialog.cl-delivery-condition-delete) {
  position: static !important;
  inset: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: auto !important;
  min-height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default:has(.modal-dialog.cl-delivery-condition-delete) > .cl-mobile-btn.close {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-delivery-condition-delete {
  width: calc(100vw - 48px) !important;
  max-width: 420px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  border: 0 !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-delivery-condition-delete .modal-content {
  position: relative;
  overflow: visible !important;
  padding: 30px 32px 26px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: var(--cl-radius-lg) !important;
  box-shadow: 0 24px 64px rgba(0, 0, 0, .28) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-delivery-condition-delete .modal-body {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  color: var(--cl-text-sub) !important;
  font-size: 14px !important;
  line-height: 22px !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-delivery-condition-delete .modal-title {
  margin: 0 0 10px !important;
  color: var(--cl-text) !important;
  font-size: 20px !important;
  font-weight: 800 !important;
  line-height: 28px !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-delivery-condition-delete .delivery-condition-delete-message {
  margin: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 22px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-delivery-condition-delete .modal-content > .close.close-button-dialog {
  position: absolute !important;
  top: 18px !important;
  right: 18px !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px !important;
  color: var(--cl-text-sub) !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-delivery-condition-delete .modal-content > .close.close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-delivery-condition-delete .modal-content > .close.close-button-dialog:focus {
  background: #f1f2f5 !important;
  color: var(--cl-text) !important;
  outline: 0 !important;
  transform: rotate(90deg) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-delivery-condition-delete .modal-content > .close.close-button-dialog svg {
  display: block;
  width: 9px !important;
  height: 9px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-delivery-condition-delete .modal-footer {
  display: flex !important;
  flex-direction: column;
  gap: 10px;
  width: 100% !important;
  margin: 24px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-delivery-condition-delete .modal-footer .btn {
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 44px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  border-radius: 9px !important;
  box-shadow: none !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-delivery-condition-delete .modal-footer .ok-button-dialog,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-delivery-condition-delete .modal-footer .ok-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-delivery-condition-delete .modal-footer .ok-button-dialog:focus {
  order: 1;
  background: var(--cl-danger) !important;
  border: 1px solid var(--cl-danger) !important;
  color: #fff !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-delivery-condition-delete .modal-footer .close-button-dialog {
  order: 2;
}

#cl-shopping-settings-page .template-row-content {
  margin: 0 !important;
  padding: 16px 20px !important;
  color: var(--cl-text-sub);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 1.7;
  background: #fff !important;
  border: 0 !important;
  border-radius: 0 !important;
}

#cl-shopping-settings-page .naverpay_info {
  max-width: 580px;
  margin-top: 20px;
  padding: 20px 22px;
  border: 1px solid var(--cl-border);
  border-radius: 10px;
}

#cl-shopping-settings-page .naverpay_info ul {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

#cl-shopping-settings-page .naverpay_info li {
  position: relative;
  display: block !important;
  margin: 0 !important;
  padding: 0 0 0 14px !important;
  color: var(--cl-text-sub);
  font-size: 12.5px;
  line-height: 2;
}

#cl-shopping-settings-page .naverpay_info li:first-child {
  padding-left: 0 !important;
}

#cl-shopping-settings-page .naverpay_info li:not(:first-child)::before {
  content: "·";
  position: absolute;
  left: 3px;
}

#cl-shopping-settings-page .naverpay_info .info-title {
  display: none;
}

#cl-shopping-settings-page .naverpay_info .info-contents-title {
  margin: 0 0 14px !important;
  color: var(--cl-text) !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  line-height: 20px !important;
}

#cl-shopping-settings-page .naverpay_info .info-contents {
  display: inline;
  margin: 0 !important;
  color: inherit !important;
  font-size: inherit !important;
  line-height: inherit !important;
}

#cl-shopping-settings-page .naverpay_info a,
#cl-shopping-settings-page .npay_important {
  color: var(--cl-green-text) !important;
  font-weight: 600;
}

#cl-shopping-settings-page .npay-request-btn {
  width: 100% !important;
  max-width: 460px;
  margin: 4px 0 0 !important;
  background: #e9ebee !important;
  border-color: #e9ebee !important;
  color: var(--cl-text-muted) !important;
  cursor: default;
}

#cl-shopping-settings-page #npay-use-setting .setting-sub-content-box,
#cl-shopping-settings-page #npay-use-setting .setting-sub-content.npay {
  display: block !important;
  width: 100% !important;
  max-width: 580px;
}

#cl-shopping-settings-page #npay-use-setting .box-sub-content-title.mb-25 {
  display: flex !important;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 0;
  width: 100% !important;
  max-width: 580px;
  margin: 0 0 14px !important;
}

#cl-shopping-settings-page #npay-use-setting .box-sub-content-title.mb-25 > span:first-child {
  flex: 1 1 auto;
  min-width: 0;
  color: var(--cl-text) !important;
  font-weight: 700 !important;
  white-space: nowrap;
}

#cl-shopping-settings-page #npay-use-setting .box-sub-content-title.mb-25 > .switch_onoff_btn {
  margin-left: auto !important;
}

#cl-shopping-settings-page #npay-use-setting .npay-info-text {
  display: block !important;
  flex: 0 0 100%;
  width: 100% !important;
  margin: 12px 0 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.8 !important;
}

#cl-shopping-settings-page #npay-use-setting .naverpay-key {
  display: block !important;
  float: none !important;
  clear: both;
  width: 100% !important;
  max-width: 580px;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

#cl-shopping-settings-page #npay-use-setting .naverpay-key::before,
#cl-shopping-settings-page #npay-use-setting .naverpay-key::after {
  display: none !important;
  content: none !important;
}

#cl-shopping-settings-page #npay-use-setting .npay-code-input,
#cl-shopping-settings-page #npay-use-setting .npay-key-input {
  display: block !important;
  float: none !important;
  clear: both;
  width: 100% !important;
  max-width: 580px !important;
  margin: 0 0 22px !important;
  padding: 0 !important;
}

#cl-shopping-settings-page #npay-use-setting .npay-code-input > .mb-5 {
  display: flex !important;
  float: none !important;
  clear: both;
  align-items: center;
  gap: 5px;
  width: 100% !important;
  max-width: 580px;
  margin: 0 0 8px !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 18px !important;
  white-space: normal;
}

#cl-shopping-settings-page #npay-use-setting .npay-code-input > .cl-common-form-wrap,
#cl-shopping-settings-page #npay-use-setting .npay-code-input > .setting-npay-select {
  display: block !important;
  float: none !important;
  clear: both;
  width: 100% !important;
  max-width: 580px !important;
}

#cl-shopping-settings-page #npay-use-setting .npay-key-input > .cl-common-form-wrap.nonplace-holder {
  height: 44px !important;
  min-height: 44px !important;
  margin: 0 !important;
}

#cl-shopping-settings-page #npay-use-setting .npay-key-input .cl-common-form-group {
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  height: 44px !important;
  min-height: 44px !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

#cl-shopping-settings-page #npay-use-setting .npay-key-input .setting-input {
  display: block !important;
  float: none !important;
  width: 100% !important;
  max-width: none !important;
  height: 42px !important;
  margin: 0 !important;
  padding: 0 14px !important;
  box-sizing: border-box !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  line-height: 42px !important;
}

#cl-shopping-settings-page #npay-use-setting .setting-npay-select {
  display: flex !important;
  align-items: center;
  height: 44px;
  min-width: 0;
  padding: 0;
  border-radius: 8px;
}

#cl-shopping-settings-page #npay-use-setting .setting-npay-select select {
  height: 42px;
  line-height: 42px;
}

#cl-shopping-settings-page #npay-use-setting .setting-npay-select > .bootstrap-select:not([class*=col-]),
#cl-shopping-settings-page #npay-use-setting .setting-npay-select > .bootstrap-select.form-control,
#cl-shopping-settings-page #npay-use-setting .setting-npay-select > .bootstrap-select.dropdown {
  width: 100% !important;
  max-width: none !important;
  height: 42px !important;
}

#cl-shopping-settings-page #npay-use-setting .setting-npay-select > .bootstrap-select .btn.btn-default,
#cl-shopping-settings-page #npay-use-setting .setting-npay-select > .bootstrap-select .btn.btn-default:hover,
#cl-shopping-settings-page #npay-use-setting .setting-npay-select > .bootstrap-select .btn.btn-default:focus,
#cl-shopping-settings-page #npay-use-setting .setting-npay-select > .bootstrap-select .btn.btn-default:active,
#cl-shopping-settings-page #npay-use-setting .setting-npay-select > .bootstrap-select.open .btn.btn-default {
  height: 42px !important;
  min-height: 42px !important;
  line-height: 42px !important;
}

#cl-shopping-settings-page #npay-use-setting .setting-npay-select > .bootstrap-select .filter-option,
#cl-shopping-settings-page #npay-use-setting .setting-npay-select > .bootstrap-select .filter-option-inner,
#cl-shopping-settings-page #npay-use-setting .setting-npay-select > .bootstrap-select .filter-option-inner-inner {
  height: 42px !important;
  line-height: 42px !important;
}

#cl-shopping-settings-page #npay-use-setting .naverpay-key.disabled .setting-npay-select,
#cl-shopping-settings-page #npay-use-setting .setting-sub-content.npay[data-mode="disabled"] .setting-npay-select,
#cl-shopping-settings-page #npay-use-setting .naverpay-key.disabled .cl-common-form-group,
#cl-shopping-settings-page #npay-use-setting .setting-sub-content.npay[data-mode="disabled"] .cl-common-form-group {
  background: #f4f5f9 !important;
}

#cl-shopping-settings-page #npay-use-setting .npay-request-btn {
  display: flex !important;
  width: 100% !important;
  max-width: 580px !important;
  height: 48px !important;
  margin: 0 !important;
  border-radius: 8px !important;
  font-size: 14px !important;
  font-weight: 700 !important;
}

/* 네이버페이 연동 심사: 첨부 소스의 단계·상태별 폼. 저장 필드는 기존 DOM을 재사용한다. */
body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-body {
  display: flex !important;
  flex-direction: column;
  min-width: 0;
  height: auto !important;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-body > * {
  flex-shrink: 0;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-stage {
  order: 1;
  width: 100%;
  min-width: 0;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 8px 12px;
  margin-bottom: 18px;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-head h3 {
  margin: 0;
  color: var(--cl-text);
  font-size: 14px;
  font-weight: 700;
  line-height: 20px;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-badge {
  flex: none;
  padding: 5px 11px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.2;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-badge.wait {
  background: #f1f3f5;
  color: var(--cl-text-sub);
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-badge.ing {
  background: #fff4e5;
  color: #c77700;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-badge.done {
  background: var(--cl-green-soft);
  color: var(--cl-green-text);
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-steps {
  display: flex;
  margin-bottom: 22px;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-step {
  position: relative;
  flex: 1 1 0;
  min-width: 0;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-step + .cl-npay-step::before {
  position: absolute;
  top: 21px;
  right: calc(50% + 27px);
  left: calc(-50% + 27px);
  height: 2px;
  background: var(--cl-border);
  content: "";
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-step:is(.done, .active)::before {
  background: var(--cl-green-action);
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-step-button {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  font-family: inherit;
  cursor: default;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-dot {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border: 2px solid #e0e3e8;
  border-radius: 50%;
  background: var(--cl-surface);
  color: var(--cl-text-muted);
  font-size: 15px;
  font-weight: 700;
  line-height: 1;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-dot svg {
  display: none;
  width: 20px;
  height: 20px;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-step.done .cl-npay-dot {
  border-color: var(--cl-green-action);
  background: var(--cl-green-action);
  color: #fff;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-step.done .cl-npay-dot svg {
  display: block;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-step.done .cl-npay-number {
  display: none;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-step.active .cl-npay-dot {
  border-color: var(--cl-green-action);
  color: var(--cl-green-text);
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-name {
  color: var(--cl-text-muted);
  font-size: 13.5px;
  line-height: 18px;
  text-align: center;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-step.done .cl-npay-name {
  color: var(--cl-text);
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-step.active .cl-npay-name {
  color: var(--cl-green-text);
  font-weight: 600;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-notice {
  display: flow-root;
  height: auto;
  padding: 18px 20px;
  border: 1px solid var(--cl-border);
  border-radius: 10px;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-notice strong {
  display: block;
  color: var(--cl-text);
  font-size: 13.5px;
  font-weight: 700;
  line-height: 20px;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-notice p,
body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-toggle-row p {
  position: static;
  float: none;
  width: auto;
  height: auto;
  margin: 8px 0 0;
  color: var(--cl-text-sub);
  font-size: 13px;
  line-height: 1.75;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-body .cl-npay-use-row {
  order: 2;
  position: relative;
  align-items: center;
  margin: 26px 0 0 !important;
  padding: 26px 0 16px !important;
  border-top: 1px solid var(--cl-line);
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-toggles {
  order: 3;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-toggle-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  padding: 16px 0;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-toggle-row strong {
  color: var(--cl-text);
  font-size: 14px;
  font-weight: 700;
  line-height: 20px;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-toggle-row p {
  margin-top: 6px;
  line-height: 1.6;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-toggle-row .switch {
  position: relative;
  display: inline-block;
  flex: 0 0 36px;
  width: 36px;
  height: 20px;
  margin: 3px 0 0;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-toggle-row .switch input {
  position: absolute;
  inset: 0;
  z-index: 1;
  width: 36px;
  height: 20px;
  margin: 0;
  opacity: 0;
  cursor: pointer;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-toggle-row .switch-set-label {
  position: absolute;
  inset: 0;
  width: 36px;
  height: 20px;
  border-radius: 999px;
  background: #d5d9e0;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-toggle-row .switch-set-handle {
  position: absolute;
  top: 3px;
  left: 3px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #fff;
  box-shadow: none;
  pointer-events: none;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-toggle-row input:checked ~ .switch-set-label {
  background: var(--cl-green-action);
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-toggle-row input:checked ~ .switch-set-handle {
  left: 19px;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-design-block {
  order: 4;
  margin-bottom: 10px;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-design-title {
  margin: 12px 0 16px !important;
  color: var(--cl-text) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-design-options {
  display: flex !important;
  flex-direction: column;
  gap: 10px;
  width: 100%;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-design-options .newcheckbox,
body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-design-options label {
  display: flex !important;
  align-items: center;
  flex-wrap: nowrap !important;
  gap: 12px;
  width: 100%;
  min-width: 0;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-design-options label {
  padding: 6px 0 !important;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-design-options .newcheckboxSvgRadio {
  flex: 0 0 18px;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-design-options .npay_img {
  flex: 0 1 272px;
  min-width: 0;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-info-head {
  order: 5;
  margin-top: 34px;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-info-separator {
  margin-top: 10px;
  padding-top: 26px;
  border-top: 1px solid var(--cl-line);
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-note {
  color: var(--cl-text-muted);
  font-size: 13px;
  line-height: 20px;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-body > .npay-info-text {
  order: 6;
  margin: 0 0 14px !important;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-body > .naverpay-key {
  order: 7;
  height: auto;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-domain-display {
  display: block;
  float: none;
  width: 100%;
  max-width: none;
  height: 44px;
  margin: 0;
  padding: 0 14px;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
  background: var(--cl-page-bg) !important;
  color: var(--cl-text-muted) !important;
  font-size: 14px;
}

/* 입력 잠금 레이어(z-index: 99)는 유지하고 신청 도메인 도움말만 위에 표시한다. */
body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-body .npay-code-input > .mb-5 > .cm-popover-info {
  z-index: 100;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-keys-locked .cl-common-form-group {
  background: var(--cl-page-bg) !important;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-keys-locked .setting-input {
  color: var(--cl-text-muted) !important;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-body .cl-npay-form-values,
body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-body .request-complete,
body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-domain-locked > .setting-npay-select,
body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-body > .setting-disabled.npayuse,
body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-body [hidden] {
  display: none !important;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-locked {
  pointer-events: none;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-use-row .switch-input:checked ~ .switch-set-label {
  background: var(--cl-green-action) !important;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-body .npay-request-btn:disabled,
body.cl-dashboard-redesign-page #cl-shopping-settings-page[data-setting-tab="naverpay"] .setting-button:disabled {
  background: #e9ebee !important;
  border-color: #e9ebee !important;
  color: var(--cl-text-muted) !important;
  cursor: default;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-body .npay-request-btn.npaybtnActivate:not(:disabled) {
  background: var(--cl-green-action) !important;
  border-color: var(--cl-green-action) !important;
  color: #fff !important;
  cursor: pointer;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-body .npay-request-btn.npaybtnActivate:not(:disabled):hover {
  background: var(--cl-green-hover) !important;
}

body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-toggle-row input:focus-visible ~ .switch-set-label {
  outline: 2px solid var(--cl-green) !important;
  outline-offset: 3px;
}

@media (max-width: 600px) {
  body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-steps {
    margin-bottom: 18px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-dot {
    width: 36px;
    height: 36px;
    font-size: 14px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-step + .cl-npay-step::before {
    top: 18px;
    right: calc(50% + 24px);
    left: calc(-50% + 24px);
  }

  body.cl-dashboard-redesign-page #cl-shopping-settings-page #npay-use-setting .cl-npay-name {
    font-size: 12px;
  }
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-naverpay-notice) {
  position: fixed !important;
  inset: 0 !important;
  z-index: 999999 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100vw !important;
  height: 100vh !important;
  min-height: 100vh !important;
  padding: 24px !important;
  overflow: auto !important;
  background: rgba(0, 0, 0, .45) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-naverpay-notice) + .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-naverpay-notice) + .modal-backdrop.fade,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-naverpay-notice) + .modal-backdrop.in {
  display: none !important;
  opacity: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default:has(.modal-dialog.cl-naverpay-notice) {
  position: static !important;
  inset: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: auto !important;
  min-height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default:has(.modal-dialog.cl-naverpay-notice) > .cl-mobile-btn.close {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-naverpay-notice {
  width: calc(100vw - 48px) !important;
  max-width: 430px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  border: 0 !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-naverpay-notice .modal-content {
  position: relative;
  overflow: visible !important;
  padding: 32px 34px 28px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: var(--cl-radius-lg) !important;
  box-shadow: 0 24px 64px rgba(0, 0, 0, .28) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-naverpay-notice .modal-body {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  color: var(--cl-text-sub) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 22px !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-naverpay-notice .modal-title {
  margin: 0 34px 18px !important;
  color: var(--cl-text) !important;
  font-size: 20px !important;
  font-weight: 800 !important;
  line-height: 28px !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-naverpay-notice .modal-content > .close.close-button-dialog {
  position: absolute !important;
  top: 16px !important;
  right: 16px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub) !important;
  font-size: 0 !important;
  line-height: 1 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-naverpay-notice .modal-content > .close.close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-naverpay-notice .modal-content > .close.close-button-dialog:focus {
  background: #f1f2f5 !important;
  color: var(--cl-text) !important;
  outline: 0 !important;
  transform: rotate(90deg) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-naverpay-notice .modal-content > .close.close-button-dialog svg {
  display: block;
  width: 9px !important;
  height: 9px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-naverpay-notice .modal-footer {
  display: flex !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: none !important;
  margin: 26px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-naverpay-notice .modal-footer .close-button-dialog,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-naverpay-notice .modal-footer .close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-naverpay-notice .modal-footer .close-button-dialog:focus {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: none !important;
  height: 46px !important;
  margin: 0 !important;
  padding: 0 18px !important;
  background: var(--cl-green) !important;
  border: 1px solid var(--cl-green) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: #fff !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-naverpay-notice .modal-footer .close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-naverpay-notice .modal-footer .close-button-dialog:focus {
  background: var(--cl-green-hover) !important;
  border-color: var(--cl-green-hover) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-source-notification-guard-notice) {
  position: fixed !important;
  inset: 0 !important;
  z-index: 1000000 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100vw !important;
  height: 100vh !important;
  min-height: 100vh !important;
  padding: 24px !important;
  overflow: hidden !important;
  background: rgba(0, 0, 0, .45) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-source-notification-guard-notice) + .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-source-notification-guard-notice) + .modal-backdrop.fade,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-source-notification-guard-notice) + .modal-backdrop.in {
  display: none !important;
  opacity: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default:has(.modal-dialog.cl-source-notification-guard-notice) {
  position: static !important;
  inset: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: auto !important;
  min-height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default:has(.modal-dialog.cl-source-notification-guard-notice) > .cl-mobile-btn.close {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-notification-guard-notice {
  width: calc(100vw - 48px) !important;
  max-width: 430px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  border: 0 !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-notification-guard-notice .modal-content {
  position: relative !important;
  overflow: visible !important;
  padding: 32px 34px 28px !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: var(--cl-radius-lg) !important;
  background: #fff !important;
  box-shadow: 0 24px 64px rgba(0, 0, 0, .28) !important;
  color: var(--cl-text) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-notification-guard-notice .modal-body {
  width: 100% !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  color: var(--cl-text-sub) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 22px !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-notification-guard-notice .modal-title {
  margin: 0 34px 18px !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-size: 20px !important;
  font-weight: 800 !important;
  line-height: 28px !important;
  text-align: center !important;
  letter-spacing: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-notification-guard-notice .modal-content > .close.close-button-dialog {
  position: absolute !important;
  top: 16px !important;
  right: 16px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  min-height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--cl-text-sub) !important;
  font-size: 0 !important;
  line-height: 1 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-notification-guard-notice .modal-content > .close.close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-notification-guard-notice .modal-content > .close.close-button-dialog:focus {
  background: #f1f2f5 !important;
  color: var(--cl-text) !important;
  outline: 0 !important;
  transform: rotate(90deg) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-notification-guard-notice .modal-content > .close.close-button-dialog svg {
  display: block !important;
  width: 9px !important;
  height: 9px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-notification-guard-notice .modal-footer {
  display: flex !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: none !important;
  margin: 26px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-notification-guard-notice .modal-footer .close-button-dialog,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-notification-guard-notice .modal-footer .close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-notification-guard-notice .modal-footer .close-button-dialog:focus {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: none !important;
  height: 46px !important;
  margin: 0 !important;
  padding: 0 18px !important;
  border: 1px solid var(--cl-green) !important;
  border-radius: 8px !important;
  background: var(--cl-green) !important;
  box-shadow: none !important;
  color: #fff !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-notification-guard-notice .modal-footer .close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-notification-guard-notice .modal-footer .close-button-dialog:focus {
  background: var(--cl-green-hover) !important;
  border-color: var(--cl-green-hover) !important;
}

#cl-shopping-settings-page .setting-sub-content-box.setting-sub-content:has(> #npay-joinbtn) > .npay-btn {
  width: 140px !important;
  min-width: 140px !important;
  height: 46px !important;
  padding: 0 20px !important;
  border-radius: 8px !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  vertical-align: top;
}

#cl-shopping-settings-page .setting-sub-content-box.setting-sub-content:has(> #npay-joinbtn) > #npay-btn {
  margin-right: 0 !important;
}

#cl-shopping-settings-page .setting-sub-content-box.setting-sub-content:has(> #npay-joinbtn) > #npay-joinbtn {
  width: 148px !important;
  min-width: 148px !important;
  margin-left: 8px !important;
  background: #fff !important;
  border-color: var(--cl-border) !important;
  color: var(--cl-text-sub) !important;
}

#cl-shopping-settings-page .setting-sub-content-box.setting-sub-content:has(> #npay-joinbtn) > #npay-joinbtn:hover,
#cl-shopping-settings-page .setting-sub-content-box.setting-sub-content:has(> #npay-joinbtn) > #npay-joinbtn:focus {
  border-color: var(--cl-green) !important;
  color: var(--cl-green-text) !important;
}

#cl-shopping-settings-page .setting-sub-content-title.npay-review {
  width: 100% !important;
  max-width: 580px;
  margin: 26px 0 12px !important;
  padding-top: 0 !important;
  color: var(--cl-text) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 20px !important;
  background: transparent !important;
  border: 0 !important;
  border-top: 0 !important;
  box-shadow: none !important;
}

#cl-shopping-settings-page .setting-sub-content-title.npay-review::before,
#cl-shopping-settings-page .setting-sub-content-title.npay-review::after {
  display: none !important;
  content: none !important;
}

#cl-shopping-settings-page #npay-use-setting .setting-sub-content-title.npay-review + .setting-sub-content-radio-box {
  display: inline-flex !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  gap: 22px !important;
  width: auto !important;
  max-width: 580px;
  margin: 0 0 26px !important;
  color: var(--cl-text) !important;
}

#cl-shopping-settings-page #npay-use-setting .setting-sub-content-title.npay-review + .setting-sub-content-radio-box .newcheckbox,
#cl-shopping-settings-page #npay-use-setting .setting-sub-content-title.npay-review + .setting-sub-content-radio-box .newcheckbox label,
#cl-shopping-settings-page #npay-use-setting .setting-sub-content-title.npay-review + .setting-sub-content-radio-box .newcheckbox span {
  color: var(--cl-text) !important;
}

#cl-shopping-settings-page #npay-use-setting .setting-sub-content-title.npay-review + .setting-sub-content-radio-box .newcheckbox.shopping_disabled {
  opacity: 1 !important;
}

#cl-shopping-settings-page #npay-use-setting .setting-sub-content-title.npay-review + .setting-sub-content-radio-box + .setting-sub-content-title {
  display: flex !important;
  width: 100% !important;
  max-width: 580px;
  margin: 0 0 12px !important;
  color: var(--cl-text) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 20px !important;
}

#cl-shopping-settings-page #npay-use-setting .setting-sub-content-title.npay-review + .setting-sub-content-radio-box + .setting-sub-content-title + .setting-sub-content-radio-box {
  display: flex !important;
  align-items: flex-start !important;
  flex-direction: column;
  flex-wrap: nowrap !important;
  gap: 10px !important;
  width: 100% !important;
  max-width: 420px;
  min-height: 0;
  margin: 0 !important;
  padding: 0 !important;
}

#cl-shopping-settings-page #npay-use-setting .setting-sub-content-title.npay-review + .setting-sub-content-radio-box + .setting-sub-content-title + .setting-sub-content-radio-box > .newcheckbox {
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

#cl-shopping-settings-page #npay-use-setting .setting-sub-content-title.npay-review + .setting-sub-content-radio-box + .setting-sub-content-title + .setting-sub-content-radio-box > .newcheckbox > label {
  display: inline-flex !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  gap: 12px !important;
  width: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

#cl-shopping-settings-page .npay_img {
  display: inline-flex;
  align-items: center;
  min-height: 0;
}

#cl-shopping-settings-page .npay_img img {
  display: block;
  width: 272px;
  max-width: 100%;
  height: auto;
  max-height: none;
}

#cl-shopping-settings-page .pay-vcnt .setting-vcnt-setting {
  display: block;
  max-width: 580px;
}

#cl-shopping-settings-page .pay-vcnt .setting-vcnt-setting p {
  margin: 0 0 6px !important;
}

#cl-shopping-settings-page .pay-vcnt .setting-vcnt-setting p:last-child {
  margin-bottom: 0 !important;
}

#cl-shopping-settings-page .pay-vcnt .vcnt-setting {
  color: var(--cl-green-text) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 20px !important;
  text-decoration: none !important;
  cursor: pointer;
}

#cl-shopping-settings-page .pay-vcnt .vcnt-setting:hover {
  color: var(--cl-green-text) !important;
  text-decoration: underline !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-s-vcnt-guide),
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-vcnt-escrow-info) {
  position: fixed !important;
  inset: 0 !important;
  z-index: 999999 !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
  width: 100vw !important;
  height: 100vh !important;
  min-height: 100vh !important;
  padding: 40px 16px !important;
  overflow: auto !important;
  background: rgba(0, 0, 0, .45) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-s-vcnt-guide) + .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-s-vcnt-guide) + .modal-backdrop.fade,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-s-vcnt-guide) + .modal-backdrop.in,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-vcnt-escrow-info) + .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-vcnt-escrow-info) + .modal-backdrop.fade,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-vcnt-escrow-info) + .modal-backdrop.in {
  display: none !important;
  opacity: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default:has(.modal-dialog.cl-s-vcnt-guide),
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default:has(.modal-dialog.cl-vcnt-escrow-info) {
  position: static !important;
  inset: auto !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
  width: 100% !important;
  height: auto !important;
  min-height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-vcnt-guide,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-vcnt-escrow-info {
  width: calc(100vw - 40px) !important;
  margin: 0 auto !important;
  padding: 0 !important;
  border: 0 !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-vcnt-guide {
  max-width: 760px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-vcnt-escrow-info {
  max-width: 430px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-vcnt-guide .modal-content,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-vcnt-escrow-info .modal-content {
  overflow: hidden !important;
  padding: 30px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: var(--cl-radius-lg) !important;
  box-shadow: 0 24px 64px rgba(20, 24, 32, .22) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-vcnt-guide .modal-title,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-vcnt-escrow-info .modal-title {
  margin: 0 34px 22px !important;
  color: var(--cl-text) !important;
  font-size: 20px !important;
  font-weight: 800 !important;
  line-height: 26px !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-vcnt-guide .modal-title {
  margin-bottom: 24px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-vcnt-guide .modal-content > .close.close-button-dialog,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-vcnt-escrow-info .modal-content > .close.close-button-dialog {
  position: absolute !important;
  top: 14px !important;
  right: 14px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub) !important;
  font-size: 0 !important;
  line-height: 1 !important;
  opacity: 1 !important;
  transition: background-color .12s, color .15s, transform .18s cubic-bezier(.34, 1.56, .64, 1) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-vcnt-guide .modal-content > .close.close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-vcnt-guide .modal-content > .close.close-button-dialog:focus,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-vcnt-escrow-info .modal-content > .close.close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-vcnt-escrow-info .modal-content > .close.close-button-dialog:focus {
  background: #f1f2f5 !important;
  color: var(--cl-text) !important;
  outline: 0 !important;
  transform: rotate(90deg) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-vcnt-guide .modal-body,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-vcnt-escrow-info .modal-body {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.75 !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-vcnt-guide .modal-body {
  max-height: none !important;
  overflow: visible !important;
  padding-right: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-vcnt-escrow-info .modal-body {
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-vcnt-escrow-info .modal-body br {
  display: none;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-vcnt-escrow-info .modal-body .vcnt-setting {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: auto !important;
  height: auto !important;
  margin: 14px auto 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  color: var(--cl-green-text) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 20px !important;
  text-decoration: none !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-vcnt-escrow-info .modal-body .vcnt-setting:hover {
  color: var(--cl-green-text) !important;
  text-decoration: underline !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-vcnt-escrow-info .modal-footer {
  display: flex !important;
  justify-content: center !important;
  margin: 24px 0 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-vcnt-escrow-info .modal-footer .ok-button-dialog,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-vcnt-escrow-info .modal-footer .ok-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-vcnt-escrow-info .modal-footer .ok-button-dialog:focus {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100px !important;
  height: 44px !important;
  margin: 0 !important;
  padding: 0 18px !important;
  background: var(--cl-green) !important;
  border: 1px solid var(--cl-green) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-vcnt-escrow-info .modal-footer .ok-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-vcnt-escrow-info .modal-footer .ok-button-dialog:focus {
  background: var(--cl-green-hover) !important;
  border-color: var(--cl-green-hover) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-vcnt-guide .vcnt-guide-modal {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  line-height: 1.75 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-vcnt-guide .vcnt-guide-modal > div,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-vcnt-guide .vcnt-guide-modal > div.mb-70 {
  margin: 0 0 26px !important;
  padding: 0 0 26px !important;
  border-bottom: 1px solid var(--cl-line);
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-vcnt-guide .vcnt-guide-modal > div:last-child {
  margin-bottom: 18px !important;
  padding-bottom: 0 !important;
  border-bottom: 0;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-vcnt-guide .vcnt-guide-modal img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-vcnt-guide .vcnt-guide-modal p {
  margin: 12px 0 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.75 !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-vcnt-guide .vcnt-guide-modal p b {
  color: var(--cl-text) !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-vcnt-guide .vcnt-guide-modal p a {
  color: var(--cl-green-text) !important;
  font-weight: 700 !important;
  border-bottom: 1px solid currentColor !important;
  text-decoration: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-vcnt-guide .vcnt-guide-modal p span {
  float: none !important;
  display: inline !important;
  width: auto !important;
  padding-left: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-vcnt-guide .vcnt-guide-modal p span[style*="#ee445f"] {
  margin-right: 4px;
  color: var(--cl-danger) !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-vcnt-guide .modal-body > .close-button-dialog,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-vcnt-guide .modal-body > .close-button-dialog.clostbtnfalse,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-vcnt-guide .modal-body > .close-button-dialog.clostbtnfalse:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-vcnt-guide .modal-body > .close-button-dialog.clostbtnfalse:focus {
  position: static !important;
  left: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 46px !important;
  margin: 18px auto 0 !important;
  padding: 0 16px !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 9px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-vcnt-guide .modal-body > .close-button-dialog.clostbtnfalse:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-s-vcnt-guide .modal-body > .close-button-dialog.clostbtnfalse:focus {
  background: var(--cl-green-soft) !important;
  color: var(--cl-green-text) !important;
}

#cl-shopping-settings-page .setting-sub-content-title + .common-selectbox,
#cl-shopping-settings-page .setting-sub-content-title + .setting-sub-content-radio-box,
#cl-shopping-settings-page .setting-sub-content-title + .pg-key {
  margin-top: 0 !important;
}

#cl-shopping-settings-page .nshop-product-dburl,
#cl-shopping-settings-page .nshop-sale-epurl {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#cl-shopping-settings-page[data-setting-tab="navershop"] .setting-sub-content-box.setting-sub-content {
  display: block !important;
  float: none !important;
  width: 100% !important;
  max-width: 580px !important;
  margin: 0 !important;
  padding: 0 !important;
}

#cl-shopping-settings-page[data-setting-tab="navershop"] .setting-sub-content-box.setting-sub-content > #npay-btn {
  display: inline-flex !important;
  float: none !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 172px !important;
  width: auto !important;
  height: 42px !important;
  margin: 0 0 26px !important;
  padding: 0 22px !important;
  background: var(--cl-green) !important;
  border: 1px solid var(--cl-green) !important;
  border-radius: 8px !important;
  color: #fff !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}

#cl-shopping-settings-page[data-setting-tab="navershop"] .setting-sub-content-box.setting-sub-content > #npay-btn:hover,
#cl-shopping-settings-page[data-setting-tab="navershop"] .setting-sub-content-box.setting-sub-content > #npay-btn:focus {
  background: var(--cl-green-hover) !important;
  border-color: var(--cl-green-hover) !important;
  color: #fff !important;
}

#cl-shopping-settings-page[data-setting-tab="navershop"] .setting-sub-content-box.setting-sub-content > .setting-sub-content {
  display: block !important;
  float: none !important;
  width: 100% !important;
  max-width: 580px !important;
  margin: 0 !important;
  padding: 0 !important;
  clear: both !important;
}

#cl-shopping-settings-page[data-setting-tab="navershop"] .setting-sub-content-box.setting-sub-content > .setting-sub-content > .setting-sub-content-title.mt-30:first-child {
  margin-top: 0 !important;
}

#cl-shopping-settings-page[data-setting-tab="navershop"] .setting-sub-content-box.setting-sub-content > .setting-sub-content > .setting-sub-content-title.mt-30 {
  margin-top: 26px !important;
  margin-bottom: 12px !important;
  color: var(--cl-text) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 20px !important;
}

#cl-shopping-settings-page[data-setting-tab="navershop"] .setting-sub-content-radio-box + .pg-key {
  margin-top: 24px !important;
}

#cl-shopping-settings-page[data-setting-tab="navershop"] .pg-key {
  display: flex !important;
  flex-direction: column !important;
  gap: 22px !important;
  float: none !important;
  width: 100% !important;
  max-width: 580px !important;
  margin-right: 0 !important;
  margin-left: 0 !important;
  padding: 0 !important;
}

#cl-shopping-settings-page[data-setting-tab="navershop"] .nshopping-input {
  display: block !important;
  float: none !important;
  width: 100% !important;
  max-width: 580px !important;
  margin: 0 !important;
  padding: 0 !important;
}

#cl-shopping-settings-page[data-setting-tab="navershop"] .nshopping-input:last-child {
  margin-bottom: 0 !important;
}

#cl-shopping-settings-page[data-setting-tab="navershop"] .nshopping-input > .mb-5 {
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  margin: 0 0 8px !important;
  color: var(--cl-text-sub) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 18px !important;
}

#cl-shopping-settings-page[data-setting-tab="navershop"] .nshopping-input > .cl-common-form-wrap.nonplace-holder,
#cl-shopping-settings-page[data-setting-tab="navershop"] .nshopping-input .cl-common-form-group {
  width: 100% !important;
  max-width: none !important;
}

#cl-shopping-settings-page[data-setting-tab="navershop"] .nshopping-input > .cl-common-form-wrap.nonplace-holder {
  display: block !important;
  float: none !important;
  max-width: 580px !important;
  margin: 0 !important;
}

#cl-shopping-settings-page[data-setting-tab="navershop"] .nshopping-input .cl-common-form-group > span {
  color: var(--cl-text-muted) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
}

#cl-shopping-settings-page[data-setting-tab="navershop"] .setting-sub-content:has(input[name="nshop_setting"][value="N"]:checked) .nshopping-input .cl-common-form-group {
  background: #f4f5f9 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog .modal-content > .close,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog .modal-content > button.close,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog .modal-content > .modal-close,
body.cl-source-card-add-modal-open #billingCardModalRoot .card-add-modal-default .modal-content > .modal-close,
body.cl-dashboard-redesign-page .cl-source-social-guide-modal .modal-dialog > .modal-content > .close,
body.cl-dashboard-redesign-page .cl-source-uadmin-modal .modal-content > .close {
  transition: background-color .12s, color .15s, transform .18s cubic-bezier(.34, 1.56, .64, 1) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog .modal-content > .close:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog .modal-content > .close:focus,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog .modal-content > button.close:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog .modal-content > button.close:focus,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog .modal-content > .modal-close:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog .modal-content > .modal-close:focus,
body.cl-source-card-add-modal-open #billingCardModalRoot .card-add-modal-default .modal-content > .modal-close:hover,
body.cl-source-card-add-modal-open #billingCardModalRoot .card-add-modal-default .modal-content > .modal-close:focus,
body.cl-dashboard-redesign-page .cl-source-social-guide-modal .modal-dialog > .modal-content > .close:hover,
body.cl-dashboard-redesign-page .cl-source-social-guide-modal .modal-dialog > .modal-content > .close:focus,
body.cl-dashboard-redesign-page .cl-source-uadmin-modal .modal-content > .close:hover,
body.cl-dashboard-redesign-page .cl-source-uadmin-modal .modal-content > .close:focus {
  transform: rotate(90deg) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-cmmodal:has(.site-upgrade-notice) .modal-content > .close.close-button-dialog svg,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.jcol-selecttype-modal .modal-content > .close svg,
body.cl-dashboard-redesign-page .cl-source-social-guide-modal .modal-dialog > .modal-content > .close svg,
body.cl-dashboard-redesign-page .cl-source-uadmin-modal .modal-content > .close svg,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.shopping-listitem-modal .modal-content > .close.close-button-dialog svg,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal .modal-content button.close svg,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-manage-modal .modal-content > .close.close-button-dialog svg,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog .modal-content > .close svg,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog .modal-content > .modal-close svg {
  width: 15px !important;
  height: 15px !important;
}

/* 알림 > 발신번호 등록 팝업 */
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-source-sms-register-modal),
.flat-modal.cl-common-modal.cl-source-sms-register-modal-wrap {
  position: fixed !important;
  inset: 0 !important;
  z-index: 999999 !important;
  display: block !important;
  width: 100vw !important;
  height: 100vh !important;
  min-height: 100vh !important;
  padding: 0 !important;
  background: transparent !important;
  overflow: hidden !important;
}

html:has(body.cl-dashboard-redesign-page .modal-dialog.cl-source-sms-register-modal),
body.cl-dashboard-redesign-page:has(.modal-dialog.cl-source-sms-register-modal) {
  overflow: hidden !important;
  overscroll-behavior: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-source-sms-register-modal) + .modal-backdrop,
.flat-modal.cl-common-modal.cl-source-sms-register-modal-wrap + .modal-backdrop,
.flat-modal.cl-common-modal.cl-source-sms-register-modal-wrap + .modal-backdrop.fade,
.flat-modal.cl-common-modal.cl-source-sms-register-modal-wrap + .modal-backdrop.in {
  display: none !important;
  opacity: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default:has(.modal-dialog.cl-source-sms-register-modal),
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default.in:has(.modal-dialog.cl-source-sms-register-modal),
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default.show:has(.modal-dialog.cl-source-sms-register-modal),
.flat-modal.cl-common-modal.cl-source-sms-register-modal-wrap .modal-default,
.flat-modal.cl-common-modal.cl-source-sms-register-modal-wrap .modal-default.in,
.flat-modal.cl-common-modal.cl-source-sms-register-modal-wrap .modal-default.show {
  position: fixed !important;
  inset: 0 !important;
  z-index: 999999 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100vw !important;
  height: 100vh !important;
  min-height: 100vh !important;
  margin: 0 !important;
  padding: 32px 16px !important;
  background: rgba(0, 0, 0, .45) !important;
  overflow: hidden !important;
  overscroll-behavior: contain !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default:has(.modal-dialog.cl-source-sms-register-modal) > .cl-mobile-btn.close,
.flat-modal.cl-common-modal.cl-source-sms-register-modal-wrap .modal-default > .cl-mobile-btn.close {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal,
.flat-modal.cl-common-modal.cl-source-sms-register-modal-wrap .modal-default .modal-dialog.cl-source-sms-register-modal {
  width: 560px !important;
  max-width: calc(100vw - 32px) !important;
  height: auto !important;
  max-height: calc(100vh - 64px) !important;
  max-height: calc(100dvh - 64px) !important;
  min-height: 0 !important;
  margin: 0 auto !important;
  padding: 0 !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .modal-content,
.flat-modal.cl-common-modal.cl-source-sms-register-modal-wrap .modal-default .modal-dialog.cl-source-sms-register-modal .modal-content {
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: calc(100vh - 64px) !important;
  max-height: calc(100dvh - 64px) !important;
  padding: 26px 34px 22px !important;
  border: 0 !important;
  border-radius: 14px !important;
  background: #fff !important;
  box-shadow: 0 24px 64px rgba(0, 0, 0, .28) !important;
  color: var(--cl-text) !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
  -webkit-overflow-scrolling: touch;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .modal-body,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .modal-footer,
.flat-modal.cl-common-modal.cl-source-sms-register-modal-wrap .modal-default .modal-dialog.cl-source-sms-register-modal .modal-body,
.flat-modal.cl-common-modal.cl-source-sms-register-modal-wrap .modal-default .modal-dialog.cl-source-sms-register-modal .modal-footer {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .modal-title,
.flat-modal.cl-common-modal.cl-source-sms-register-modal-wrap .modal-default .modal-dialog.cl-source-sms-register-modal .modal-title {
  margin: 0 0 18px !important;
  padding: 0 34px !important;
  color: var(--cl-text) !important;
  font-size: 22px !important;
  font-weight: 800 !important;
  line-height: 30px !important;
  text-align: center !important;
  letter-spacing: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .modal-content > .close.close-button-dialog,
.flat-modal.cl-common-modal.cl-source-sms-register-modal-wrap .modal-default .modal-dialog.cl-source-sms-register-modal .modal-content > .close.close-button-dialog {
  position: absolute !important;
  top: 16px !important;
  right: 18px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  min-height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  color: var(--cl-text-muted) !important;
  opacity: 1 !important;
  box-shadow: none !important;
  text-shadow: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .modal-content > .close.close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .modal-content > .close.close-button-dialog:focus,
.flat-modal.cl-common-modal.cl-source-sms-register-modal-wrap .modal-default .modal-dialog.cl-source-sms-register-modal .modal-content > .close.close-button-dialog:hover,
.flat-modal.cl-common-modal.cl-source-sms-register-modal-wrap .modal-default .modal-dialog.cl-source-sms-register-modal .modal-content > .close.close-button-dialog:focus {
  background: #f1f2f5 !important;
  color: var(--cl-text) !important;
  opacity: 1 !important;
  outline: 0 !important;
  transform: rotate(90deg) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .modal-content > .close.close-button-dialog svg,
.flat-modal.cl-common-modal.cl-source-sms-register-modal-wrap .modal-default .modal-dialog.cl-source-sms-register-modal .modal-content > .close.close-button-dialog svg {
  display: block !important;
  width: 9px !important;
  height: 9px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-register-form {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  color: var(--cl-text) !important;
  font-family: var(--cl-source-font) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-register-intro {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin: 0 0 14px !important;
  padding: 12px 14px !important;
  border: 1px solid var(--cl-line) !important;
  border-radius: 10px !important;
  background: #fafbfc !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-register-intro p {
  margin: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 20px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-register-guide {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: none !important;
  height: 36px !important;
  margin: 0 !important;
  padding: 0 14px !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  background: #fff !important;
  color: var(--cl-text) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-register-guide:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-register-guide:focus {
  border-color: var(--cl-green-line) !important;
  background: var(--cl-green-tint) !important;
  color: var(--cl-green-text) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-register-guide-icon {
  width: 10px !important;
  height: 10px !important;
  margin-left: 6px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-register-field.cl-common-form-wrap {
  display: block !important;
  width: 100% !important;
  margin: 0 0 12px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-register-row {
  display: flex !important;
  gap: 12px !important;
  width: 100% !important;
  margin: 0 0 12px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-register-row .sms-number-register-field {
  flex: 1 1 0 !important;
  width: auto !important;
  min-width: 0 !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-register-label,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-section-label,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-file-title {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  margin: 0 0 7px !important;
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  line-height: 18px !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-file-title span {
  margin-left: 6px !important;
  color: var(--cl-text-muted) !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-required-icon {
  display: inline-block !important;
  flex: none !important;
  width: 12px !important;
  height: 12px !important;
  margin: 0 !important;
  fill: var(--cl-danger) !important;
  vertical-align: middle !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-input {
  width: 100% !important;
  height: 38px !important;
  margin: 0 !important;
  padding: 0 13px !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  background: #fff !important;
  box-shadow: none !important;
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 36px !important;
  outline: 0 !important;
  transition: border-color .12s, box-shadow .12s !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-input:hover {
  border-color: var(--cl-border) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-input:focus,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-register-field.active .sms-number-input {
  border-color: var(--cl-green) !important;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .12) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-register-field.error .sms-number-input {
  border-color: var(--cl-danger) !important;
  box-shadow: 0 0 0 3px rgba(229, 72, 77, .13) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-input::placeholder {
  color: var(--cl-text-muted) !important;
  font-size: 13.5px !important;
  opacity: 1 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-register-section,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .file-area {
  width: 100% !important;
  margin: 0 0 12px !important;
  padding: 0 !important;
  text-align: left !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-sign-canvas {
  display: block !important;
  width: 100% !important;
  height: 92px !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  background: #fff !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-sign-canvas:focus {
  outline: 0 !important;
  border-color: var(--cl-green) !important;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .12) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-sign-clear {
  display: inline-flex !important;
  align-items: center !important;
  height: 22px !important;
  margin: 5px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--cl-text-sub) !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-sign-clear:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-sign-clear:focus {
  color: var(--cl-green-text) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-doc-section {
  padding: 12px !important;
  border: 1px solid var(--cl-line) !important;
  border-radius: 10px !important;
  background: #fafbfc !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-doc-list {
  margin: 0 !important;
  padding-left: 12px !important;
  color: var(--cl-text-sub) !important;
  list-style: disc !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-doc-list li {
  margin: 3px 0 0 !important;
  padding-left: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  line-height: 18px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-doc-list li:first-child {
  margin-top: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-file-label {
  display: block !important;
  width: 100% !important;
  margin: 7px 0 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-file-select {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 38px !important;
  border: 1px solid var(--cl-green) !important;
  border-radius: 8px !important;
  background: #fff !important;
  color: var(--cl-green-text) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  cursor: pointer !important;
  transition: border-color .12s, background-color .12s, color .12s !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-file-select:hover {
  border-color: var(--cl-green) !important;
  background: var(--cl-green-tint) !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-file-select svg {
  width: 13px !important;
  height: 13px !important;
  margin-right: 7px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .dp-file {
  display: none;
  align-items: center !important;
  justify-content: flex-start !important;
  width: 100% !important;
  height: 38px !important;
  margin: 7px 0 0 !important;
  padding: 0 42px 0 12px !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  background: var(--cl-page-bg) !important;
  box-sizing: border-box !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .dp-file .sms-number-selected-file-icon {
  flex: 0 0 20px !important;
  width: 20px !important;
  height: 20px !important;
  margin-right: 8px !important;
  fill: var(--cl-text-sub) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .dp-file span {
  min-width: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-file-remove {
  border-radius: 7px !important;
  color: var(--cl-text-sub) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-file-remove:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-file-remove:focus {
  background: #eaecef !important;
  color: var(--cl-text) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-file-remove svg {
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-agree-row {
  width: 100% !important;
  margin: 2px 0 20px !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-agree-row .newcheckbox,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-agree-row .newcheckbox label {
  display: flex !important;
  align-items: flex-start !important;
  gap: 8px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-agree-row .newcheckboxSvg {
  position: relative !important;
  display: inline-flex !important;
  flex: 0 0 16px !important;
  align-items: center !important;
  justify-content: center !important;
  width: 16px !important;
  height: 16px !important;
  margin: 1px 0 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-agree-row .newcheckboxSvg input {
  position: absolute !important;
  inset: 0 !important;
  width: 16px !important;
  height: 16px !important;
  margin: 0 !important;
  opacity: 0 !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-agree-row .newcheckboxSvg svg {
  display: block !important;
  width: 16px !important;
  height: 16px !important;
  fill: #d5d9e0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-agree-row .newcheckboxSvg svg.active {
  display: none !important;
  fill: var(--cl-green) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-agree-row .newcheckboxSvg input:checked ~ svg {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-agree-row .newcheckboxSvg input:checked ~ svg.active {
  display: block !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-agree-row .newcheckbox label > span {
  min-width: 0 !important;
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  line-height: 20px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-agree-row .newcheckbox label > span span {
  color: var(--cl-green-text) !important;
  font-size: inherit !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal #auth-btn,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal #auth-btn:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal #auth-btn:focus {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: none !important;
  height: 46px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  border: 1px solid var(--cl-green) !important;
  border-radius: 8px !important;
  background: var(--cl-green) !important;
  box-shadow: none !important;
  color: #fff !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal #auth-btn:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal #auth-btn:focus {
  background: var(--cl-green-hover) !important;
  border-color: var(--cl-green-hover) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-register-close,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-register-close:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-register-close:focus {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: none !important;
  height: 36px !important;
  margin: 6px 0 0 !important;
  padding: 0 16px !important;
  border: 0 !important;
  border-radius: 9px !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  cursor: pointer !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-register-close:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-register-close:focus {
  background: var(--cl-green-soft) !important;
  color: var(--cl-green-text) !important;
}

@media (max-width: 768px) {
  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-source-sms-register-modal) {
    padding: 12px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default:has(.modal-dialog.cl-source-sms-register-modal),
  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default.in:has(.modal-dialog.cl-source-sms-register-modal),
  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default.show:has(.modal-dialog.cl-source-sms-register-modal) {
    padding: 12px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-source-sms-register-modal),
  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default:has(.modal-dialog.cl-source-sms-register-modal),
  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default.in:has(.modal-dialog.cl-source-sms-register-modal),
  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default.show:has(.modal-dialog.cl-source-sms-register-modal) {
    height: 100dvh !important;
    min-height: 0 !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal {
    width: calc(100vw - 24px) !important;
    max-width: calc(100vw - 24px) !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .modal-content {
    max-height: calc(100vh - 24px) !important;
    max-height: calc(100dvh - 24px) !important;
    padding: 30px 20px 24px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .modal-title {
    margin-bottom: 20px !important;
    padding: 0 34px !important;
    font-size: 20px !important;
    line-height: 28px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .modal-content > .close.close-button-dialog {
    top: 16px !important;
    right: 16px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-register-intro,
  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-register-row {
    flex-direction: column !important;
    align-items: stretch !important;
  }
}

@media (max-width: 1024px) {
  #cl-shopping-settings-page {
    --cl-setting-panel-w: 100%;
  }
}

@media (max-width: 768px) {
  #cl-shopping-settings-page {
    margin-left: var(--cl-source-app-gutter) !important;
    padding: 20px 16px 40px !important;
  }

  body.cl-dashboard-redesign-page #cl-shopping-settings-page .bank-list {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 44px;
    align-items: center;
    gap: 8px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-settings-page .bank-list:has(> .delete-bank.hide) {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
  }

  body.cl-dashboard-redesign-page #cl-shopping-settings-page .bank-list-blank-wrap {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-settings-page .delete-bank {
    width: 44px;
    height: 44px;
    flex: none;
  }

  body.cl-dashboard-redesign-page #cl-shopping-settings-page .submenu_navWrap {
    padding: 0 24px !important;
  }

  body.cl-dashboard-redesign-page #cl-shopping-settings-page .submenu_navWrap .submenu_nav {
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scrollbar-width: none;
    -ms-overflow-style: none;
    -webkit-overflow-scrolling: touch;
  }

  body.cl-dashboard-redesign-page #cl-shopping-settings-page .submenu_navWrap .submenu_nav::-webkit-scrollbar {
    display: none;
    height: 0;
  }

  body.cl-dashboard-redesign-page #cl-shopping-settings-page .submenu_navWrap .submenu_nav ul {
    flex: none;
    flex-wrap: nowrap;
    gap: 22px;
  }

  body.cl-dashboard-redesign-page .delivery-template-modal .setting-delivery-template {
    --cl-delivery-intro-width: 100%;
    --cl-delivery-intro-max-width: 100%;
    --cl-delivery-intro-margin: 0 0 12px;
    --cl-delivery-add-position: static;
    --cl-delivery-add-width: 100%;
    --cl-delivery-add-height: 44px;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.delivery-template-modal) {
    padding: 24px 12px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.delivery-template-modal {
    width: calc(100vw - 24px) !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.delivery-template-modal .modal-content {
    padding: 26px 20px !important;
  }

  body.cl-dashboard-redesign-page .delivery-template-modal .delivery-template-layer .item-row {
    grid-template-columns: 1fr;
    gap: 10px;
    padding: 20px 0 !important;
  }

  body.cl-dashboard-redesign-page .delivery-template-modal .delivery-template-layer .item-row > div:first-child {
    min-height: 0;
  }

  body.cl-dashboard-redesign-page .delivery-template-modal .mix-yn-row,
  body.cl-dashboard-redesign-page .delivery-template-modal .additional-yn-row,
  body.cl-dashboard-redesign-page .delivery-template-modal .pay-type-row,
  body.cl-dashboard-redesign-page .delivery-template-modal .make-to-order-yn-row,
  body.cl-dashboard-redesign-page .delivery-template-modal .install-fee-yn-row {
    flex-wrap: wrap !important;
  }

  body.cl-dashboard-redesign-page .delivery-template-modal .additional-yn-row > .additional-row {
    margin-top: 8px !important;
  }

  body.cl-dashboard-redesign-page .delivery-template-modal .quantity-differential tr,
  body.cl-dashboard-redesign-page .delivery-template-modal .weight-differential tr {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 24px;
    row-gap: 0;
  }

  body.cl-dashboard-redesign-page .delivery-template-modal .quantity-differential td:last-child,
  body.cl-dashboard-redesign-page .delivery-template-modal .weight-differential td:last-child {
    align-items: center;
    padding-top: 0 !important;
  }
}

@media (max-width: 480px) {
  #cl-shopping-settings-page .setting-subInfoBox {
    display: block !important;
  }

  body.cl-dashboard-redesign-page #cl-shopping-settings-page[data-setting-tab="legal"] .setting-sub-content {
    display: block;
    width: 100% !important;
    max-width: none;
  }

  #cl-shopping-settings-page .setting-sub-title {
    width: auto !important;
    max-width: none !important;
    margin-bottom: 14px !important;
  }

}

/* 상단 탭 페이지 헤더 간격: 알림 > 문자 알림 / 카카오 알림톡 기준 */
body.cl-dashboard-redesign-page :is(
  #cl-shopping-settings-page .cl-source-setting-head,
  #cl-shopping-order-page .cl-source-order-head,
  #cl-shopping-inquiry-page .cl-source-inquiry-head,
  #cl-shopping-point-setting-page .cl-source-points-head,
  #cl-shopping-point-list-page .cl-source-points-head,
  #cl-shopping-point-member-page .cl-source-points-head,
  #cl-shopping-coupon-setting-page .cl-source-coupon-head,
  #cl-shopping-coupon-history-page .cl-source-coupon-head,
  #cl-shopping-coupon-manage-page .cl-source-coupon-head
) {
  margin-bottom: 28px !important;
}

body.cl-dashboard-redesign-page .dashbottom-container.kakao-wrap-width > .cl-source-notification-head {
  margin-bottom: 28px !important;
}

/* ===== 로그 ===== */
body.cl-dashboard-redesign-page #cl-log-page,
body.cl-dashboard-redesign-page #cl-log-page * {
  box-sizing: border-box;
}

body.cl-dashboard-redesign-page #cl-log-page {
  display: block;
  float: none;
  width: auto !important;
  max-width: none !important;
  margin-top: 0 !important;
  margin-right: var(--cl-source-app-gutter) !important;
  margin-left: calc(var(--cl-source-app-gutter) + var(--cl-source-sidebar-w)) !important;
  padding: 28px 32px 60px !important;
  background: transparent;
  color: var(--cl-text);
}

body.cl-dashboard-redesign-page #cl-log-page > .dashbottom-container {
  display: block !important;
  float: none !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page #cl-log-page .row {
  margin-right: 0 !important;
  margin-left: 0 !important;
}

body.cl-dashboard-redesign-page #cl-log-page #section-top-menu,
body.cl-dashboard-redesign-page #cl-log-page .mobile-title {
  display: none !important;
}

body.cl-dashboard-redesign-page #cl-log-page .cl-source-log-head {
  display: block;
  width: 100%;
  max-width: 100%;
  margin: 0 0 22px;
  padding: 0;
}

body.cl-dashboard-redesign-page #cl-log-page .cl-source-log-breadcrumb {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  margin: 0;
  padding: 0;
  color: var(--cl-text);
  font-size: 20px;
  font-weight: 700;
  line-height: 1.35;
}

body.cl-dashboard-redesign-page #cl-log-page .cl-source-log-breadcrumb .current {
  color: var(--cl-text);
  font-weight: 700;
}

body.cl-dashboard-redesign-page #cl-log-page .cl-source-log-desc {
  margin: 8px 0 0;
  padding: 0;
  color: var(--cl-text-sub);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 20px;
}

body.cl-dashboard-redesign-page #cl-log-page .mng-body,
body.cl-dashboard-redesign-page #cl-log-page .setting-box,
body.cl-dashboard-redesign-page #cl-log-page .setting-sub-box,
body.cl-dashboard-redesign-page #cl-log-page .slog-search-wrap,
body.cl-dashboard-redesign-page #cl-log-page .cl-source-log-form {
  display: block !important;
  float: none !important;
  width: 100% !important;
  max-width: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page #cl-log-page .setting-box {
  padding: 26px 30px 30px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: var(--cl-radius-lg) !important;
  box-shadow: var(--cl-shadow-panel) !important;
}

body.cl-dashboard-redesign-page #cl-log-page .log-page-title {
  margin: 0 0 18px !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-size: 16px !important;
  font-weight: 800 !important;
  line-height: 22px !important;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-info-wrap.log-note {
  margin: 0 !important;
  padding: 15px 20px !important;
  background: #f6fbf8 !important;
  border: 0 !important;
  border-left: 3px solid var(--cl-green) !important;
  border-radius: 0 8px 8px 0 !important;
  color: var(--cl-text-sub) !important;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-info-wrap.log-note ul {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-info-wrap.log-note li {
  position: relative;
  margin: 0 !important;
  padding: 0 0 0 13px !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.95 !important;
  word-break: keep-all;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-info-wrap.log-note li::before {
  content: "·";
  position: absolute;
  top: -1px;
  left: 2px;
  color: var(--cl-text-muted);
  font-weight: 700;
}

body.cl-dashboard-redesign-page #cl-log-page .log-filter {
  display: flex !important;
  flex-direction: column;
  gap: 14px;
  margin: 22px 0 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page #cl-log-page .log-frow {
  display: flex !important;
  float: none !important;
  align-items: center;
  gap: 16px;
  width: 100%;
  min-height: 36px;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page #cl-log-page .log-flabel {
  display: block !important;
  flex: 0 0 64px;
  width: 64px !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 20px !important;
}

body.cl-dashboard-redesign-page #cl-log-page .log-ctrls {
  display: flex !important;
  float: none !important;
  flex: 1 1 auto;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  min-width: 0;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-period-wrap {
  display: block !important;
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-btn-toggle.oi-presets {
  display: inline-flex !important;
  float: none !important;
  align-items: center;
  overflow: hidden;
  margin: 0 !important;
  padding: 0 !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 6px !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-btn-toggle.oi-presets > .oi-preset {
  display: inline-flex !important;
  float: none !important;
  align-items: center;
  justify-content: center;
  min-width: 58px;
  height: 35px !important;
  margin: 0 !important;
  padding: 0 14px !important;
  background: #fff !important;
  border: 0 !important;
  border-left: 1px solid var(--cl-border) !important;
  border-radius: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 35px !important;
  box-shadow: none !important;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color .12s, color .12s;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-btn-toggle.oi-presets > .oi-preset:first-child {
  border-left: 0 !important;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-btn-toggle.oi-presets > .oi-preset:hover {
  background: #f4f5f7 !important;
  color: var(--cl-text) !important;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-btn-toggle.oi-presets > .oi-preset.active {
  background: #e4f7ec !important;
  color: var(--cl-green-text) !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-date-wrap.oi-cal-wrap {
  position: relative;
  display: inline-flex !important;
  float: none !important;
  align-items: center;
  gap: 8px;
  min-width: 236px;
  height: 35px;
  margin: 0 !important;
  padding: 0 12px 0 36px !important;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 6px;
  color: var(--cl-text);
}

body.cl-dashboard-redesign-page #cl-log-page .slog-date-wrap.oi-cal-wrap::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 12px;
  width: 15px;
  height: 15px;
  transform: translateY(-50%);
  background: currentColor;
  color: var(--cl-text-sub);
  -webkit-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4.5' width='18' height='16' rx='2'/%3E%3Cpath d='M3 9h18M8 3v3M16 3v3'/%3E%3C/g%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4.5' width='18' height='16' rx='2'/%3E%3Cpath d='M3 9h18M8 3v3M16 3v3'/%3E%3C/g%3E%3C/svg%3E") center / contain no-repeat;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-date-wrap .slog-date-box {
  position: relative;
  display: inline-flex !important;
  float: none !important;
  align-items: center;
  width: auto !important;
  height: 33px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-date-wrap .slog-date-box > input {
  position: absolute !important;
  inset: 0;
  z-index: 2;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  opacity: 0 !important;
  cursor: pointer;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-date-wrap .slog-date-str {
  position: static !important;
  display: inline-block !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 33px !important;
  text-align: left !important;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-date-wrap .slog-svg-icon {
  display: none !important;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-date-wrap .vperiod-dash {
  display: inline-block !important;
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  color: var(--cl-text-sub);
  font-size: 13px;
  line-height: 33px;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-date-wrap.oi-cal-wrap.vcal-wrap {
  z-index: 20;
  min-width: auto;
  height: auto;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-date-wrap.oi-cal-wrap.vcal-wrap::before {
  display: none !important;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-date-wrap .vperiod {
  display: inline-flex !important;
  align-items: center;
  gap: 8px;
  height: 35px;
  padding: 0 12px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 6px !important;
  color: var(--cl-text) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  cursor: pointer;
  transition: border-color .12s, background .12s, box-shadow .12s;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-date-wrap .vperiod:hover {
  background: #fafbfc !important;
  border-color: #d5d9e0 !important;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-date-wrap .vperiod:focus-visible {
  outline: none !important;
  border-color: var(--cl-green) !important;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .18) !important;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-date-wrap .vperiod > svg {
  flex: none;
  width: 15px;
  height: 15px;
  color: var(--cl-text-sub);
}

body.cl-dashboard-redesign-page #cl-log-page .slog-date-wrap .vperiod .slog-date-str {
  line-height: 33px !important;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-date-wrap .vcal {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 300;
  display: none;
  width: 288px;
  padding: 14px;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 12px;
  box-shadow: 0 12px 30px rgba(20, 24, 32, .16);
}

body.cl-dashboard-redesign-page #cl-log-page .slog-date-wrap .vcal.open {
  display: block;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-date-wrap .vcal-head {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 26px;
  margin-bottom: 8px;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-date-wrap .vcal-title {
  color: var(--cl-text);
  font-size: 13.5px;
  font-weight: 700;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-date-wrap .vcal-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
}

body.cl-dashboard-redesign-page #cl-log-page .slog-date-wrap .vcal-wd {
  padding: 4px 0 6px;
  color: var(--cl-text-muted);
  font-size: 11px;
  font-weight: 700;
  text-align: center;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-date-wrap .vcal-wd.sun {
  color: var(--cl-danger);
}

body.cl-dashboard-redesign-page #cl-log-page .slog-date-wrap .vcal-wd.sat {
  color: var(--cl-green-text);
}

body.cl-dashboard-redesign-page #cl-log-page .slog-date-wrap .vcal-day {
  position: relative;
  display: block;
  width: 100%;
  padding: 7px 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  color: var(--cl-text);
  font-size: 12.5px;
  line-height: 1.2;
  text-align: center;
  cursor: pointer;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-date-wrap .vcal-day.other {
  color: var(--cl-text-muted);
  opacity: .45;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-date-wrap .vcal-day:hover:not(.sel):not(.disabled) {
  background: #f1f2f5;
  border-radius: 6px;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-date-wrap .vcal-day.in-range {
  background: #e4f7ec;
  color: var(--cl-green-text);
}

body.cl-dashboard-redesign-page #cl-log-page .slog-date-wrap .vcal-day.in-range:hover {
  background: #d6f0e0;
  border-radius: 0;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-date-wrap .vcal-day.sel {
  z-index: 1;
  background: var(--cl-green);
  border-radius: 6px;
  color: #fff;
  font-weight: 700;
  opacity: 1;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-date-wrap .vcal-day.range-start {
  border-radius: 6px 0 0 6px;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-date-wrap .vcal-day.range-end {
  border-radius: 0 6px 6px 0;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-date-wrap .vcal-day.today::after {
  position: absolute;
  bottom: 3px;
  left: 50%;
  width: 4px;
  height: 4px;
  background: var(--cl-green);
  border-radius: 50%;
  content: "";
  transform: translateX(-50%);
}

body.cl-dashboard-redesign-page #cl-log-page .slog-date-wrap .vcal-day.sel.today::after {
  background: #fff;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-date-wrap .vcal-day.disabled {
  color: var(--cl-text-muted);
  cursor: not-allowed;
  opacity: .35;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn),
body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .slog-stx,
body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .slog-search,
body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .slog-ref,
body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .slog-search-btn-wrap {
  float: none !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .bootstrap-select.slog-field,
body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .bootstrap-select.slog-level {
  min-width: 120px !important;
  width: 120px !important;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .bootstrap-select.slog-action {
  width: 240px !important;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .bootstrap-select > .dropdown-toggle {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: 36px !important;
  padding: 0 30px 0 12px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 6px !important;
  color: var(--cl-text) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 34px !important;
  box-shadow: none !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .bootstrap-select > .dropdown-toggle .filter-option {
  position: absolute !important;
  top: 0 !important;
  right: 30px !important;
  bottom: 0 !important;
  left: 12px !important;
  display: block !important;
  float: none !important;
  width: auto !important;
  height: 34px !important;
  padding: 0 !important;
  overflow: hidden !important;
  color: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  line-height: 34px !important;
  text-align: left !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .bootstrap-select > .dropdown-toggle .filter-option-inner,
body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .bootstrap-select > .dropdown-toggle .filter-option-inner-inner {
  display: block !important;
  width: 100% !important;
  height: 34px !important;
  overflow: hidden !important;
  color: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  line-height: 34px !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .bootstrap-select > .dropdown-toggle .caret {
  position: absolute !important;
  top: 50% !important;
  right: 10px !important;
  width: 14px !important;
  height: 14px !important;
  margin: 0 !important;
  border: 0 !important;
  transform: translateY(-50%) !important;
  background: var(--cl-text-sub);
  -webkit-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 14 14' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 5.5 7 8.5l3-3' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 14 14' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 5.5 7 8.5l3-3' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .bootstrap-select.open > .dropdown-toggle,
body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .bootstrap-select > .dropdown-toggle:hover,
body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .bootstrap-select > .dropdown-toggle:focus {
  border-color: var(--cl-green-line) !important;
  background: #fff !important;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .bootstrap-select > .dropdown-menu {
  margin-top: 4px !important;
  padding: 4px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  box-shadow: 0 8px 24px rgba(20, 24, 32, .14) !important;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .bootstrap-select > .dropdown-menu .bs-searchbox {
  padding: 0 0 6px !important;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .bootstrap-select > .dropdown-menu .bs-searchbox .form-control {
  width: 100% !important;
  height: 32px !important;
  margin: 0 !important;
  padding: 0 10px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 6px !important;
  color: var(--cl-text) !important;
  font-size: 12.5px !important;
  font-weight: 400 !important;
  line-height: 30px !important;
  box-shadow: none !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .bootstrap-select > .dropdown-menu .bs-searchbox .form-control:focus {
  border-color: var(--cl-green) !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .bootstrap-select > .dropdown-menu .bs-searchbox .form-control::placeholder {
  color: var(--cl-text-muted) !important;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .bootstrap-select .dropdown-menu.inner {
  position: static !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .bootstrap-select .dropdown-menu > li > a {
  display: block;
  min-height: 32px;
  padding: 8px 12px !important;
  border-radius: 6px;
  color: var(--cl-text) !important;
  font-size: 12.5px !important;
  line-height: 16px !important;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .bootstrap-select .dropdown-menu > li.selected > a,
body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .bootstrap-select .dropdown-menu > li > a:hover,
body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .bootstrap-select .dropdown-menu > li > a:focus {
  background: #e4f7ec !important;
  color: var(--cl-green-text) !important;
  font-weight: 700;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .slog-stx,
body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .slog-search,
body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .slog-ref {
  width: 240px !important;
  height: 36px !important;
  padding: 0 12px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 6px !important;
  color: var(--cl-text) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 34px !important;
  box-shadow: none !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .slog-stx:focus,
body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .slog-search:focus,
body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .slog-ref:focus {
  border-color: var(--cl-green) !important;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .slog-search-btn {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-width: 74px;
  height: 36px !important;
  margin: 0 !important;
  padding: 0 22px !important;
  background: var(--cl-green) !important;
  border: 1px solid var(--cl-green) !important;
  border-radius: 6px !important;
  color: #fff !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  line-height: 34px !important;
  letter-spacing: 0 !important;
  text-decoration: none !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .slog-search-btn:hover,
body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .slog-search-btn:focus {
  background: var(--cl-green-hover) !important;
  border-color: var(--cl-green-hover) !important;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-list-caption.log-result-title {
  display: block;
  width: 100%;
  max-width: 100%;
  margin: 28px 0 14px !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 22px !important;
}

body.cl-dashboard-redesign-page #cl-log-page .slog-list-wrap.log-panel {
  display: block;
  width: 100%;
  max-width: 100%;
  margin: 0 !important;
  padding: 26px 30px 34px !important;
  overflow: visible !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: var(--cl-radius-lg) !important;
  box-shadow: var(--cl-shadow-panel) !important;
}

body.cl-dashboard-redesign-page #cl-log-page .log-tools {
  display: flex !important;
  float: none !important;
  justify-content: flex-end;
  width: 100% !important;
  margin: 0 0 12px !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page #cl-log-page #slog-view.cl-redesign-select-source {
  display: none !important;
}

body.cl-dashboard-redesign-page #cl-log-page .cl-source-log-view-select {
  z-index: 30;
}

body.cl-dashboard-redesign-page #cl-log-page .cl-source-log-view-select .cl-redesign-select-trigger {
  height: 38px;
  min-width: 122px;
  padding-top: 8px;
  padding-bottom: 8px;
  border-radius: var(--cl-radius-sm) !important;
}

body.cl-dashboard-redesign-page #cl-log-page .cl-source-log-view-select.open .cl-redesign-select-trigger,
body.cl-dashboard-redesign-page #cl-log-page .cl-source-log-view-select .cl-redesign-select-trigger:hover,
body.cl-dashboard-redesign-page #cl-log-page .cl-source-log-view-select .cl-redesign-select-trigger:focus,
body.cl-dashboard-redesign-page #cl-log-page .cl-source-log-view-select .cl-redesign-select-trigger:active {
  background: #fff !important;
  border-color: var(--cl-border) !important;
  border-radius: var(--cl-radius-sm) !important;
  box-shadow: none !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page #cl-log-page .table-wrap,
body.cl-dashboard-redesign-page #cl-log-page .table-container.oi-scroll {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow-x: auto !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page #cl-log-page .log-table {
  width: 100% !important;
  min-width: 900px !important;
  margin: 0 !important;
  table-layout: fixed;
  border-collapse: collapse !important;
  border: 0 !important;
  color: var(--cl-text);
  font-size: 13px !important;
}

body.cl-dashboard-redesign-page #cl-log-page .log-table th,
body.cl-dashboard-redesign-page #cl-log-page .log-table td {
  height: 73px !important;
  padding: 14px 12px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--cl-border) !important;
  color: var(--cl-text) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 19px !important;
  text-align: center !important;
  vertical-align: middle !important;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page #cl-log-page .log-table th {
  height: 43px !important;
  padding: 12px 10px !important;
  background: #f7f8fa !important;
  border-top: 1px solid var(--cl-border) !important;
  border-bottom: 1px solid var(--cl-border) !important;
  color: var(--cl-text-sub) !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  line-height: 18px !important;
}

body.cl-dashboard-redesign-page #cl-log-page .log-table tr:last-child td {
  border-bottom: 1px solid var(--cl-border) !important;
}

body.cl-dashboard-redesign-page #cl-log-page .log-table th.no,
body.cl-dashboard-redesign-page #cl-log-page .log-table td.no {
  width: 46px !important;
}

body.cl-dashboard-redesign-page #cl-log-page .log-table th.page,
body.cl-dashboard-redesign-page #cl-log-page .log-table td.page {
  width: 180px !important;
}

body.cl-dashboard-redesign-page #cl-log-page .log-table td.page {
  line-height: 20px !important;
  white-space: normal !important;
  word-break: keep-all;
  overflow-wrap: anywhere;
}

body.cl-dashboard-redesign-page #cl-log-page .log-table th.action,
body.cl-dashboard-redesign-page #cl-log-page .log-table td.action {
  width: 104px !important;
}

body.cl-dashboard-redesign-page #cl-log-page .log-table th.editor,
body.cl-dashboard-redesign-page #cl-log-page .log-table td.editor {
  width: 158px !important;
}

body.cl-dashboard-redesign-page #cl-log-page .log-table th.level,
body.cl-dashboard-redesign-page #cl-log-page .log-table td.level {
  width: 80px !important;
}

body.cl-dashboard-redesign-page #cl-log-page .log-table td.editor,
body.cl-dashboard-redesign-page #cl-log-page .log-table td.level {
  white-space: normal;
  overflow-wrap: anywhere;
}

body.cl-dashboard-redesign-page #cl-log-page .log-table th.datetime,
body.cl-dashboard-redesign-page #cl-log-page .log-table td.datetime {
  width: 92px !important;
}

body.cl-dashboard-redesign-page #cl-log-page .log-table th.l,
body.cl-dashboard-redesign-page #cl-log-page .log-table td.l,
body.cl-dashboard-redesign-page #cl-log-page .log-table th.title,
body.cl-dashboard-redesign-page #cl-log-page .log-table td.title {
  text-align: left !important;
}

body.cl-dashboard-redesign-page #cl-log-page .log-table .log-content {
  color: var(--cl-text) !important;
  line-height: 1.5 !important;
  white-space: normal !important;
  word-break: keep-all;
  overflow-wrap: anywhere;
}

body.cl-dashboard-redesign-page #cl-log-page .log-table .slog-more {
  color: var(--cl-green-text) !important;
  font-weight: 600;
  cursor: pointer;
}

body.cl-dashboard-redesign-page #cl-log-page .log-table .slog-more:hover {
  text-decoration: underline;
}

body.cl-dashboard-redesign-page #cl-log-page .log-table .editor-name,
body.cl-dashboard-redesign-page #cl-log-page .log-table .editor-id {
  display: block;
  max-width: 100%;
  word-break: normal;
  overflow-wrap: anywhere;
}

body.cl-dashboard-redesign-page #cl-log-page .log-table .editor-id::before {
  content: " (";
}

body.cl-dashboard-redesign-page #cl-log-page .log-table .editor-id::after {
  content: ")";
}

body.cl-dashboard-redesign-page #cl-log-page .log-table .log-grade,
body.cl-dashboard-redesign-page #cl-log-page .log-table .log-when {
  color: var(--cl-text-sub) !important;
}

body.cl-dashboard-redesign-page #cl-log-page .log-table .log-when {
  line-height: 1.5 !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page #cl-log-page .log-table tr.empty td {
  height: 120px !important;
  color: var(--cl-text-sub) !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page #cl-log-page .cl-source-log-pager,
body.cl-dashboard-redesign-page #cl-log-page .shop-pager {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  width: 100%;
  margin: 22px 0 0 !important;
  padding: 0 !important;
  border-top: 0 !important;
  line-height: 1 !important;
}

body.cl-dashboard-redesign-page #cl-log-page .shop-pager .pg {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 30px;
  height: 30px;
  margin: 0 !important;
  padding: 0 8px !important;
  appearance: none;
  background: transparent;
  border: 1px solid transparent !important;
  border-radius: 6px;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 28px;
  cursor: pointer;
  text-decoration: none !important;
  transition: background-color .12s, border-color .12s, color .12s;
}

body.cl-dashboard-redesign-page #cl-log-page .shop-pager .pg.active {
  background: #e4f7ec !important;
  border-color: var(--cl-green) !important;
  color: var(--cl-green-text) !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page #cl-log-page .shop-pager .pg:hover:not(.active):not(:disabled) {
  background: #f1fbf5 !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page #cl-log-page .shop-pager .pg:disabled,
body.cl-dashboard-redesign-page #cl-log-page .shop-pager .pg:disabled:hover {
  background: transparent !important;
  color: var(--cl-text-muted) !important;
  cursor: default;
  opacity: .35;
}

body.cl-dashboard-redesign-page #cl-log-page .shop-pager .pg.nav {
  color: var(--cl-text-muted) !important;
}

body.cl-dashboard-redesign-page #cl-log-page .shop-pager .pg.nav svg {
  display: block;
  position: static !important;
  width: 15px !important;
  height: 15px !important;
  transform: none !important;
  fill: none !important;
  stroke: currentColor !important;
}

body.cl-dashboard-redesign-page #cl-log-page .bootstrap-datetimepicker-widget,
body.cl-dashboard-redesign-page:has(#cl-log-page) .bootstrap-datetimepicker-widget {
  width: 288px !important;
  min-width: 288px !important;
  margin-top: 8px !important;
  padding: 14px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 12px !important;
  box-shadow: 0 12px 30px rgba(20, 24, 32, .16) !important;
  color: var(--cl-text) !important;
  font-family: var(--cl-source-font) !important;
  font-size: 12.5px !important;
}

body.cl-dashboard-redesign-page #cl-log-page .bootstrap-datetimepicker-widget.dropdown-menu::before,
body.cl-dashboard-redesign-page #cl-log-page .bootstrap-datetimepicker-widget.dropdown-menu::after,
body.cl-dashboard-redesign-page:has(#cl-log-page) .bootstrap-datetimepicker-widget.dropdown-menu::before,
body.cl-dashboard-redesign-page:has(#cl-log-page) .bootstrap-datetimepicker-widget.dropdown-menu::after {
  display: none !important;
}

body.cl-dashboard-redesign-page #cl-log-page .bootstrap-datetimepicker-widget .list-unstyled,
body.cl-dashboard-redesign-page #cl-log-page .bootstrap-datetimepicker-widget .collapse,
body.cl-dashboard-redesign-page #cl-log-page .bootstrap-datetimepicker-widget .datepicker,
body.cl-dashboard-redesign-page #cl-log-page .bootstrap-datetimepicker-widget .datepicker-days,
body.cl-dashboard-redesign-page:has(#cl-log-page) .bootstrap-datetimepicker-widget .list-unstyled,
body.cl-dashboard-redesign-page:has(#cl-log-page) .bootstrap-datetimepicker-widget .collapse,
body.cl-dashboard-redesign-page:has(#cl-log-page) .bootstrap-datetimepicker-widget .datepicker,
body.cl-dashboard-redesign-page:has(#cl-log-page) .bootstrap-datetimepicker-widget .datepicker-days {
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page #cl-log-page .bootstrap-datetimepicker-widget table,
body.cl-dashboard-redesign-page:has(#cl-log-page) .bootstrap-datetimepicker-widget table {
  width: 100% !important;
  margin: 0 !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  table-layout: fixed !important;
}

body.cl-dashboard-redesign-page #cl-log-page .bootstrap-datetimepicker-widget table th,
body.cl-dashboard-redesign-page #cl-log-page .bootstrap-datetimepicker-widget table td,
body.cl-dashboard-redesign-page:has(#cl-log-page) .bootstrap-datetimepicker-widget table th,
body.cl-dashboard-redesign-page:has(#cl-log-page) .bootstrap-datetimepicker-widget table td {
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  text-align: center !important;
  text-shadow: none !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page #cl-log-page .bootstrap-datetimepicker-widget table thead tr:first-child th,
body.cl-dashboard-redesign-page:has(#cl-log-page) .bootstrap-datetimepicker-widget table thead tr:first-child th {
  position: relative !important;
  height: 26px !important;
  line-height: 26px !important;
  color: var(--cl-text-sub) !important;
  font-size: 0 !important;
  font-weight: 700 !important;
  border-radius: 6px !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page #cl-log-page .bootstrap-datetimepicker-widget table thead tr:first-child th:hover,
body.cl-dashboard-redesign-page:has(#cl-log-page) .bootstrap-datetimepicker-widget table thead tr:first-child th:hover {
  background: #f4f5f9 !important;
  color: var(--cl-text) !important;
}

body.cl-dashboard-redesign-page #cl-log-page .bootstrap-datetimepicker-widget table thead tr:first-child th.picker-switch,
body.cl-dashboard-redesign-page:has(#cl-log-page) .bootstrap-datetimepicker-widget table thead tr:first-child th.picker-switch {
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page #cl-log-page .bootstrap-datetimepicker-widget table thead tr:first-child th.picker-switch:hover,
body.cl-dashboard-redesign-page:has(#cl-log-page) .bootstrap-datetimepicker-widget table thead tr:first-child th.picker-switch:hover {
  background: transparent !important;
}

body.cl-dashboard-redesign-page #cl-log-page .bootstrap-datetimepicker-widget table th.prev,
body.cl-dashboard-redesign-page #cl-log-page .bootstrap-datetimepicker-widget table th.next,
body.cl-dashboard-redesign-page:has(#cl-log-page) .bootstrap-datetimepicker-widget table th.prev,
body.cl-dashboard-redesign-page:has(#cl-log-page) .bootstrap-datetimepicker-widget table th.next {
  width: 26px !important;
  min-width: 26px !important;
  max-width: 26px !important;
  color: var(--cl-text-sub) !important;
}

body.cl-dashboard-redesign-page #cl-log-page .bootstrap-datetimepicker-widget table th.prev .glyphicon,
body.cl-dashboard-redesign-page #cl-log-page .bootstrap-datetimepicker-widget table th.next .glyphicon,
body.cl-dashboard-redesign-page:has(#cl-log-page) .bootstrap-datetimepicker-widget table th.prev .glyphicon,
body.cl-dashboard-redesign-page:has(#cl-log-page) .bootstrap-datetimepicker-widget table th.next .glyphicon {
  display: none !important;
}

body.cl-dashboard-redesign-page #cl-log-page .bootstrap-datetimepicker-widget table th.prev::before,
body.cl-dashboard-redesign-page #cl-log-page .bootstrap-datetimepicker-widget table th.next::before,
body.cl-dashboard-redesign-page:has(#cl-log-page) .bootstrap-datetimepicker-widget table th.prev::before,
body.cl-dashboard-redesign-page:has(#cl-log-page) .bootstrap-datetimepicker-widget table th.next::before {
  content: "" !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  display: block !important;
  width: 8px !important;
  height: 8px !important;
  border: solid currentColor !important;
}

body.cl-dashboard-redesign-page #cl-log-page .bootstrap-datetimepicker-widget table th.prev::before,
body.cl-dashboard-redesign-page:has(#cl-log-page) .bootstrap-datetimepicker-widget table th.prev::before {
  border-width: 0 0 3px 3px !important;
  transform: translate(-38%, -50%) rotate(45deg) !important;
}

body.cl-dashboard-redesign-page #cl-log-page .bootstrap-datetimepicker-widget table th.next::before,
body.cl-dashboard-redesign-page:has(#cl-log-page) .bootstrap-datetimepicker-widget table th.next::before {
  border-width: 3px 3px 0 0 !important;
  transform: translate(-62%, -50%) rotate(45deg) !important;
}

body.cl-dashboard-redesign-page #cl-log-page .bootstrap-datetimepicker-widget table thead tr:nth-child(2) th,
body.cl-dashboard-redesign-page:has(#cl-log-page) .bootstrap-datetimepicker-widget table thead tr:nth-child(2) th {
  height: 28px !important;
  line-height: 18px !important;
  padding: 4px 0 6px !important;
  color: var(--cl-text-muted) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page #cl-log-page .bootstrap-datetimepicker-widget table thead tr:nth-child(2) th:first-child,
body.cl-dashboard-redesign-page:has(#cl-log-page) .bootstrap-datetimepicker-widget table thead tr:nth-child(2) th:first-child {
  color: var(--cl-danger) !important;
}

body.cl-dashboard-redesign-page #cl-log-page .bootstrap-datetimepicker-widget table thead tr:nth-child(2) th:last-child,
body.cl-dashboard-redesign-page:has(#cl-log-page) .bootstrap-datetimepicker-widget table thead tr:nth-child(2) th:last-child {
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page #cl-log-page .bootstrap-datetimepicker-widget table td.day,
body.cl-dashboard-redesign-page:has(#cl-log-page) .bootstrap-datetimepicker-widget table td.day {
  width: auto !important;
  height: 29px !important;
  line-height: 29px !important;
  color: var(--cl-text) !important;
  font-size: 12.5px !important;
  font-weight: 400 !important;
  border-radius: 6px !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page #cl-log-page .bootstrap-datetimepicker-widget table td.day:hover,
body.cl-dashboard-redesign-page:has(#cl-log-page) .bootstrap-datetimepicker-widget table td.day:hover {
  background: #f1f2f5 !important;
  color: var(--cl-text) !important;
}

body.cl-dashboard-redesign-page #cl-log-page .bootstrap-datetimepicker-widget table td.old,
body.cl-dashboard-redesign-page #cl-log-page .bootstrap-datetimepicker-widget table td.new,
body.cl-dashboard-redesign-page:has(#cl-log-page) .bootstrap-datetimepicker-widget table td.old,
body.cl-dashboard-redesign-page:has(#cl-log-page) .bootstrap-datetimepicker-widget table td.new {
  color: var(--cl-text-muted) !important;
  opacity: .45 !important;
}

body.cl-dashboard-redesign-page #cl-log-page .bootstrap-datetimepicker-widget table td.today::before,
body.cl-dashboard-redesign-page #cl-log-page .bootstrap-datetimepicker-widget table td.active.today::before,
body.cl-dashboard-redesign-page:has(#cl-log-page) .bootstrap-datetimepicker-widget table td.today::before,
body.cl-dashboard-redesign-page:has(#cl-log-page) .bootstrap-datetimepicker-widget table td.active.today::before {
  display: none !important;
}

body.cl-dashboard-redesign-page #cl-log-page .bootstrap-datetimepicker-widget table td.active,
body.cl-dashboard-redesign-page #cl-log-page .bootstrap-datetimepicker-widget table td.active:hover,
body.cl-dashboard-redesign-page:has(#cl-log-page) .bootstrap-datetimepicker-widget table td.active,
body.cl-dashboard-redesign-page:has(#cl-log-page) .bootstrap-datetimepicker-widget table td.active:hover {
  background: var(--cl-green) !important;
  color: #fff !important;
  opacity: 1 !important;
  font-weight: 700 !important;
  border-radius: 6px !important;
}

body.cl-dashboard-redesign-page #cl-log-page .bootstrap-datetimepicker-widget table td.disabled,
body.cl-dashboard-redesign-page #cl-log-page .bootstrap-datetimepicker-widget table td.disabled:hover,
body.cl-dashboard-redesign-page:has(#cl-log-page) .bootstrap-datetimepicker-widget table td.disabled,
body.cl-dashboard-redesign-page:has(#cl-log-page) .bootstrap-datetimepicker-widget table td.disabled:hover {
  background: transparent !important;
  color: var(--cl-text-muted) !important;
  opacity: .35 !important;
  cursor: not-allowed !important;
}

body.cl-dashboard-redesign-page #cl-log-page .bootstrap-datetimepicker-widget table td span,
body.cl-dashboard-redesign-page:has(#cl-log-page) .bootstrap-datetimepicker-widget table td span {
  width: 25% !important;
  height: 30px !important;
  margin: 4px 0 !important;
  line-height: 30px !important;
  color: var(--cl-text) !important;
  font-size: 12.5px !important;
  border-radius: 6px !important;
}

body.cl-dashboard-redesign-page #cl-log-page .bootstrap-datetimepicker-widget table td span:hover,
body.cl-dashboard-redesign-page:has(#cl-log-page) .bootstrap-datetimepicker-widget table td span:hover {
  background: #f1f2f5 !important;
}

body.cl-dashboard-redesign-page #cl-log-page .bootstrap-datetimepicker-widget table td span.active,
body.cl-dashboard-redesign-page #cl-log-page .bootstrap-datetimepicker-widget table td span.active:hover,
body.cl-dashboard-redesign-page:has(#cl-log-page) .bootstrap-datetimepicker-widget table td span.active,
body.cl-dashboard-redesign-page:has(#cl-log-page) .bootstrap-datetimepicker-widget table td span.active:hover {
  background: var(--cl-green) !important;
  color: #fff !important;
  font-weight: 700 !important;
  text-shadow: none !important;
}

@media only screen and (max-width: 767px) {
  body.cl-dashboard-redesign-page #cl-log-page {
    margin-top: 0 !important;
    margin-right: var(--cl-source-app-gutter) !important;
    margin-left: var(--cl-source-app-gutter) !important;
    padding: 20px 16px 40px !important;
  }

  body.cl-dashboard-redesign-page #cl-log-page .cl-source-log-head {
    align-items: flex-start;
    flex-direction: column;
  }

  body.cl-dashboard-redesign-page #cl-log-page > .dashbottom-container {
    max-width: 100% !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
  }

  body.cl-dashboard-redesign-page #cl-log-page .setting-box,
  body.cl-dashboard-redesign-page #cl-log-page .slog-list-wrap.log-panel {
    padding: 18px 16px !important;
  }

  body.cl-dashboard-redesign-page #cl-member-signup-settings-page .collection-content-heading,
  body.cl-dashboard-redesign-page #cl-member-signup-settings-page .collection-content .collection-item:not(.collection-status-edit) {
    min-width: 0 !important;
  }

  body.cl-dashboard-redesign-page #cl-log-page .log-frow {
    align-items: flex-start;
    flex-direction: column;
    gap: 10px;
  }

  body.cl-dashboard-redesign-page #cl-log-page .log-flabel {
    width: 100% !important;
    flex-basis: auto;
  }

  body.cl-dashboard-redesign-page #cl-log-page .log-ctrls,
  body.cl-dashboard-redesign-page #cl-log-page .slog-date-wrap.oi-cal-wrap,
  body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .slog-stx,
  body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .slog-search,
  body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .slog-ref {
    width: 100% !important;
  }

  body.cl-dashboard-redesign-page #cl-log-page .slog-btn-toggle.oi-presets {
    width: 100%;
  }

  body.cl-dashboard-redesign-page #cl-log-page .slog-btn-toggle.oi-presets > .oi-preset {
    flex: 1 1 25%;
    min-width: 0;
  }

  body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .bootstrap-select.slog-field,
  body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .bootstrap-select.slog-action,
  body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .bootstrap-select.slog-level {
    width: 100% !important;
  }

  body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .slog-search-btn-wrap,
  body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .slog-search-btn {
    width: 100% !important;
  }
}

@media only screen and (min-width: 360px) and (max-width: 767px) {
  body.cl-dashboard-redesign-page #cl-log-page .log-frow {
    align-items: center;
    flex-direction: row;
    gap: 16px;
  }

  body.cl-dashboard-redesign-page #cl-log-page .log-flabel {
    flex: 0 0 64px;
    width: 64px !important;
  }

  body.cl-dashboard-redesign-page #cl-log-page .log-ctrls {
    width: auto !important;
  }

  body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .bootstrap-select.slog-field,
  body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .bootstrap-select.slog-level {
    width: 120px !important;
  }

  body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .bootstrap-select.slog-action {
    width: 240px !important;
    max-width: 100%;
  }

  body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .slog-search-btn-wrap,
  body.cl-dashboard-redesign-page #cl-log-page .slog-search-box .slog-search-btn {
    width: auto !important;
  }
}

/* ===== 기본설정 ===== */
body.cl-dashboard-redesign-page #cl-basic-settings-page,
body.cl-dashboard-redesign-page #cl-basic-settings-page * {
  box-sizing: border-box;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .dashbottom-container.settingMarketing-Dash {
  display: block !important;
  float: none !important;
  width: 100% !important;
  max-width: 760px !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page #section-top-menu,
body.cl-dashboard-redesign-page #cl-basic-settings-page .mobile-title {
  display: none !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .cl-source-basic-settings-head {
  width: 100%;
  max-width: 760px;
  margin: 0 0 28px;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .cl-source-basic-settings-breadcrumb {
  display: flex;
  align-items: center;
  min-width: 0;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text);
  font-size: 20px;
  font-weight: 700;
  line-height: 1.35;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .cl-source-basic-settings-breadcrumb .current {
  color: var(--cl-text);
  font-weight: 800;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .cl-source-basic-settings-desc {
  margin: 12px 0 0 !important;
  padding: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 18px !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .site-detail.settings-dashboard {
  display: block !important;
  float: none !important;
  width: 100% !important;
  max-width: 760px !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .inner-box.new.setting-box {
  display: block !important;
  float: none !important;
  width: 100% !important;
  max-width: 760px !important;
  margin: 0 !important;
  padding: 30px 32px 26px !important;
  overflow: visible !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 14px !important;
  box-shadow: var(--cl-shadow-panel) !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-sub-box,
body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-sub-content,
body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-sub-content > ul {
  float: none !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-sub-box,
body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-sub-content > ul {
  display: flex !important;
  flex-direction: column;
  list-style: none;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-subInfoBox {
  float: none !important;
  width: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-subInfoBox + .setting-subInfoBox {
  margin-top: 24px !important;
  padding-top: 24px !important;
  border-top: 1px solid var(--cl-border) !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-sub-title {
  display: flex !important;
  float: none !important;
  align-items: center;
  gap: 6px;
  width: 100% !important;
  margin: 0 0 6px !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-size: 17px !important;
  font-weight: 800 !important;
  line-height: 24px !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-sub-content > ul > li:not(.settings-language),
body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-sub-content > ul > li.settings-language[style*="display:block"] {
  display: flex !important;
  align-items: flex-start;
  gap: 20px;
  width: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 22px 4px !important;
  background: transparent !important;
  border: 0 !important;
  list-style: none;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-sub-content > ul > li > label {
  display: flex !important;
  flex: 0 0 180px;
  align-items: center;
  gap: 5px;
  width: 180px !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 3px 0 0 !important;
  color: var(--cl-text) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 20px !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-sub-content > ul > li > label .cm-popover-info,
body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-sub-title .cm-popover-info {
  position: relative !important;
  top: .5px !important;
  display: block !important;
  flex: none;
  align-self: center !important;
  width: 15px !important;
  height: 15px !important;
  margin: 0 !important;
  color: var(--cl-accent-blue) !important;
  fill: currentColor !important;
  transform: none !important;
  vertical-align: middle !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .icon-pen,
body.cl-dashboard-redesign-page #cl-basic-settings-page .ueseinfo-detail,
body.cl-dashboard-redesign-page #cl-basic-settings-page .msetting-detail,
body.cl-dashboard-redesign-page #cl-basic-settings-page .language-detail,
body.cl-dashboard-redesign-page #cl-basic-settings-page .detail-kakaolink,
body.cl-dashboard-redesign-page #cl-basic-settings-page .detail-navermap,
body.cl-dashboard-redesign-page #cl-basic-settings-page .edit-favicon,
body.cl-dashboard-redesign-page #cl-basic-settings-page .kakaolink-info,
body.cl-dashboard-redesign-page #cl-basic-settings-page .navermap-info {
  display: flex !important;
  flex: 1 1 auto;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  min-width: 0;
  margin: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 14px !important;
  line-height: 1.65 !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .detail-language > .uselangText,
body.cl-dashboard-redesign-page #cl-basic-settings-page .kakaolink-setting > li > .usekakaolinkText {
  flex: 1 1 auto;
  min-width: 0;
  color: var(--cl-text-sub);
  font-size: 14px;
  line-height: 1.65;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .detail-language > .language-detail,
body.cl-dashboard-redesign-page #cl-basic-settings-page .kakaolink-setting > li > .kakaolink-detail {
  flex: 0 0 auto;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page :is(
  .mb-sitetitle,
  .mb-siteinfo,
  .plan-name,
  .plan-paydate,
  .site-meta-content,
  .mb-admEasyLogin,
  .msetting-val,
  .kakaolink-val,
  .navermap-val
) {
  min-width: 0;
  color: var(--cl-text-sub) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.65 !important;
  word-break: break-word;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .profile-content {
  display: flex !important;
  align-items: center;
  gap: 11px;
  min-width: 0;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .profile-content label {
  display: block !important;
  flex: none;
  width: 34px !important;
  height: 34px !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .profile-content svg {
  display: block;
  width: 34px !important;
  height: 34px !important;
  border-radius: 50%;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .site-profile {
  color: var(--cl-text) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .site-screen-content {
  display: block !important;
  flex: none;
  width: 120px !important;
  height: 78px !important;
  overflow: hidden;
  background: #f8fafb;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .site-screen-content img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .site-screen-content .over-box {
  display: none !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .site-favicon-content {
  display: inline-flex !important;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 34px !important;
  height: 34px !important;
  overflow: hidden;
  background: #f8fafb;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .favicon-img {
  display: block !important;
  width: 20px !important;
  height: 20px !important;
  object-fit: contain;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .edit-favicon,
body.cl-dashboard-redesign-page #cl-basic-settings-page .plan-detail {
  justify-content: flex-start;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .edit-favicon > .site-favicon-delete,
body.cl-dashboard-redesign-page #cl-basic-settings-page .plan-detail > .upgrade {
  margin-left: auto !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page :is(
  .icon-pen > a,
  .edit-favicon > a,
  .site-favicon-delete,
  .edit-meta,
  .language-update
) {
  display: inline-flex !important;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 34px !important;
  height: 34px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px;
  color: var(--cl-accent-blue) !important;
  line-height: 1 !important;
  text-decoration: none !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page :is(
  .icon-pen > a,
  .edit-favicon > a,
  .site-favicon-delete,
  .edit-meta,
  .language-update
):hover {
  background: var(--cl-green-soft) !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page :is(
  .icon-pen > a,
  .edit-favicon > a,
  .site-favicon-delete,
  .edit-meta,
  .language-update
) svg {
  width: 15px !important;
  height: 15px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page :is(.site-favicon-delete, .sns-delete, .kakaolink-delete, .navermap-delete, .language-delete) {
  color: #e5484d !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .site-favicon-delete.off {
  opacity: .35;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page :is(.sns-delete, .kakaolink-delete, .navermap-delete, .language-delete) {
  flex: none;
  width: 34px !important;
  height: 34px !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page :is(.sns-delete, .kakaolink-delete, .navermap-delete, .language-delete) svg,
body.cl-dashboard-redesign-page #cl-basic-settings-page :is(.sns-delete, .kakaolink-delete, .navermap-delete, .language-delete) path,
body.cl-dashboard-redesign-page #cl-basic-settings-page :is(.sns-delete, .kakaolink-delete, .navermap-delete, .language-delete) rect {
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page :is(.btn-add, #adm-easylogin-config, .billing, .language-default-btn) {
  display: inline-flex !important;
  flex: none;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 34px;
  margin: 0 !important;
  padding: 0 12px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  color: var(--cl-green-text) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  text-decoration: none !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page :is(.btn-add, #adm-easylogin-config, .billing, .language-default-btn):hover {
  border-color: var(--cl-green-line) !important;
  background: var(--cl-green-soft) !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page :is(.btn-add, #adm-easylogin-config, .billing, .language-default-btn) svg {
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page :is(.edit-titletext, .edit-siteinfotext, .kakaolink-edit-box, .navermap-edit-box) {
  flex: 1 1 auto;
  min-width: 0;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page :is(.edit-titletext, .edit-siteinfotext, .kakaolink-edit-box, .navermap-edit-box) .input-group {
  display: flex !important;
  align-items: stretch;
  gap: 8px;
  width: 100% !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page :is(.edit-titletext, .edit-siteinfotext, .kakaolink-edit-box, .navermap-edit-box) .input-group-btn {
  display: flex !important;
  flex: none;
  align-items: center;
  gap: 8px;
  width: auto !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page :is(.edit-input, .form-control.kakaolink-key, .form-control.navermap-key) {
  width: 100% !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 10px 12px !important;
  color: var(--cl-text) !important;
  font-size: 14px !important;
  line-height: 20px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  outline: none !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page textarea.edit-input {
  min-height: 80px !important;
  resize: vertical;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page :is(.edit-input, .form-control.kakaolink-key, .form-control.navermap-key):focus {
  border-color: var(--cl-green) !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page :is(.editCancel-btn, .registerSaveBtn, .kakaolink-key-save, .navermap-key-save, .kakaolink-key-cancel, .navermap-key-cancel) {
  display: inline-flex !important;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  line-height: 1 !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page :is(.editCancel-btn, .kakaolink-key-cancel, .navermap-key-cancel) {
  background: #f3f4f6 !important;
  border: 1px solid #e5e7eb !important;
  color: #4b5563 !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page :is(.registerSaveBtn, .kakaolink-key-save, .navermap-key-save) {
  background: var(--cl-green) !important;
  border: 1px solid var(--cl-green) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page :is(.editCancel-btn, .registerSaveBtn, .kakaolink-key-save, .navermap-key-save, .kakaolink-key-cancel, .navermap-key-cancel) svg,
body.cl-dashboard-redesign-page #cl-basic-settings-page :is(.editCancel-btn, .registerSaveBtn, .kakaolink-key-save, .navermap-key-save, .kakaolink-key-cancel, .navermap-key-cancel) path,
body.cl-dashboard-redesign-page #cl-basic-settings-page :is(.editCancel-btn, .registerSaveBtn, .kakaolink-key-save, .navermap-key-save, .kakaolink-key-cancel, .navermap-key-cancel) polygon,
body.cl-dashboard-redesign-page #cl-basic-settings-page :is(.editCancel-btn, .registerSaveBtn, .kakaolink-key-save, .navermap-key-save, .kakaolink-key-cancel, .navermap-key-cancel) rect {
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .msetting-info {
  display: flex !important;
  flex: 1 1 auto;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  min-width: 0;
}

body.cl-dashboard-redesign-page :is(#cl-basic-settings-page, .cl-source-domain-page) .simple-switch {
  position: relative !important;
  display: inline-block !important;
  flex: none;
  width: 36px !important;
  min-width: 36px !important;
  height: 20px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 999px !important;
  vertical-align: middle !important;
  line-height: 0 !important;
  transform: none !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page :is(#cl-basic-settings-page, .cl-source-domain-page) .simple-switch-input {
  position: absolute !important;
  inset: 0;
  z-index: 2;
  width: 36px !important;
  height: 20px !important;
  margin: 0 !important;
  padding: 0 !important;
  opacity: 0;
  cursor: pointer;
}

body.cl-dashboard-redesign-page :is(#cl-basic-settings-page, .cl-source-domain-page) .simple-switch-label {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 36px !important;
  height: 20px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #d5d9e0 !important;
  transition: background .18s !important;
}

body.cl-dashboard-redesign-page :is(#cl-basic-settings-page, .cl-source-domain-page) .simple-switch-label::before,
body.cl-dashboard-redesign-page :is(#cl-basic-settings-page, .cl-source-domain-page) .simple-switch-label::after {
  display: none !important;
  content: none !important;
}

body.cl-dashboard-redesign-page :is(#cl-basic-settings-page, .cl-source-domain-page) .simple-switch-handle {
  position: absolute !important;
  top: 3px !important;
  left: 3px !important;
  right: auto !important;
  bottom: auto !important;
  width: 14px !important;
  height: 14px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: #fff !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .2) !important;
  transform: translateX(0) !important;
  transition: transform .18s !important;
}

body.cl-dashboard-redesign-page :is(#cl-basic-settings-page, .cl-source-domain-page) .simple-switch-input:checked ~ .simple-switch-label {
  background: var(--cl-green, #03C75A) !important;
}

body.cl-dashboard-redesign-page :is(#cl-basic-settings-page, .cl-source-domain-page) .simple-switch-input:checked ~ .simple-switch-handle {
  left: 3px !important;
  transform: translateX(16px) !important;
}

body.cl-dashboard-redesign-page :is(#cl-basic-settings-page, .cl-source-domain-page) .simple-switch-input:disabled {
  cursor: default;
}

body.cl-dashboard-redesign-page :is(#cl-basic-settings-page, .cl-source-domain-page) .simple-switch-input:disabled ~ .simple-switch-label,
body.cl-dashboard-redesign-page :is(#cl-basic-settings-page, .cl-source-domain-page) .simple-switch.is-disabled .simple-switch-label {
  background: #d6d9dc !important;
}

body.cl-dashboard-redesign-page :is(#cl-basic-settings-page, .cl-source-domain-page) .simple-switch-input:disabled ~ .simple-switch-handle,
body.cl-dashboard-redesign-page :is(#cl-basic-settings-page, .cl-source-domain-page) .simple-switch.is-disabled .simple-switch-handle {
  background: #f5f6f8 !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .selected-languages {
  display: flex !important;
  flex-direction: column;
  gap: 8px;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .settings-language .languageContentsWrap {
  flex: 1 1 auto;
  min-width: 0;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .selected-languages > li {
  display: flex !important;
  align-items: center;
  gap: 10px;
  width: 100% !important;
  min-height: 40px;
  margin: 0 !important;
  padding: 0 12px !important;
  background: #f8fafb !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  color: var(--cl-text) !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .selected-languages .language-name {
  flex: 1 1 auto;
  min-width: 0;
  font-size: 14px;
  font-weight: 600;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .selected-languages .lang-icon {
  display: inline-flex;
  flex: none;
  align-items: center;
  min-height: 24px;
  padding: 0 8px;
  border-radius: 999px;
  background: var(--cl-green-soft);
  color: var(--cl-green-text);
  font-size: 12px;
  font-weight: 700;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .selected-languages .pull-right,
body.cl-dashboard-redesign-page #cl-basic-settings-page .kakaolink-info .pull-right,
body.cl-dashboard-redesign-page #cl-basic-settings-page .navermap-info .pull-right {
  float: none !important;
  margin-left: auto !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .add-language {
  display: inline-flex !important;
  align-items: center;
  margin-top: 10px !important;
  color: var(--cl-green-text) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-detail-btn {
  padding-top: 8px !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-detail-btn > span {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  margin-left: 200px;
  color: var(--cl-green-text) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .site-delete-wrap {
  display: flex !important;
  justify-content: flex-end;
  width: 100% !important;
  max-width: 760px !important;
  margin: 14px 0 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .site-delete-btn {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 38px;
  padding: 0 14px !important;
  background: #fff5f5 !important;
  border: 1px solid #ffd7d7 !important;
  border-radius: 8px !important;
  color: #e5484d !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  text-decoration: none !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .site-delete-btn svg,
body.cl-dashboard-redesign-page #cl-basic-settings-page .site-delete-btn path,
body.cl-dashboard-redesign-page #cl-basic-settings-page .site-delete-btn rect {
  fill: currentColor !important;
}

@media (max-width: 768px) {
  body.cl-dashboard-redesign-page #cl-basic-settings-page .dashbottom-container.settingMarketing-Dash,
  body.cl-dashboard-redesign-page #cl-basic-settings-page .cl-source-basic-settings-head,
  body.cl-dashboard-redesign-page #cl-basic-settings-page .site-detail.settings-dashboard,
  body.cl-dashboard-redesign-page #cl-basic-settings-page .inner-box.new.setting-box,
  body.cl-dashboard-redesign-page #cl-basic-settings-page .site-delete-wrap {
    max-width: none !important;
  }

  body.cl-dashboard-redesign-page #cl-basic-settings-page .inner-box.new.setting-box {
    padding: 24px 20px !important;
  }

  body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-sub-content > ul > li:not(.settings-language),
  body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-sub-content > ul > li.settings-language[style*="display:block"] {
    flex-direction: column;
    gap: 10px;
    padding: 18px 0 !important;
  }

  body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-sub-content > ul > li > label {
    flex: none;
    width: 100% !important;
    padding-top: 0 !important;
  }

  body.cl-dashboard-redesign-page #cl-basic-settings-page .icon-pen,
  body.cl-dashboard-redesign-page #cl-basic-settings-page .ueseinfo-detail,
  body.cl-dashboard-redesign-page #cl-basic-settings-page .msetting-detail,
  body.cl-dashboard-redesign-page #cl-basic-settings-page .language-detail,
  body.cl-dashboard-redesign-page #cl-basic-settings-page .detail-kakaolink,
  body.cl-dashboard-redesign-page #cl-basic-settings-page .detail-navermap,
  body.cl-dashboard-redesign-page #cl-basic-settings-page .edit-favicon {
    width: 100%;
  }

  body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-detail-btn > span {
    margin-left: 0;
  }

  body.cl-dashboard-redesign-page #cl-basic-settings-page .site-delete-wrap {
    justify-content: stretch;
  }

  body.cl-dashboard-redesign-page #cl-basic-settings-page .site-delete-btn {
    width: 100%;
  }
}

/* 기본설정 v2 기준 보정 */
body.cl-dashboard-redesign-page #cl-basic-settings-page .cl-source-basic-settings-head {
  margin: 0 !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .cl-source-basic-settings-breadcrumb {
  margin: 0 0 16px !important;
  color: var(--cl-text) !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .cl-source-basic-settings-breadcrumb .current {
  color: var(--cl-text, #222428) !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .cl-source-basic-settings-desc {
  margin: -8px 0 22px !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
  line-height: 1.6 !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-sub-box > .setting-subInfoBox:not(.setting-bsInfo),
body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo > .setting-sub-title,
body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .detail-site-meta,
body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .detail-adm-easylogin,
body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .detail-template {
  display: none !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .inner-box.new.setting-box {
  padding: 30px 32px 26px !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .setting-sub-content > ul {
  display: flex !important;
  flex-direction: column;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .setting-sub-content > ul > li {
  display: grid !important;
  grid-template-columns: 180px minmax(0, 1fr) 34px;
  align-items: flex-start;
  gap: 20px;
  width: 100% !important;
  margin: 0 !important;
  padding: 22px 4px !important;
  background: transparent !important;
  border: 0 !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .setting-sub-content > ul > li > label {
  grid-column: 1;
  width: 180px !important;
  padding-top: 3px !important;
  color: var(--cl-text) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 20px !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .detail-site-pofile > .icon-pen,
body.cl-dashboard-redesign-page #cl-basic-settings-page .detail-site-title > .icon-pen,
body.cl-dashboard-redesign-page #cl-basic-settings-page .detail-site-info > .icon-pen,
body.cl-dashboard-redesign-page #cl-basic-settings-page .detail-site-screen > .icon-pen {
  display: contents !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page :is(
  .profile-content,
  .mb-sitetitle,
  .mb-siteinfo,
  .site-screen-content
) {
  grid-column: 2;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .icon-pen > a {
  grid-column: 3;
  align-self: start;
  color: #03C75A !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .icon-pen > a svg {
  width: 18px !important;
  height: 18px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .edit-titletext,
body.cl-dashboard-redesign-page #cl-basic-settings-page .edit-siteinfotext {
  grid-column: 2 / 4;
  width: 100% !important;
  max-width: 560px;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .plan-detail {
  grid-column: 2 / 4;
  display: flex !important;
  align-items: center;
  gap: 8px;
  width: 100%;
  color: var(--cl-text) !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .plan-detail .plan-name,
body.cl-dashboard-redesign-page #cl-basic-settings-page .plan-detail .plan-paydate {
  color: var(--cl-text) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.65 !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .plan-detail .upgrade {
  margin-left: auto !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--cl-green-text) !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .site-screen-content {
  width: 120px !important;
  height: 78px !important;
  border-radius: 8px !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .edit-favicon {
  grid-column: 2 / 4;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 34px;
  align-items: start;
  gap: 20px;
  width: 100%;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .cl-bs-favicon-value {
  grid-column: 1;
  min-width: 0;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .cl-bs-fav-row {
  display: flex;
  align-items: center;
  gap: 10px;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .site-favicon-content {
  width: 30px !important;
  height: 30px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 6px !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .favicon-img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .cl-bs-fav-meta {
  color: var(--cl-text-sub);
  font-size: 14px;
  line-height: 1.65;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .cl-bs-browser {
  width: 400px;
  max-width: 100%;
  margin-top: 18px;
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--cl-border);
  border-radius: 10px 10px 8px 8px;
  box-shadow: 0 1px 3px rgba(20, 24, 32, .06);
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .cl-bs-browser-bar {
  display: flex;
  align-items: flex-end;
  gap: 8px;
  padding: 9px 12px 0;
  background: #e9ecf0;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .cl-bs-dots {
  display: flex;
  gap: 6px;
  padding-bottom: 9px;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .cl-bs-dots span {
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: #fff;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .cl-bs-tab {
  display: flex;
  align-items: center;
  gap: 8px;
  max-width: 200px;
  padding: 8px 14px;
  overflow: hidden;
  background: #fff;
  border-radius: 8px 8px 0 0;
  color: #5a616b;
  font-size: 12.5px;
  font-weight: 600;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .cl-bs-tab-fav {
  flex: none;
  width: 16px;
  height: 16px;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .cl-bs-tab-fav img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .cl-bs-tab-title {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .cl-bs-addr {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 12px;
  background: #fff;
  border-top: 1px solid #eef0f3;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .cl-bs-addr-nav {
  display: flex;
  gap: 8px;
  color: #c4c9d0;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .cl-bs-addr-nav svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .cl-bs-addr-url {
  flex: 1;
  min-width: 0;
  padding: 6px 12px;
  overflow: hidden;
  background: #f1f2f5;
  border-radius: 6px;
  color: #9ba1a9;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .cl-bs-fav-note {
  margin-top: 12px;
  color: var(--cl-text-sub);
  font-size: 13px;
  line-height: 1.6;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .edit-favicon > .site-favicon-delete {
  display: none !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .edit-favicon > a {
  grid-column: 2;
  align-self: start;
  position: relative !important;
  overflow: hidden !important;
  color: #03C75A !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .edit-favicon > a svg,
body.cl-dashboard-redesign-page #cl-basic-settings-page .edit-favicon > a svg path {
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .edit-favicon > a svg {
  position: absolute !important;
  top: 50% !important;
  left: 11px !important;
  z-index: 1 !important;
  display: block !important;
  flex: none !important;
  width: 18px !important;
  height: 18px !important;
  pointer-events: none !important;
  transform: translate(-50%, -50%) !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .edit-favicon > a .site-favicon-upload {
  position: absolute !important;
  inset: 0 !important;
  z-index: 2 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  opacity: 0 !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .site-delete-wrap {
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start !important;
  width: 100% !important;
  max-width: none !important;
  margin: 6px 0 0 !important;
  padding: 20px 4px 0 !important;
  border-top: 1px solid var(--cl-border) !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .site-settings-multilang-note {
  align-self: flex-start;
  margin: 0 0 36px !important;
  color: var(--cl-text-muted, #b4b8bf);
  font-size: 12.5px;
  line-height: 1.5;
  text-align: left;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .site-delete-btn {
  align-self: flex-end !important;
  width: auto !important;
  min-height: 0 !important;
  margin-left: auto !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: var(--cl-danger) !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .site-delete-btn svg,
body.cl-dashboard-redesign-page #cl-basic-settings-page .site-delete-btn svg path {
  width: 16px !important;
  height: 16px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.9 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .site-delete-btn svg {
  display: block !important;
  flex: 0 0 16px !important;
  margin: 0 !important;
  transform: none !important;
}

/* 기본설정 v2 레이아웃 최종 정렬 */
body.cl-dashboard-redesign-page #cl-basic-settings-page .dashbottom-container.settingMarketing-Dash {
  width: 100% !important;
  max-width: 824px !important;
  margin: 0 !important;
  padding-right: 32px !important;
  padding-left: 32px !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .cl-source-basic-settings-head,
body.cl-dashboard-redesign-page #cl-basic-settings-page .site-detail.settings-dashboard,
body.cl-dashboard-redesign-page #cl-basic-settings-page .inner-box.new.setting-box {
  max-width: 760px !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo,
body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .setting-sub-content,
body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .setting-sub-content > ul {
  width: 100% !important;
  max-width: none !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .setting-sub-content > ul > li {
  grid-template-columns: 180px minmax(0, 1fr) 34px !important;
  align-items: flex-start !important;
  column-gap: 20px !important;
  row-gap: 8px !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .setting-sub-content > ul > li > label {
  align-self: flex-start !important;
  padding-top: 3px !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .detail-site-pofile > .icon-pen,
body.cl-dashboard-redesign-page #cl-basic-settings-page .detail-site-title > .icon-pen,
body.cl-dashboard-redesign-page #cl-basic-settings-page .detail-site-info > .icon-pen,
body.cl-dashboard-redesign-page #cl-basic-settings-page .detail-site-screen > .icon-pen {
  position: static !important;
  display: flex !important;
  grid-column: 2 / 4 !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 20px !important;
  width: 100% !important;
  min-width: 0 !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page :is(
  .profile-content,
  .mb-sitetitle,
  .mb-siteinfo,
  .plan-detail,
  .site-screen-content
) {
  align-self: flex-start !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .profile-content,
body.cl-dashboard-redesign-page #cl-basic-settings-page .profile-content span,
body.cl-dashboard-redesign-page #cl-basic-settings-page .profile-content svg,
body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .icon-pen > a {
  position: static !important;
  top: auto !important;
  right: auto !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page :is(
  .profile-content,
  .mb-sitetitle,
  .mb-siteinfo
) {
  flex: 1 1 auto !important;
  min-width: 0 !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .plan-detail {
  grid-column: 2 / 4 !important;
  justify-content: flex-start !important;
  gap: 8px !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .plan-detail .upgrade {
  width: auto !important;
  min-height: 0 !important;
  margin-left: auto !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: var(--cl-green-text) !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page#cl-basic-settings-page .plan-detail > .upgrade {
  display: inline-flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 3px !important;
  width: auto !important;
  min-height: 0 !important;
  margin-left: auto !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: var(--cl-green-text) !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  text-decoration: none !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page#cl-basic-settings-page .plan-detail > .upgrade:hover,
body.cl-dashboard-redesign-page #cl-basic-settings-page#cl-basic-settings-page .plan-detail > .upgrade:focus {
  background: transparent !important;
  border: 0 !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .plan-detail > .upgrade #detail-plan-up {
  display: inline-flex !important;
  align-items: center !important;
  gap: 3px !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .icon-pen > a,
body.cl-dashboard-redesign-page #cl-basic-settings-page .edit-favicon > a {
  display: inline-flex !important;
  flex: 0 0 34px !important;
  align-items: center !important;
  justify-content: center !important;
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 8px !important;
  color: #03C75A !important;
  line-height: 1 !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .icon-pen > a {
  align-self: center !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .detail-site-info > .icon-pen > a {
  align-self: flex-start !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .detail-site-favicon {
  align-items: flex-start !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .detail-site-screen {
  align-items: flex-start !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .detail-site-screen > label {
  align-self: flex-start !important;
  padding-top: 3px !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .detail-site-screen > .icon-pen {
  align-items: flex-start !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .detail-site-screen > .icon-pen > a {
  align-self: flex-start !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .detail-site-favicon > label,
body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .detail-site-favicon > .edit-favicon > a {
  align-self: flex-start !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .detail-site-favicon > label {
  padding-top: 3px !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .setting-sub-content > ul > li.detail-site-meta {
  display: none !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo :is(.edit-titletext, .edit-siteinfotext) {
  grid-column: 2 / 4 !important;
  width: 100% !important;
  max-width: 560px !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .setting-sub-content > ul > li.is-editing > :is(.edit-sitetitle, .edit-siteinfo) {
  display: none !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .setting-sub-content > ul > li.is-editing > :is(.edit-titletext, .edit-siteinfotext) {
  display: block !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo :is(.edit-titletext, .edit-siteinfotext) .input-group {
  display: flex !important;
  width: 100% !important;
  max-width: 560px !important;
  gap: 8px !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .edit-titletext .input-group {
  align-items: center !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .edit-siteinfotext .input-group {
  align-items: stretch !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo :is(.edit-titletext, .edit-siteinfotext) .input-group-btn {
  display: flex !important;
  flex: 0 0 auto !important;
  width: auto !important;
  gap: 6px !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .edit-titletext .input-group-btn {
  flex-direction: row !important;
  align-items: center !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .edit-siteinfotext .input-group-btn {
  flex-direction: column !important;
  align-items: stretch !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo :is(.edit-titletext, .edit-siteinfotext) textarea.edit-input {
  box-sizing: border-box !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 10px 12px !important;
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  font-family: inherit !important;
  background: #fff !important;
  border: 1px solid var(--cl-green) !important;
  border-radius: 8px !important;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .12) !important;
  outline: none !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .edit-titletext textarea.edit-input {
  height: 40px !important;
  min-height: 40px !important;
  max-height: 40px !important;
  resize: none !important;
  overflow: hidden !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .edit-siteinfotext textarea.edit-input {
  min-height: 84px !important;
  resize: vertical !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo :is(.editCancel-btn, .registerSaveBtn) {
  box-sizing: border-box !important;
  display: inline-flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  justify-content: center !important;
  width: 38px !important;
  min-width: 38px !important;
  height: 34px !important;
  min-height: 34px !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 8px !important;
  cursor: pointer !important;
  line-height: 1 !important;
  transition: background .12s, color .12s, border-color .12s !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .editCancel-btn {
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  color: var(--cl-text-muted) !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .editCancel-btn:hover {
  background: #f1f2f5 !important;
  color: var(--cl-text) !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .registerSaveBtn {
  background: var(--cl-green) !important;
  border: 1px solid var(--cl-green) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .registerSaveBtn:hover {
  background: var(--cl-green-hover) !important;
  border-color: var(--cl-green-hover) !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo :is(.editCancel-btn, .registerSaveBtn) svg {
  width: 16px !important;
  height: 16px !important;
  display: block !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .registerSaveBtn svg,
body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .registerSaveBtn svg :is(path, polygon, rect) {
  fill: none !important;
  stroke: currentColor !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .editCancel-btn svg {
  width: 12px !important;
  height: 12px !important;
  fill: currentColor !important;
  stroke: none !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .editCancel-btn svg path {
  fill: currentColor !important;
  stroke: none !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .icon-pen > a svg,
body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .icon-pen > a svg path {
  display: block !important;
  flex: 0 0 auto !important;
  width: 18px !important;
  height: 18px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .icon-pen > a svg {
  transform: translateX(-3px) !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .icon-pen > a:hover,
body.cl-dashboard-redesign-page #cl-basic-settings-page .edit-favicon > a:hover {
  background: #eaf9f0 !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .plan-detail .upgrade svg {
  width: 15px !important;
  height: 15px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .plan-detail .upgrade svg path {
  fill: none !important;
  stroke: currentColor !important;
}

@media (max-width: 768px) {
  body.cl-dashboard-redesign-page #cl-basic-settings-page .dashbottom-container.settingMarketing-Dash {
    max-width: none !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
  }

  body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .setting-sub-content > ul > li {
    position: relative;
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    padding: 18px 0 !important;
  }

  body.cl-dashboard-redesign-page #cl-basic-settings-page .inner-box.new.setting-box {
    padding: 12px 18px 14px !important;
  }

  body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .setting-sub-content > ul > li + li {
    border-top: 1px solid var(--cl-border) !important;
  }

  body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .setting-sub-content > ul > li > label {
    width: 100% !important;
    max-width: none !important;
    padding-right: 40px !important;
  }

  body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .icon-pen > a,
  body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .edit-favicon > a {
    position: absolute !important;
    top: 14px !important;
    right: 0 !important;
  }

  body.cl-dashboard-redesign-page #cl-basic-settings-page .plan-detail {
    position: static;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 4px !important;
    min-width: 0;
    text-align: left;
  }

  body.cl-dashboard-redesign-page #cl-basic-settings-page .edit-favicon {
    position: static;
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .detail-plan > label {
    padding-right: 110px !important;
  }

  body.cl-dashboard-redesign-page #cl-basic-settings-page .plan-detail > .upgrade {
    position: absolute;
    top: 21px;
    right: 0;
  }

  body.cl-dashboard-redesign-page #cl-basic-settings-page .plan-detail > :is(.plan-name, .plan-paydate) {
    flex: none;
    white-space: nowrap;
  }

  body.cl-dashboard-redesign-page #cl-basic-settings-page .plan-detail > .plan-paydate:empty {
    display: none;
  }

}

/* Common disabled / plan-locked button state */
body.cl-dashboard-redesign-page,
body.cl-redesign-scroll-page {
  --cl-disabled-button-border: #aeb5bf;
}

body.cl-dashboard-redesign-page :is(a, button, input[type="button"], input[type="submit"], .btn, .setting-button, .plan-btn, [role="button"], [class*="-btn"], [class*="Btn"]):is(.member_disabled, .shopping_disabled, .ss_user_noActive, .disabled):not(.toggle-lg):not(.switch),
body.cl-redesign-scroll-page :is(a, button, input[type="button"], input[type="submit"], .btn, .setting-button, .plan-btn, [role="button"], [class*="-btn"], [class*="Btn"]):is(.member_disabled, .shopping_disabled, .ss_user_noActive, .disabled):not(.toggle-lg):not(.switch),
body.cl-dashboard-redesign-page :is(a, button, input[type="button"], input[type="submit"], .btn, .setting-button, .plan-btn, [role="button"], [class*="-btn"], [class*="Btn"]):is(.member_disabled, .shopping_disabled, .ss_user_noActive, .disabled):not(.toggle-lg):not(.switch):hover,
body.cl-redesign-scroll-page :is(a, button, input[type="button"], input[type="submit"], .btn, .setting-button, .plan-btn, [role="button"], [class*="-btn"], [class*="Btn"]):is(.member_disabled, .shopping_disabled, .ss_user_noActive, .disabled):not(.toggle-lg):not(.switch):hover,
body.cl-dashboard-redesign-page :is(a, button, input[type="button"], input[type="submit"], .btn, .setting-button, .plan-btn, [role="button"], [class*="-btn"], [class*="Btn"]):is(.member_disabled, .shopping_disabled, .ss_user_noActive, .disabled):not(.toggle-lg):not(.switch):focus,
body.cl-redesign-scroll-page :is(a, button, input[type="button"], input[type="submit"], .btn, .setting-button, .plan-btn, [role="button"], [class*="-btn"], [class*="Btn"]):is(.member_disabled, .shopping_disabled, .ss_user_noActive, .disabled):not(.toggle-lg):not(.switch):focus {
  border: var(--cl-disabled-button-border-width, 1px) solid var(--cl-disabled-button-border) !important;
  box-shadow: none !important;
  opacity: 1 !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-plan-page, #cl-member-signup-settings-page, #cl-member-verify-page, #cl-member-social-login-page, #cl-member-uadmin-page, #cl-member-waitlist-page, #cl-member-list-page, #cl-member-leavelist-page, #cl-member-blocklist-page, #cl-shopping-settings-page, #cl-shopping-order-page, #cl-shopping-order-search-page, #cl-shopping-inquiry-page) :is(a, button, input[type="button"], input[type="submit"], .btn, .setting-button, .plan-btn, [role="button"], [class*="-btn"], [class*="Btn"]):is(.member_disabled, .shopping_disabled, .ss_user_noActive, .disabled):not(.toggle-lg):not(.switch),
body.cl-dashboard-redesign-page :is(.cl-source-plan-page, #cl-member-signup-settings-page, #cl-member-verify-page, #cl-member-social-login-page, #cl-member-uadmin-page, #cl-member-waitlist-page, #cl-member-list-page, #cl-member-leavelist-page, #cl-member-blocklist-page, #cl-shopping-settings-page, #cl-shopping-order-page, #cl-shopping-order-search-page, #cl-shopping-inquiry-page) :is(a, button, input[type="button"], input[type="submit"], .btn, .setting-button, .plan-btn, [role="button"], [class*="-btn"], [class*="Btn"]):is(.member_disabled, .shopping_disabled, .ss_user_noActive, .disabled):not(.toggle-lg):not(.switch):hover,
body.cl-dashboard-redesign-page :is(.cl-source-plan-page, #cl-member-signup-settings-page, #cl-member-verify-page, #cl-member-social-login-page, #cl-member-uadmin-page, #cl-member-waitlist-page, #cl-member-list-page, #cl-member-leavelist-page, #cl-member-blocklist-page, #cl-shopping-settings-page, #cl-shopping-order-page, #cl-shopping-order-search-page, #cl-shopping-inquiry-page) :is(a, button, input[type="button"], input[type="submit"], .btn, .setting-button, .plan-btn, [role="button"], [class*="-btn"], [class*="Btn"]):is(.member_disabled, .shopping_disabled, .ss_user_noActive, .disabled):not(.toggle-lg):not(.switch):focus {
  border: var(--cl-disabled-button-border-width, 1px) solid var(--cl-disabled-button-border) !important;
  opacity: 1 !important;
}

body.cl-dashboard-redesign-page .cl-source-sidebar button#clSourceSitePublishToggle.cl-source-status-row.ss_user_noActive,
body.cl-dashboard-redesign-page .cl-source-sidebar button#clSourceSitePublishToggle.cl-source-status-row.ss_user_noActive:hover,
body.cl-dashboard-redesign-page .cl-source-sidebar button#clSourceSitePublishToggle.cl-source-status-row.ss_user_noActive:focus,
body.cl-dashboard-redesign-page .cl-source-sidebar button#clSourceSitePublishToggle.cl-source-status-row.ss_user_noActive:active {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--cl-text-muted) !important;
  opacity: 1 !important;
  outline: 0 !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .cl-source-sidebar button#clSourceSitePublishToggle.cl-source-status-row.ss_user_noActive .cl-source-toggle,
body.cl-dashboard-redesign-page .cl-source-sidebar button#clSourceSitePublishToggle.cl-source-status-row.ss_user_noActive .cl-source-toggle.off {
  background: #c9cdd3 !important;
}

body.cl-dashboard-redesign-page .cl-source-sidebar button#clSourceSitePublishToggle.cl-source-status-row.ss_user_noActive .cl-source-status-text {
  color: var(--cl-text-muted) !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .main-kakaotalk-wrap .cl-source-alimtalk-charge.ss_user_noActive,
body.cl-dashboard-redesign-page .cl-dashboard-home .main-kakaotalk-wrap .cl-source-alimtalk-charge.ss_user_noActive:hover,
body.cl-dashboard-redesign-page .cl-dashboard-home .main-kakaotalk-wrap .cl-source-alimtalk-charge.ss_user_noActive:focus {
  background: var(--cl-green) !important;
  border: 0 !important;
  box-shadow: none !important;
  color: #fff !important;
  opacity: 1 !important;
}

/* Source dashboard legacy inbox rendered with live data */
body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .cl-source-mark-all-read.ss_user_noActive,
body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .cl-source-mark-all-read.ss_user_noActive:hover,
body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .cl-source-mark-all-read.ss_user_noActive:focus {
  padding: 3px 7px !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 6px !important;
  box-shadow: none !important;
  color: var(--cl-text) !important;
  opacity: 1 !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .inbox {
  display: flex !important;
  height: 100% !important;
  min-height: 0 !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
  overflow: hidden !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .inbox .tab-content,
body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .inbox .tab-content.empty,
body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .inbox .tab-content.not-empty,
body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .inbox .tab-content.not-empty.inbox-ctrls-on,
body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .generalkakaotalk-cls .inbox .tab-content.not-empty,
body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .generalkakaotalk-cls .inbox .tab-content.empty,
body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .generalkakaotalk-cls .inbox .tab-content.not-empty.inbox-ctrls-on {
  flex: 1 1 auto !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch;
  scrollbar-color: #d6dbe3 transparent;
  scrollbar-gutter: stable;
  background: #fff !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: var(--cl-text) !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .inbox .tab-content::-webkit-scrollbar {
  width: 8px;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .inbox .tab-content::-webkit-scrollbar-track {
  background: transparent;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .inbox .tab-content::-webkit-scrollbar-thumb {
  background: #d6dbe3;
  border-radius: 999px;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .inbox .tab-content.ss_user_noActive .inbox-list a,
body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .inbox .tab-content.ss_user_noActive .mark-read {
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .inbox .inbox-list {
  display: block !important;
  width: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .inbox .list-item.row {
  display: flex !important;
  min-height: var(--cl-inbox-row-height, 64px) !important;
  align-items: flex-start !important;
  gap: var(--cl-inbox-row-gap, 10px) !important;
  margin: 0 !important;
  padding: var(--cl-inbox-row-padding, 12px 8px) !important;
  background: transparent !important;
  border: 0 !important;
  border-top: 1px solid var(--cl-border) !important;
  color: var(--cl-text) !important;
  cursor: pointer;
  opacity: 1 !important;
  transition: background-color .12s ease;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .inbox .list-item.row:first-child {
  border-top: 0 !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .inbox .list-item.row.unread,
body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .inbox .inbox-list .unread {
  background: transparent !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .inbox .list-item.row:hover,
body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .inbox .list-item.row:focus-within,
body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .inbox .list-item.row.unread:hover,
body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .inbox .inbox-list .unread:hover {
  background: #f7f8fa !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .inbox .list-img {
  /* 모바일 레거시 absolute를 해제해 아이콘 너비와 제목 사이 간격을 확보한다. */
  position: static;
  display: flex !important;
  width: var(--cl-inbox-icon-size, 30px) !important;
  min-width: var(--cl-inbox-icon-size, 30px) !important;
  max-width: var(--cl-inbox-icon-size, 30px) !important;
  flex: 0 0 var(--cl-inbox-icon-size, 30px) !important;
  float: none !important;
  align-items: flex-start !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .inbox .list-img .icon {
  display: inline-flex !important;
  width: var(--cl-inbox-icon-size, 30px) !important;
  height: var(--cl-inbox-icon-size, 30px) !important;
  align-items: center !important;
  justify-content: center !important;
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 50% !important;
  background: #eef0f3 !important;
  color: #9ba1a9 !important;
  font-size: 13px !important;
  line-height: 1 !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .inbox .list-img .icon svg,
body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .inbox .list-img .icon img {
  width: 15px !important;
  height: 15px !important;
  max-width: 15px !important;
  max-height: 15px !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .inbox .user-profile-img {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .inbox .list-content {
  display: grid !important;
  min-width: 0 !important;
  max-width: none !important;
  flex: 1 1 auto !important;
  grid-template-columns: minmax(0, max-content) auto 1fr;
  align-items: baseline;
  column-gap: 14px;
  row-gap: 3px;
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
  -webkit-padding-start: 0 !important;
  color: var(--cl-text-sub) !important;
  line-height: 1.5 !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .inbox .list-content::before,
body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .inbox .list-content::after {
  display: none !important;
  content: none !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .inbox .list-content .inner-box {
  display: contents !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .inbox .list-content .label-country {
  display: inline-flex !important;
  min-width: max-content;
  grid-column: 3;
  grid-row: 1;
  align-items: center;
  justify-self: start;
  padding: 0 4px;
  border: 1px solid var(--cl-border);
  border-radius: var(--r-xs, 4px);
  background: transparent;
  color: var(--cl-text-sub);
  font-size: 11px;
  font-weight: 500;
  line-height: 16px;
  text-transform: uppercase;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .inbox .list-item.row[data-boxtype="comments"] .list-img .icon {
  font-size: 0 !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .inbox .list-item.row[data-boxtype="comments"] .list-img .icon > * {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .inbox .list-item.row[data-boxtype="comments"] .list-img .icon::before {
  display: block;
  width: 15px;
  height: 15px;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0.5 24 24' xmlns='http://www.w3.org/2000/svg' fill='none' stroke='%23aeb5bf' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 5h16v11H9l-5 4V5z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  content: "";
}

body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .inbox .list-content .ib-name {
  display: block !important;
  max-width: 170px;
  grid-column: 1;
  grid-row: 1;
  overflow: hidden;
  margin: 0 !important;
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .inbox .list-item.row.read .list-content .ib-name {
  color: var(--cl-text-sub) !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .inbox .list-content a {
  display: block !important;
  max-width: 100% !important;
  grid-column: 1 / -1;
  grid-row: 2;
  overflow: hidden;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
  text-decoration: none !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .inbox .list-content .ib-content {
  display: -webkit-box !important;
  overflow: hidden !important;
  word-break: break-word !important;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .inbox .list-item.row.unread .list-content a,
body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .inbox .list-item.row.unread .list-content .ib-content {
  color: var(--cl-text) !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .inbox .list-content .list-date {
  display: flex !important;
  min-width: max-content;
  grid-column: 2;
  grid-row: 1;
  align-items: center !important;
  justify-content: flex-start !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text-muted) !important;
  font-size: 11.5px !important;
  font-weight: 400 !important;
  line-height: 1.25 !important;
  text-align: left !important;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .inbox .list-content .list-date .ib-time {
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
  color: inherit !important;
  line-height: inherit !important;
}

body.cl-dashboard-redesign-page .cl-dashboard-home .main-activity.cl-home-notification-panel .inbox .mark-read {
  display: none !important;
}

body.cl-dashboard-redesign-page #cl-member-signup-settings-page .mng-bottom-btn-wrap.siteUM .btn.member_disabled,
body.cl-dashboard-redesign-page #cl-member-signup-settings-page .mng-bottom-btn-wrap.siteUM .btn.member_disabled:hover,
body.cl-dashboard-redesign-page #cl-member-signup-settings-page .mng-bottom-btn-wrap.siteUM .btn.member_disabled:focus {
  background: #fff !important;
  color: var(--cl-text-muted) !important;
}

/* Marketing redesign */
body.cl-dashboard-redesign-page #cl-marketing-page {
  container: cl-marketing-content / inline-size;
  --mkt-green: #03C75A;
  --mkt-green-hover: #02b351;
  --mkt-text: #222428;
  --mkt-muted: #8a8f98;
  --text-muted: #b4b8bf;
  --disabled-opacity: .45;
  --mkt-border: #e5e7eb;
  --mkt-bg: #f4f5f9;
  background: var(--mkt-bg);
  min-height: calc(100vh - 64px);
}

body.cl-dashboard-redesign-page #cl-marketing-page .dashbottom-container.settingMarketing-Dash {
  width: 100%;
  max-width: 1590px;
  margin: 0 auto;
  padding: 30px 26px 60px;
  box-sizing: border-box;
}

body.cl-dashboard-redesign-page #cl-marketing-page .cl-source-marketing-head h1 {
  margin: 0 0 12px;
  font-size: 24px;
  font-weight: 700;
  color: var(--mkt-text);
  letter-spacing: 0;
}

body.cl-dashboard-redesign-page #cl-marketing-page .cl-source-marketing-head p {
  margin: 0 0 22px;
  font-size: 14px;
  color: #707783;
}

body.cl-dashboard-redesign-page #cl-marketing-page .cl-source-marketing-layout {
  display: flex;
  align-items: flex-start;
  flex-wrap: nowrap;
  gap: 24px;
  width: 100%;
}

body.cl-dashboard-redesign-page #cl-marketing-page .cl-source-marketing-panel {
  flex: 1 1 1040px;
  width: 100%;
  max-width: 1040px;
  min-width: 0;
  background: #fff;
  border: 1px solid #dfe3e8;
  border-radius: 14px;
  box-shadow: 0 1px 2px rgba(16, 24, 40, .04);
  overflow: hidden;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-guide {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  padding: 36px 52px;
  border-bottom: 1px solid var(--mkt-border);
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-guide strong,
body.cl-dashboard-redesign-page #cl-marketing-page .mkt-sec h2 {
  display: block;
  margin: 0;
  color: var(--mkt-text);
  font-size: 18px;
  font-weight: 700;
  letter-spacing: 0;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-guide p,
body.cl-dashboard-redesign-page #cl-marketing-page .mkt-sec p {
  margin: 8px 0 0;
  color: #707783;
  font-size: 13px;
  line-height: 1.6;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-help-btn,
body.cl-dashboard-redesign-page #cl-marketing-page .primary-btn,
body.cl-dashboard-redesign-page #cl-marketing-page .mkt-reg-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 98px;
  height: 40px;
  padding: 0 18px;
  border: 1px solid var(--mkt-green);
  border-radius: 8px;
  background: var(--mkt-green);
  color: #fff !important;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none !important;
  box-sizing: border-box;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-help-btn:hover,
body.cl-dashboard-redesign-page #cl-marketing-page .primary-btn:hover,
body.cl-dashboard-redesign-page #cl-marketing-page .mkt-reg-action:hover {
  background: var(--mkt-green-hover);
  border-color: var(--mkt-green-hover);
}

/* 등록된 마케팅 키·분석 ID: 사용 중 배지 · 실제 값 · 수정 버튼 */
.cl-dashboard-redesign#cl-marketing-page .mkt-key-status {
  grid-column: 2;
  grid-row: 1;
  display: flex;
  align-items: center;
  min-width: 0;
  max-width: 100%;
}

.cl-dashboard-redesign#cl-marketing-page .mkt-key-status .mkt-reg-done {
  display: inline-flex;
  align-items: center;
  flex: none;
  gap: 4px;
  margin-right: 8px;
  padding: 3px 9px;
  border-radius: 999px;
  background: var(--cl-green-badge);
  color: var(--cl-green-text);
  font-size: 12px;
  font-weight: 700;
  line-height: normal;
  white-space: nowrap;
}

.cl-dashboard-redesign#cl-marketing-page .mkt-key-status .mkt-reg-done svg {
  width: 11px;
  height: 11px;
}

.cl-dashboard-redesign#cl-marketing-page .mkt-key-status .mkt-reg-code {
  flex: 0 1 auto;
  color: var(--cl-text-sub);
  /* 대시보드의 공통 서체 강제 규칙에서 마케팅 키·분석 ID만 고정폭으로 구분한다. */
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
}

.cl-dashboard-redesign#cl-marketing-page .mkt-key-edit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 24px;
  height: 24px;
  margin-left: 6px;
  padding: 0;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--cl-text-muted);
  cursor: pointer;
  transition: color .12s, background .12s;
}

.cl-dashboard-redesign#cl-marketing-page .mkt-key-edit svg {
  width: 14px;
  height: 14px;
}

.cl-dashboard-redesign#cl-marketing-page .mkt-key-edit:not(:disabled):is(:hover, :focus-visible) {
  background: var(--cl-bg-3);
  color: var(--cl-text);
}

.cl-dashboard-redesign#cl-marketing-page .mkt-key-edit:focus-visible {
  outline: 2px solid var(--cl-green);
  outline-offset: 2px;
}

.cl-dashboard-redesign#cl-marketing-page .mkt-key-edit:disabled {
  opacity: .5;
  cursor: default;
}

@container cl-marketing-content (max-width: 900px) {
  .cl-dashboard-redesign#cl-marketing-page .mkt-key-status {
    grid-column: 1;
    grid-row: 2;
  }
}

@media (pointer: coarse) {
  .cl-dashboard-redesign#cl-marketing-page .mkt-key-edit {
    width: 44px;
    height: 44px;
  }
}

body.cl-dashboard-redesign-page #cl-marketing-page .secondary-btn,
body.cl-dashboard-redesign-page #cl-marketing-page .mkt-copy-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 36px;
  min-width: 64px;
  padding: 0 14px;
  border: 1px solid #d8dde5;
  border-radius: 8px;
  background: #fff;
  color: var(--mkt-text);
  font-size: 13px;
  font-weight: 700;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-sec {
  padding: 34px 52px;
  border-bottom: 1px solid var(--mkt-border);
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-sec:last-child {
  border-bottom: 0;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-sec-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 24px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 18px 0;
  border-top: 1px solid var(--mkt-border);
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-row:first-child {
  border-top: 0;
  padding-top: 0;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-row-label strong {
  display: block;
  color: var(--mkt-text);
  font-size: 15px;
  font-weight: 700;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-row-label span {
  display: block;
  margin-top: 6px;
  color: var(--mkt-muted);
  font-size: 13px;
  line-height: 1.5;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-row-ctrl {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 18px;
  flex-wrap: wrap;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-tog {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  color: var(--mkt-muted);
  font-size: 13px;
  font-weight: 700;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-check {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  color: #5f6672;
  font-size: 13.5px;
  font-weight: 400;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-check input[type="checkbox"] {
  -webkit-appearance: none;
  appearance: none;
  position: relative;
  flex: none;
  width: 18px;
  height: 18px;
  margin: 0;
  box-sizing: border-box;
  border: 1.5px solid #c9cdd4;
  border-radius: 4px;
  background: #fff;
  cursor: pointer;
  transition: background .12s, border-color .12s;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-check input[type="checkbox"]:checked {
  border-color: var(--mkt-green);
  background-color: var(--mkt-green);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12.5l4.2 4.2L19 6.5' fill='none' stroke='%23ffffff' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 12px 12px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-check input[type="checkbox"]:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .2);
}

body.cl-dashboard-redesign-page #cl-marketing-page .marketing-seo-apply-all-option.is-disabled {
  color: var(--text-secondary, #8a8f98);
  cursor: not-allowed;
  opacity: var(--disabled-opacity);
}

body.cl-dashboard-redesign-page #cl-marketing-page .marketing-seo-apply-all-option input[type="checkbox"]:disabled {
  border-color: #d8dce2;
  background: #eef0f3;
  cursor: not-allowed;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-accord {
  margin-top: 0;
  border: 0;
  border-top: 1px solid #eff0f3;
  border-radius: 0;
  background: transparent;
  overflow: visible;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-accord-head {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: auto;
  min-height: 56px;
  padding: 16px 10px 16px 0;
  border: 0;
  background: transparent;
  color: var(--mkt-text);
  text-align: left;
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
  cursor: pointer;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-accord-body {
  display: none;
  padding: 2px 0 22px;
  border-top: 0;
  background: transparent;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-accord-head::after {
  content: "";
  width: 8px;
  height: 8px;
  margin-left: 16px;
  border-right: 1.5px solid #aeb7c3;
  border-bottom: 1.5px solid #aeb7c3;
  transform: rotate(45deg) translateY(-2px);
  transition: transform .18s ease;
  flex: 0 0 auto;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-accord.active .mkt-accord-body {
  display: block;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-accord.open .mkt-accord-body {
  display: block;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-accord.active .mkt-accord-head::after,
body.cl-dashboard-redesign-page #cl-marketing-page .mkt-accord.open .mkt-accord-head::after {
  transform: rotate(225deg) translate(-2px, -2px);
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-basic {
  display: flex;
  gap: 26px;
  align-items: flex-start;
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-basic-side {
  flex: 0 0 150px;
  width: 150px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-basic-side-title {
  margin-bottom: 8px;
  color: var(--mkt-text);
  font-size: 13px;
  font-weight: 700;
}

body.cl-dashboard-redesign-page #cl-marketing-page .marketing-seo-menu-select-wrap {
  position: relative;
  width: 100%;
}

body.cl-dashboard-redesign-page #cl-marketing-page .marketing-seo-menu-select-wrap::after {
  display: none;
}

body.cl-dashboard-redesign-page #cl-marketing-page .marketing-seo-menu-select {
  display: none;
}

body.cl-dashboard-redesign-page #cl-marketing-page .marketing-seo-menu-custom-select {
  display: block;
  width: 100%;
}

body.cl-dashboard-redesign-page #cl-marketing-page .marketing-seo-menu-custom-select .cl-redesign-select-trigger {
  justify-content: flex-start;
  width: 100%;
  height: 38px;
  min-width: 0;
  padding: 0 9px 0 12px;
  border: 1px solid #d8dde5;
  border-radius: 8px;
  background: #fff;
  color: #8a8f98;
  font-size: 13px;
  font-weight: 500;
  line-height: 34px;
  box-sizing: border-box;
}

body.cl-dashboard-redesign-page #cl-marketing-page .marketing-seo-menu-custom-select.open .cl-redesign-select-trigger,
body.cl-dashboard-redesign-page #cl-marketing-page .marketing-seo-menu-custom-select .cl-redesign-select-trigger:hover,
body.cl-dashboard-redesign-page #cl-marketing-page .marketing-seo-menu-custom-select .cl-redesign-select-trigger:focus {
  background: #fafbfc;
  border-color: #d5d9e0;
  color: var(--mkt-text);
  box-shadow: none;
}

body.cl-dashboard-redesign-page #cl-marketing-page .marketing-seo-menu-custom-select .cl-redesign-select-label {
  flex: 0 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page #cl-marketing-page .marketing-seo-menu-custom-select .cl-redesign-select-arrow {
  margin-left: auto;
}

body.cl-dashboard-redesign-page #cl-marketing-page .marketing-seo-menu-custom-select .cl-redesign-select-menu {
  width: 100%;
  min-width: 100%;
  max-height: 224px;
  z-index: 40;
  list-style: none;
  overflow-y: auto;
}

body.cl-dashboard-redesign-page #cl-marketing-page .marketing-seo-menu-custom-select .cl-redesign-select-menu li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  font-size: 13px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .marketing-seo-menu-custom-select .marketing-seo-menu-item-text {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page #cl-marketing-page .marketing-seo-menu-custom-select .marketing-seo-menu-custom-badge {
  flex: none;
  height: 18px;
  padding: 0 6px;
  border-radius: 9px;
  background: #e4f7ec;
  color: var(--cl-green-text);
  font-size: 11px;
  font-weight: 700;
  line-height: 18px;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page #cl-marketing-page .marketing-seo-menu-custom-select .marketing-seo-menu-custom-badge.is-trigger {
  margin-left: 6px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-basic-main {
  flex: 1 1 auto;
  width: 100%;
  min-width: 0;
  max-width: none;
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-field {
  display: block;
  margin: 0 0 20px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-field > label,
body.cl-dashboard-redesign-page #cl-marketing-page .seo-field > span {
  display: block;
  margin-bottom: 8px;
  color: var(--mkt-text);
  font-size: 13px;
  font-weight: 700;
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-field > label[for="marketing-seo-target-keyword"] {
  display: flex;
  align-items: center;
  gap: 6px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-field .lb .mcpn-cst,
body.cl-dashboard-redesign-page #cl-marketing-page .seo-field .plan-veil {
  display: none;
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-field.plan-lock .lb .mcpn-cst {
  display: inline-block;
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-field.plan-lock {
  position: relative;
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-field.plan-lock .plan-veil {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: block;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 8px;
  background: transparent;
  cursor: pointer;
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-field.plan-lock .plan-veil:focus-visible {
  outline: 2px solid var(--cl-green);
  outline-offset: 2px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-field.plan-lock > .lb {
  color: var(--text-muted);
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-field .lb .mcpn-cst {
  margin-left: 6px;
  vertical-align: middle;
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-field .mcpn-cst {
  padding: 1px 7px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
  line-height: 16px;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-field .mcpn-cst.planreq {
  background: #eef0f3;
  color: var(--text-secondary, #8a8f98);
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-input,
body.cl-dashboard-redesign-page #cl-marketing-page .seo-area,
body.cl-dashboard-redesign-page #cl-marketing-page .marketing-robots-text,
body.cl-dashboard-redesign-page #cl-marketing-page .msetting-edit-input {
  width: 100%;
  border: 1px solid #d8dde5;
  border-radius: 8px;
  background: #fff;
  color: var(--mkt-text);
  font-size: 14px;
  box-sizing: border-box;
  outline: none;
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-input,
body.cl-dashboard-redesign-page #cl-marketing-page .msetting-edit-input {
  height: 40px;
  padding: 0 13px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-area {
  min-height: 76px;
  padding: 11px 13px;
  resize: vertical;
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-field.plan-lock .seo-input:disabled,
body.cl-dashboard-redesign-page #cl-marketing-page .seo-field.plan-lock .seo-area:disabled {
  border-color: #eef0f3;
  background: #fafbfc;
  color: var(--text-secondary, #8a8f98);
  cursor: not-allowed;
  opacity: var(--disabled-opacity);
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-field.plan-lock .marketing-seo-title-validation-item {
  opacity: var(--disabled-opacity);
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-input.error,
body.cl-dashboard-redesign-page #cl-marketing-page .seo-area.error {
  border-color: var(--danger, #ee445f);
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-field em {
  display: block;
  margin-top: 8px;
  color: var(--mkt-muted);
  font-size: 12px;
  font-style: normal;
  text-align: right;
}

body.cl-dashboard-redesign-page #cl-marketing-page .marketing-seo-goal-required-message,
body.cl-dashboard-redesign-page #cl-marketing-page .marketing-seo-goal-format-message {
  display: none;
  width: 100%;
  min-height: 17px;
  margin: 5px 0 0;
  color: #ee445f;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.42;
  text-align: left;
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-valid {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 8px 0 0;
  padding: 0;
  list-style: none;
  color: var(--mkt-muted);
  font-size: 12px;
  font-weight: 500;
  line-height: 18px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-valid + .seo-valid {
  margin-top: 2px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-valid span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin: 0;
  color: inherit;
  font: inherit;
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-valid .chk {
  color: var(--mkt-muted);
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-valid .chk svg {
  width: 13px;
  height: 13px;
  flex: 0 0 13px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-valid .chk.is-valid {
  color: var(--cl-green-text);
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-valid .chk.is-valid svg {
  color: var(--cl-green);
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-valid .chk.is-invalid {
  color: var(--danger, #ee445f);
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-valid .chk.is-invalid svg {
  stroke: var(--danger, #ee445f);
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-valid .marketing-seo-title-count,
body.cl-dashboard-redesign-page #cl-marketing-page .seo-valid .marketing-seo-description-count {
  margin-left: auto;
  color: #B4B8BF;
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-valid li {
  color: var(--mkt-muted);
  font-size: 12px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-valid li.is-valid {
  color: var(--cl-green-text);
  font-weight: 700;
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-save {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  margin-top: 6px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-cc-actions {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 18px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .marketing-seo-save:disabled,
body.cl-dashboard-redesign-page #cl-marketing-page .marketing-seo-save.is-disabled,
body.cl-dashboard-redesign-page #cl-marketing-page .marketing-seo-save[aria-disabled="true"],
body.cl-dashboard-redesign-page #cl-marketing-page .marketing-common-code-save:disabled {
  border-color: #cfd5dd;
  background: #eef1f4;
  color: #9aa2ad !important;
  cursor: default;
}

body.cl-dashboard-redesign-page #cl-marketing-page .marketing-seo-save:disabled,
body.cl-dashboard-redesign-page #cl-marketing-page .marketing-seo-save.is-disabled,
body.cl-dashboard-redesign-page #cl-marketing-page .marketing-seo-save[aria-disabled="true"] {
  border-color: transparent;
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-basic-preview {
  width: 100%;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-etc {
  display: flex;
  gap: 26px;
  margin-top: 30px;
  padding-top: 24px;
  border-top: 1px solid #f0f1f4;
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-etc-body {
  flex: 1 1 auto;
  min-width: 0;
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-etc-title {
  margin-bottom: 8px;
  color: var(--mkt-text);
  font-size: 13px;
  font-weight: 700;
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-thumb {
  width: 280px;
  border: 1px solid var(--mkt-border);
  border-radius: 10px;
  background: #fff;
  overflow: hidden;
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-thumb-img {
  position: relative;
  height: 150px;
  background: #edeff2;
  color: #c4c9d0;
}

body.cl-dashboard-redesign-page #cl-marketing-page .marketing-seo-representative-image-preview {
  width: 100%;
  height: 100%;
  border: 0;
  border-radius: 0;
  aspect-ratio: auto;
  background-color: transparent;
  background-position: center;
  background-size: cover;
}

body.cl-dashboard-redesign-page #cl-marketing-page .marketing-seo-representative-image-preview.empty::before {
  content: "";
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  margin: 0;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='16' rx='2'/%3E%3Ccircle cx='9' cy='10' r='2'/%3E%3Cpath d='M21 16l-5-5-9 9'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='16' rx='2'/%3E%3Ccircle cx='9' cy='10' r='2'/%3E%3Cpath d='M21 16l-5-5-9 9'/%3E%3C/svg%3E") center / contain no-repeat;
}

body.cl-dashboard-redesign-page #cl-marketing-page .marketing-seo-representative-image-preview.empty {
  display: flex;
  align-items: center;
  justify-content: center;
}

body.cl-dashboard-redesign-page #cl-marketing-page .marketing-seo-representative-image-upload {
  position: absolute;
  top: 12px;
  right: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: auto;
  min-width: 0;
  height: 36px;
  margin: 0;
  padding: 0 13px;
  border: 1px solid var(--mkt-border);
  border-radius: 8px;
  background: #fff;
  color: #aeb7c3;
  font-size: 12.5px;
  font-weight: 600;
}

body.cl-dashboard-redesign-page #cl-marketing-page .marketing-seo-representative-image-upload svg {
  width: 13px;
  height: 13px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-thumb-meta {
  padding: 14px 16px;
  border-top: 1px solid var(--mkt-border);
  background: #fff;
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-thumb-meta .t {
  overflow: hidden;
  color: var(--mkt-text);
  font-size: 13.5px;
  font-weight: 700;
  line-height: 19px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-thumb-meta .d {
  overflow: hidden;
  margin-top: 3px;
  color: var(--mkt-muted);
  font-size: 12.5px;
  line-height: 18px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-preview-title {
  margin: 20px 0 8px;
  color: var(--mkt-text);
  font-size: 13px;
  font-weight: 700;
  line-height: 18px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-preview {
  width: 100%;
  margin-top: 0;
  padding: 14px;
  border: 1px solid var(--mkt-border);
  border-radius: 10px;
  background: #fff;
  max-width: 400px;
  box-sizing: border-box;
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-preview span {
  display: block;
  color: #69717d;
  font-size: 12px;
  line-height: 1.45;
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-preview .pt {
  display: block;
  margin: 6px 0;
  font-size: 15px;
  color: #1a4bd6;
  font-weight: 500;
  line-height: 1.45;
}

body.cl-dashboard-redesign-page #cl-marketing-page .seo-preview .pd {
  display: block;
  margin-top: 6px;
  color: var(--text-secondary, #8A8F98);
  font-size: 12.5px;
  line-height: 1.45;
}

body.cl-dashboard-redesign-page #cl-marketing-page .adv-tabs,
body.cl-dashboard-redesign-page #cl-marketing-page .marketing-common-code-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 14px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .adv-tabs button,
body.cl-dashboard-redesign-page #cl-marketing-page .marketing-common-code-tab {
  flex: 0 0 auto;
  white-space: nowrap;
  word-break: keep-all;
  height: 36px;
  padding: 0 14px;
  border: 1px solid #d8dde5;
  border-radius: 8px;
  background: #fff;
  color: #5f6672;
  font-size: 13px;
  font-weight: 700;
}

body.cl-dashboard-redesign-page #cl-marketing-page .adv-tabs button.active,
body.cl-dashboard-redesign-page #cl-marketing-page .marketing-common-code-tab.active {
  border-color: var(--mkt-green);
  background: #eaf9f0;
  color: var(--cl-green-text);
}

body.cl-dashboard-redesign-page #cl-marketing-page .adv-pane {
  display: none;
}

body.cl-dashboard-redesign-page #cl-marketing-page .adv-pane.active {
  display: block;
}

body.cl-dashboard-redesign-page #cl-marketing-page .marketing-robots-text {
  min-height: 220px;
  padding: 14px;
  font-family: Consolas, Menlo, monospace;
  font-size: 13px;
  line-height: 1.5;
  resize: vertical;
}

body.cl-dashboard-redesign-page #cl-marketing-page .adv-desc {
  margin: 0 0 18px;
  color: #8a8f98;
  font-size: 12.5px;
  line-height: 2;
}

body.cl-dashboard-redesign-page #cl-marketing-page .adv-desc b {
  color: var(--cl-green-text);
  font-weight: 700;
}

body.cl-dashboard-redesign-page #cl-marketing-page .adv-desc span {
  color: #8a8f98;
}

body.cl-dashboard-redesign-page #cl-marketing-page .marketing-robots-tab {
  gap: 26px;
  margin: 0 0 22px;
  border-bottom: 1px solid #dfe3e8;
}

body.cl-dashboard-redesign-page #cl-marketing-page .marketing-robots-tab .adv-tab {
  height: auto;
  margin: 0 0 -1px;
  padding: 12px 2px;
  border: 0;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  background: transparent;
  color: #a4a9b2;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.35;
  cursor: pointer;
}

body.cl-dashboard-redesign-page #cl-marketing-page .marketing-robots-tab .adv-tab.active {
  border-color: var(--mkt-green);
  background: transparent;
  color: var(--cl-green-text);
  font-weight: 700;
}

@media (max-width: 767px) {
  body.cl-dashboard-redesign-page #cl-marketing-page .marketing-robots-tab {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
  }

  body.cl-dashboard-redesign-page #cl-marketing-page .marketing-robots-tab .adv-tab {
    min-width: 0;
    min-height: 44px;
    padding: 12px 0;
  }
}

body.cl-dashboard-redesign-page #cl-marketing-page .marketing-robots-source {
  display: none;
}

body.cl-dashboard-redesign-page #cl-marketing-page .rb-table-scroll {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  overflow-x: auto;
}

body.cl-dashboard-redesign-page #cl-marketing-page .rb-table-scroll:focus-visible {
  outline: 2px solid var(--mkt-green);
  outline-offset: 2px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .rb-table {
  width: 100%;
  min-width: 640px;
  table-layout: fixed;
  overflow: hidden;
  border: 1px solid #dfe3e8;
  border-radius: 8px;
  border-collapse: separate;
  border-spacing: 0;
  color: var(--mkt-text);
  font-size: 13px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .rb-table th {
  padding: 11px 12px;
  border-bottom: 1px solid #dfe3e8;
  background: #f7f8fa;
  color: #8a8f98;
  font-size: 12.5px;
  font-weight: 600;
  text-align: left;
}

body.cl-dashboard-redesign-page #cl-marketing-page .rb-table td {
  padding: 8px 10px;
  border-bottom: 1px solid #eef0f3;
  vertical-align: middle;
}

body.cl-dashboard-redesign-page #cl-marketing-page .rb-table tr:last-child td {
  border-bottom: 0;
}

body.cl-dashboard-redesign-page #cl-marketing-page .rb-table .rb-grip-head,
body.cl-dashboard-redesign-page #cl-marketing-page .rb-table .grip {
  width: 26px;
  color: #b4b8bf;
  text-align: center;
}

body.cl-dashboard-redesign-page #cl-marketing-page .rb-table .grip {
  cursor: grab;
  user-select: none;
}

body.cl-dashboard-redesign-page #cl-marketing-page .rb-table .grip:active,
body.cl-dashboard-redesign-page #cl-marketing-page .rb-table tr.is-dragging .grip {
  cursor: grabbing;
}

body.cl-dashboard-redesign-page #cl-marketing-page .rb-table tr.is-dragging {
  opacity: .72;
  background: #fff;
}

body.cl-dashboard-redesign-page #cl-marketing-page .rb-table tr.rb-sort-placeholder {
  height: 50px;
  background: #f3fcf7;
  outline: 1px dashed var(--mkt-green);
  outline-offset: -1px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .rb-table .num {
  width: 40px;
  color: #a4a9b2;
  font-family: inherit;
  font-size: 13px;
  font-weight: 400;
  line-height: 18px;
  text-align: center;
  text-shadow: none;
}

body.cl-dashboard-redesign-page #cl-marketing-page .rb-table th.num {
  font-size: 12.5px;
  font-weight: 600;
  line-height: 18px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .rb-table td.num {
  font-size: 13px;
  font-weight: 400;
  line-height: 18px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .rb-agent-col {
  width: 160px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .rb-directive-col {
  width: 150px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .rb-cell-input,
body.cl-dashboard-redesign-page #cl-marketing-page .rb-sel {
  width: 100%;
  height: 34px;
  margin: 0;
  border: 1px solid #d8dde5;
  border-radius: 6px;
  background-color: #fff;
  box-shadow: none;
  color: var(--mkt-text);
  font-size: 13px;
  box-sizing: border-box;
  outline: 0;
}

body.cl-dashboard-redesign-page #cl-marketing-page .rb-cell-input {
  padding: 8px 10px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .rb-cell-input:focus,
body.cl-dashboard-redesign-page #cl-marketing-page .rb-sel:focus {
  border-color: var(--mkt-green);
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .12);
}

body.cl-dashboard-redesign-page #cl-marketing-page select.rb-sel {
  display: block;
  min-width: 0;
  padding: 7px 30px 7px 10px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23B4B8BF' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 8px center;
  background-size: 12px 12px;
  font-family: inherit;
  font-weight: 400;
  line-height: 18px;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  cursor: pointer;
}

body.cl-dashboard-redesign-page #cl-marketing-page select.rb-sel::-ms-expand {
  display: none;
}

body.cl-dashboard-redesign-page #cl-marketing-page .rb-row-confirmed .rb-cell-input[readonly],
body.cl-dashboard-redesign-page #cl-marketing-page .rb-row-confirmed select.rb-sel:disabled {
  opacity: 1;
  background-color: #fff;
  color: var(--mkt-text);
  cursor: default;
}

body.cl-dashboard-redesign-page #cl-marketing-page .rb-val-wrap {
  display: flex;
  align-items: center;
  gap: 6px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .rb-val-wrap .rb-value {
  flex: 1 1 0;
  min-width: 0;
}

@media (max-width: 767px) {
  body.cl-dashboard-redesign-page #cl-marketing-page .rb-icon-btn {
    min-width: 44px;
    min-height: 44px;
  }
}

body.cl-dashboard-redesign-page #cl-marketing-page .rb-icon-btn {
  display: inline-flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  margin: 0;
  padding: 0;
  border: 1px solid #d8dde5;
  border-radius: 6px;
  background: #fff;
  color: #a4a9b2;
  cursor: pointer;
}

body.cl-dashboard-redesign-page #cl-marketing-page .rb-icon-btn:hover,
body.cl-dashboard-redesign-page #cl-marketing-page .rb-icon-btn:focus {
  background: #f7f8fa;
  color: var(--mkt-text);
  outline: 0;
}

body.cl-dashboard-redesign-page #cl-marketing-page .rb-icon-btn svg {
  display: block;
  width: 14px;
  height: 14px;
  fill: none;
  stroke: currentColor;
}

body.cl-dashboard-redesign-page #cl-marketing-page .rb-icon-btn.ok {
  background: #edeff2;
}

body.cl-dashboard-redesign-page #cl-marketing-page .rb-cancel-row {
  position: relative;
  overflow: hidden;
  background-image: none;
  font-size: 0;
  line-height: 0;
  text-decoration: none;
  -webkit-appearance: none;
  appearance: none;
}

body.cl-dashboard-redesign-page #cl-marketing-page .rb-cancel-row svg {
  display: none !important;
}

body.cl-dashboard-redesign-page #cl-marketing-page .rb-cancel-row::before,
body.cl-dashboard-redesign-page #cl-marketing-page .rb-cancel-row::after {
  position: absolute;
  top: 50%;
  left: 50%;
  display: block;
  width: 11px;
  height: 1.5px;
  margin: 0;
  background: currentColor;
  border: 0;
  border-radius: 999px;
  content: "";
  transform-origin: center;
}

body.cl-dashboard-redesign-page #cl-marketing-page .rb-cancel-row::before {
  transform: translate(-50%, -50%) rotate(45deg);
}

body.cl-dashboard-redesign-page #cl-marketing-page .rb-cancel-row::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}

body.cl-dashboard-redesign-page #cl-marketing-page .rb-row-confirmed .rb-cancel-row,
body.cl-dashboard-redesign-page #cl-marketing-page .rb-row-confirmed .rb-confirm-row,
body.cl-dashboard-redesign-page #cl-marketing-page .rb-row-editing .rb-edit-row,
body.cl-dashboard-redesign-page #cl-marketing-page .rb-row-editing .rb-delete-row {
  display: none;
}

body.cl-dashboard-redesign-page #cl-marketing-page .adv-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 12px 0 24px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .adv-toolbar-top {
  justify-content: flex-start;
  margin: 0 0 18px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .adv-toolbar-left {
  display: flex;
  gap: 8px;
  min-width: 0;
}

body.cl-dashboard-redesign-page #cl-marketing-page .adv-tbtn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 36px;
  margin: 0;
  padding: 8px 14px;
  border: 1px solid var(--border, #d8dde5);
  border-radius: 8px;
  background: #fff;
  color: var(--text-secondary, #8A8F98);
  font-size: 13px;
  font-weight: 600;
  line-height: 18px;
  cursor: pointer;
}

body.cl-dashboard-redesign-page #cl-marketing-page .adv-tbtn:hover,
body.cl-dashboard-redesign-page #cl-marketing-page .adv-tbtn:focus {
  background: #fafbfc;
  border-color: #cfd5dd;
  outline: 0;
}

body.cl-dashboard-redesign-page #cl-marketing-page .adv-tbtn:disabled {
  cursor: default;
  opacity: .55;
}

body.cl-dashboard-redesign-page #cl-marketing-page .adv-tbtn svg {
  width: 14px;
  height: 14px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .adv-pv-label {
  margin: 0 0 10px;
  color: var(--mkt-text);
  font-size: 13.5px;
  font-weight: 700;
}

body.cl-dashboard-redesign-page #cl-marketing-page .adv-pv {
  width: 100%;
  min-height: 220px;
  margin: 0;
  padding: 16px 18px;
  border: 1px solid #d8dde5;
  border-radius: 10px;
  background: #fff;
  box-shadow: none;
  color: var(--mkt-text);
  font-family: var(--cl-source-font);
  font-size: 13px;
  line-height: 1.9;
  outline: 0;
  resize: vertical;
  white-space: pre-wrap;
  box-sizing: border-box;
}

body.cl-dashboard-redesign-page #cl-marketing-page .adv-save {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  margin-top: 18px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .marketing-robots-status {
  display: inline-block;
  margin-top: 8px;
  color: #8a8f98;
  font-size: 12px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-reg-list {
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid var(--mkt-border);
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-reg {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  align-items: center;
  min-height: 62px;
  border-bottom: 1px solid var(--mkt-border);
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-reg-name {
  color: var(--mkt-text);
  font-size: 14px;
  font-weight: 700;
}

body.cl-dashboard-redesign-page #cl-marketing-page .msetting-info {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  min-width: 0;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-reg-code {
  min-width: 0;
  max-width: 520px;
  overflow: hidden;
  color: #5f6672;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-icon-btn {
  position: relative;
  width: 34px;
  height: 34px;
  min-width: 34px;
  border: 1px solid #d8dde5;
  border-radius: 8px;
  background: #fff;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-icon-btn::before,
body.cl-dashboard-redesign-page #cl-marketing-page .mkt-icon-btn::after {
  content: "";
  position: absolute;
  left: 10px;
  right: 10px;
  top: 16px;
  height: 1px;
  background: #7c8490;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-icon-btn::before {
  transform: rotate(45deg);
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-icon-btn::after {
  transform: rotate(-45deg);
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-cc textarea {
  min-height: 240px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .CodeMirror {
  height: 260px;
  border: 1px solid #d8dde5;
  border-radius: 8px;
  font-size: 13px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .CodeMirror-gutters {
  border-right: 1px solid #eef0f4;
  background: #fafbfc;
}

body.cl-dashboard-redesign-page #cl-marketing-page .CodeMirror-linenumber {
  color: #aeb7c3;
  font-size: 12px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .cl-source-marketing-guide {
  display: block;
  flex: 0 0 343px;
  width: 343px;
  max-width: 343px;
  min-width: 0;
  align-self: flex-start;
  position: sticky;
  top: 84px;
  padding: 20px 20px 22px;
  border: 1px solid var(--cl-border);
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 1px 2px rgba(16, 24, 40, .04);
}

/* 마케팅 설정 영상 제작 완료 후 이 숨김 규칙을 제거하면 다시 노출됩니다. */
body.cl-dashboard-redesign-page #cl-marketing-page .cl-source-marketing-guide {
  display: none !important;
}

body.cl-dashboard-redesign-page #cl-marketing-page .dg-head {
  margin: 0 0 14px;
  font-size: 15px;
  font-weight: 700;
  color: var(--cl-text-primary);
}

body.cl-dashboard-redesign-page #cl-marketing-page .dg-video {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  aspect-ratio: 16 / 9;
  padding: 0;
  border: 0;
  border-radius: 10px;
  background: linear-gradient(135deg, #03C75A 0%, #00C4CB 52%, #2E8BF0 100%);
  overflow: hidden;
  cursor: default;
}

body.cl-dashboard-redesign-page #cl-marketing-page .dg-chip {
  position: absolute;
  left: 8px;
  top: 8px;
  padding: 2px 7px;
  border-radius: 4px;
  background: rgba(20,24,32,.55);
  color: #fff;
  font-size: 10px;
  font-weight: 600;
}

body.cl-dashboard-redesign-page #cl-marketing-page .dg-thumb-center {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 11px;
  padding: 0 16px;
  text-align: center;
}

body.cl-dashboard-redesign-page #cl-marketing-page .dg-thumb-name {
  color: #fff;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.35;
}

body.cl-dashboard-redesign-page #cl-marketing-page .dg-play {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 54px;
  height: 54px;
  border-radius: 50%;
  background: #fff;
}

body.cl-dashboard-redesign-page #cl-marketing-page .dg-play svg {
  width: 20px;
  height: 20px;
  fill: var(--mkt-green);
  margin-left: 3px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .dg-desc {
  margin: 0 0 12px;
  color: var(--cl-text-sub);
  font-size: 12.5px;
  line-height: 1.6;
}

body.cl-dashboard-redesign-page #cl-marketing-page .dg-clabel {
  margin-bottom: 4px;
  color: var(--cl-text-muted);
  font-size: 11.5px;
  font-weight: 600;
}

body.cl-dashboard-redesign-page #cl-marketing-page .cl-source-marketing-guide h4 {
  margin: 14px 0 5px;
  color: var(--mkt-text);
  font-size: 14px;
  font-weight: 600;
}

body.cl-dashboard-redesign-page #cl-marketing-page .cl-source-marketing-guide ol {
  margin: 0;
  padding: 0;
  list-style: none;
}

body.cl-dashboard-redesign-page #cl-marketing-page .cl-source-marketing-guide li {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 8px;
  color: var(--mkt-text);
  font-size: 12.5px;
  font-weight: 400;
}

body.cl-dashboard-redesign-page #cl-marketing-page .cl-source-marketing-guide .ch-num {
  display: inline-grid;
  place-items: center;
  width: 18px;
  height: 18px;
  flex: none;
  border-radius: 50%;
  background: #e1f7ea;
  color: var(--cl-green-text);
  font-size: 11px;
}

@container cl-marketing-content (max-width: 1200px) {
  body.cl-dashboard-redesign-page #cl-marketing-page .cl-source-marketing-layout {
    flex-direction: column;
  }

  body.cl-dashboard-redesign-page #cl-marketing-page .cl-source-marketing-panel,
  body.cl-dashboard-redesign-page #cl-marketing-page .cl-source-marketing-guide {
    width: 100%;
    max-width: none;
    flex-basis: auto;
  }

  body.cl-dashboard-redesign-page #cl-marketing-page .cl-source-marketing-guide {
    position: static;
  }
}

@container cl-marketing-content (max-width: 900px) {
  body.cl-dashboard-redesign-page #cl-marketing-page .mkt-guide,
  body.cl-dashboard-redesign-page #cl-marketing-page .mkt-sec {
    padding: 24px;
  }

  body.cl-dashboard-redesign-page #cl-marketing-page .seo-basic {
    grid-template-columns: 1fr;
  }

  body.cl-dashboard-redesign-page #cl-marketing-page .mkt-reg {
    grid-template-columns: 1fr;
    gap: 8px;
    padding: 14px 0;
  }

  body.cl-dashboard-redesign-page #cl-marketing-page .msetting-info {
    justify-content: flex-start;
  }

  body.cl-dashboard-redesign-page #cl-marketing-page .mkt-reg.is-editing {
    grid-template-rows: auto;
    row-gap: 8px;
  }

  body.cl-dashboard-redesign-page #cl-marketing-page .mkt-reg.is-editing .mkt-reg-name,
  body.cl-dashboard-redesign-page #cl-marketing-page .mkt-reg.is-editing .mkt-reg-detail,
  body.cl-dashboard-redesign-page #cl-marketing-page .mkt-reg.is-editing > .msetting-edit-box {
    grid-column: 1;
    grid-row: auto;
  }
}

/* Marketing source list alignment */
body.cl-dashboard-redesign-page #cl-marketing-page .mkt-guide {
  display: block;
  margin: 26px 28px 18px;
  padding: 20px 26px 22px;
  border: 0;
  border-radius: 10px;
  background: #eefaf3;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-guide-title {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-guide-check {
  position: relative;
  display: inline-grid;
  place-items: center;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: var(--mkt-green);
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-guide-check::after {
  content: "";
  width: 7px;
  height: 4px;
  border-left: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(-45deg) translate(1px, -1px);
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-guide strong {
  font-size: 14.5px;
  font-weight: 700;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-guide ol {
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: mkt-guide;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-guide li {
  counter-increment: mkt-guide;
  color: #8a8f98;
  font-size: 13px;
  line-height: 1.9;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-guide li::before {
  content: counter(mkt-guide) ".";
  margin-right: 4px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-guide b {
  color: var(--cl-green-text);
  font-weight: 700;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-sec {
  display: grid;
  grid-template-columns: 228px minmax(0, 1fr);
  align-items: start;
  gap: 0;
  margin: 0 28px;
  padding: 18px 0 0;
  border-bottom: 1px solid #eef0f4;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-sec-head {
  display: block;
  align-self: start;
  margin: 0;
  padding: 0;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-reg-sec .mkt-sec-head {
  padding-top: 14px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-sec h2 {
  font-size: 16px;
  font-weight: 700;
  line-height: 22px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-sec-head p {
  display: none;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-sec-body {
  min-width: 0;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-row {
  display: grid;
  grid-template-columns: minmax(170px, 1fr) minmax(320px, 560px);
  gap: 24px;
  align-items: start;
  min-height: 0;
  padding: 0 0 16px;
  border-top: 0;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-row-label {
  min-width: 0;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-row-label strong {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13.5px;
  font-weight: 600;
  line-height: 24px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-row-label span {
  display: none;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-help-dot {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 14px;
  height: 14px;
  min-width: 14px;
  padding: 0;
  border: 1px solid #03C75A;
  border-radius: 50%;
  background: transparent;
  color: #03C75A;
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-help-dot::before {
  content: "?";
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-row-ctrl {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 38px;
  gap: 12px 18px;
  align-items: start;
  justify-content: stretch;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-row-ctrl .mkt-tog {
  display: contents;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-sec-head > .mkt-tog {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  margin-top: 12px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-state,
body.cl-dashboard-redesign-page #cl-marketing-page .mkt-reg-code {
  color: #b4b8bf;
  font-size: 13px;
  font-weight: 400;
  line-height: 22px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-state {
  font-size: 13.5px;
}

body.cl-dashboard-redesign-page #cl-marketing-page #search-exposure-setting .mkt-row-ctrl.has-search-exposure-upgrade {
  grid-template-columns: minmax(0, 1fr) max-content;
}

body.cl-dashboard-redesign-page #cl-marketing-page #search-exposure-setting .search-exposure-upgrade {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-self: end;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--cl-green-text);
  font-size: 13px;
  font-weight: 400;
  line-height: 20px;
  white-space: nowrap;
  cursor: pointer;
}

body.cl-dashboard-redesign-page #cl-marketing-page #search-exposure-setting .search-exposure-upgrade:focus-visible {
  outline: 2px solid var(--cl-green);
  outline-offset: 2px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .set-switch.simple-switch {
  position: relative;
  display: inline-block;
  width: 36px;
  height: 20px;
  min-width: 36px;
  margin: 0;
  border-radius: 999px;
  background: #d5d9e0;
  cursor: pointer;
  transition: background .18s ease;
}

body.cl-dashboard-redesign-page #cl-marketing-page .set-switch.simple-switch input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

body.cl-dashboard-redesign-page #cl-marketing-page .set-switch.simple-switch > span {
  position: absolute;
  left: 3px;
  top: 3px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .2);
  transition: transform .18s ease;
}

body.cl-dashboard-redesign-page #cl-marketing-page .set-switch.simple-switch.active,
body.cl-dashboard-redesign-page #cl-marketing-page .set-switch.simple-switch:has(input:checked) {
  background: var(--mkt-green);
}

body.cl-dashboard-redesign-page #cl-marketing-page .set-switch.simple-switch.active > span,
body.cl-dashboard-redesign-page #cl-marketing-page .set-switch.simple-switch:has(input:checked) > span {
  transform: translateX(16px);
}

body.cl-dashboard-redesign-page #cl-marketing-page .search-exposure-default-domain {
  grid-column: 1 / -1;
  display: flex;
  flex-direction: row-reverse;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  margin-top: 8px;
  color: #8a8f98;
  font-size: 13px;
  line-height: 22px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .search-exposure-default-domain input {
  width: 18px;
  height: 18px;
  flex: none;
}

body.cl-dashboard-redesign-page #cl-marketing-page #search-exposure-setting .set-switch.simple-switch {
  justify-self: end;
}

body.cl-dashboard-redesign-page #cl-marketing-page #search-exposure-setting {
  padding-bottom: 30px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .marketing-seo-accordion {
  grid-column: 1 / -1;
  display: block;
  margin: 14px 0 0;
  padding: 0;
  list-style: none;
}

.cl-dashboard-redesign#cl-marketing-page .marketing-seo-lock-region {
  position: relative;
  min-width: 0;
}

.cl-dashboard-redesign#cl-marketing-page .marketing-seo-common-code {
  border-top: 1px solid var(--cl-line);
}

.cl-dashboard-redesign#cl-marketing-page .marketing-seo-accordion.marketing-common-code-list {
  margin-top: 0;
}

.cl-dashboard-redesign#cl-marketing-page .marketing-seo-lock-trigger,
.cl-dashboard-redesign#cl-marketing-page .marketing-plan-upgrade-trigger {
  display: none;
  position: absolute;
  inset: 0;
  z-index: 5;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: var(--r-lg, 10px);
  background: transparent;
  cursor: pointer;
}

.cl-dashboard-redesign#cl-marketing-page .is-seo-locked > .marketing-seo-lock-content {
  opacity: var(--disabled-opacity, .45);
}

.cl-dashboard-redesign#cl-marketing-page .is-seo-locked > .marketing-seo-lock-trigger {
  display: block;
}

.cl-dashboard-redesign#cl-marketing-page .marketing-seo-lock-trigger:focus-visible,
.cl-dashboard-redesign#cl-marketing-page .marketing-plan-upgrade-trigger:focus-visible {
  outline: 2px solid var(--cl-green);
  outline-offset: 2px;
}

.cl-dashboard-redesign#cl-marketing-page .is-plan-locked,
.cl-dashboard-redesign#cl-marketing-page .is-free-plan #marketing-seo-basic {
  position: relative;
}

.cl-dashboard-redesign#cl-marketing-page .is-free-plan.is-seo-locked > .marketing-seo-lock-content {
  opacity: 1;
}

.cl-dashboard-redesign#cl-marketing-page .is-plan-locked > .marketing-advanced-settings-controls,
.cl-dashboard-redesign#cl-marketing-page .is-plan-locked > .mkt-row,
.cl-dashboard-redesign#cl-marketing-page .is-plan-locked > .marketing-seo-menu-custom-select,
.cl-dashboard-redesign#cl-marketing-page .is-free-plan.is-seo-locked #marketing-seo-basic > .mkt-accord-head,
.cl-dashboard-redesign#cl-marketing-page .is-free-plan.is-seo-locked #marketing-seo-basic-panel {
  opacity: var(--disabled-opacity, .45);
}

.cl-dashboard-redesign#cl-marketing-page .is-plan-locked > .marketing-common-code-panel {
  display: none;
}

.cl-dashboard-redesign#cl-marketing-page .is-free-plan.is-seo-locked #marketing-seo-basic > .marketing-seo-lock-trigger,
.cl-dashboard-redesign#cl-marketing-page .is-plan-locked > .marketing-plan-upgrade-trigger {
  display: block;
}

body.cl-dashboard-redesign-page #cl-marketing-page #marketing-seo-basic {
  scroll-margin-top: calc(var(--topbar-h, 56px) + 20px);
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-reg-list {
  margin: 0;
  padding: 0;
  border-top: 0;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-reg {
  display: grid;
  grid-template-columns: minmax(170px, 1fr) minmax(320px, 560px);
  align-items: center;
  gap: 24px;
  min-height: 0;
  padding: 16px 0;
  border-bottom: 1px solid #eef0f4;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-reg:last-child {
  border-bottom: 0;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-reg-name {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  min-height: 30px;
  color: #222428;
  font-size: 14px;
  font-weight: 600;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-reg-name > span:not(.mkt-reg-ico) {
  display: inline-block;
  overflow: visible;
  color: #222428;
  text-overflow: clip;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-reg-ico {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  min-width: 20px;
  flex: 0 0 20px;
  background: transparent;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-reg-ico img {
  display: block;
  width: 20px;
  height: 20px;
  object-fit: contain;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-reg-name::before {
  content: none !important;
  display: none !important;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-reg-detail {
  min-width: 0;
}

body.cl-dashboard-redesign-page #cl-marketing-page #webmaster-setting > .mkt-reg:not([data-type="sitemap"]):not([data-type="rss"]),
body.cl-dashboard-redesign-page #cl-marketing-page #analytics-setting > .mkt-reg {
  grid-template-columns: minmax(170px, 1fr) minmax(0, 506px) 36px;
  grid-template-rows: 30px;
  column-gap: 18px;
  row-gap: 12px;
}

body.cl-dashboard-redesign-page #cl-marketing-page #webmaster-setting > .mkt-reg:not([data-type="sitemap"]):not([data-type="rss"]) .mkt-reg-detail,
body.cl-dashboard-redesign-page #cl-marketing-page #analytics-setting > .mkt-reg .mkt-reg-detail {
  display: contents;
  align-self: center;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-reg.is-editing {
  grid-template-rows: 30px auto;
  align-items: center;
  row-gap: 12px;
  padding: 16px 0 20px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-reg.is-editing .mkt-reg-name {
  grid-column: 1;
  grid-row: 1;
  align-self: center;
  padding-top: 0;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-reg.is-editing .mkt-reg-detail {
  grid-column: 2;
  grid-row: 1;
  align-self: center;
}

body.cl-dashboard-redesign-page #cl-marketing-page .msetting-info {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 36px;
  gap: 18px;
  align-items: center;
  justify-content: stretch;
  min-width: 0;
}

body.cl-dashboard-redesign-page #cl-marketing-page #webmaster-setting > .mkt-reg:not([data-type="sitemap"]):not([data-type="rss"]) .msetting-info,
body.cl-dashboard-redesign-page #cl-marketing-page #analytics-setting > .mkt-reg .msetting-info {
  display: contents;
  align-self: start;
  height: 30px;
  min-height: 30px;
}

body.cl-dashboard-redesign-page #cl-marketing-page #webmaster-setting > .mkt-reg:not([data-type="sitemap"]):not([data-type="rss"]) .mkt-reg-name,
body.cl-dashboard-redesign-page #cl-marketing-page #analytics-setting > .mkt-reg .mkt-reg-name {
  grid-column: 1;
  grid-row: 1;
  align-self: center;
}

body.cl-dashboard-redesign-page #cl-marketing-page #webmaster-setting > .mkt-reg:not([data-type="sitemap"]):not([data-type="rss"]) .mkt-reg-code,
body.cl-dashboard-redesign-page #cl-marketing-page #analytics-setting > .mkt-reg .mkt-reg-code {
  grid-column: 2;
  grid-row: 1;
  align-self: center;
}

body.cl-dashboard-redesign-page #cl-marketing-page #webmaster-setting > .mkt-reg:not([data-type="sitemap"]):not([data-type="rss"]) .mkt-row-switch,
body.cl-dashboard-redesign-page #cl-marketing-page #analytics-setting > .mkt-reg .mkt-row-switch {
  grid-column: 3;
  grid-row: 1;
  align-self: center;
  justify-self: end;
}

@container cl-marketing-content (max-width: 900px) {
  body.cl-dashboard-redesign-page #cl-marketing-page #webmaster-setting > .mkt-reg:not([data-type="sitemap"]):not([data-type="rss"]),
  body.cl-dashboard-redesign-page #cl-marketing-page #analytics-setting > .mkt-reg {
    grid-template-columns: minmax(0, 1fr) 36px;
    grid-template-rows: auto auto;
    column-gap: 12px;
    row-gap: 8px;
  }

  body.cl-dashboard-redesign-page #cl-marketing-page #webmaster-setting > .mkt-reg:not([data-type="sitemap"]):not([data-type="rss"]) .mkt-reg-name,
  body.cl-dashboard-redesign-page #cl-marketing-page #analytics-setting > .mkt-reg .mkt-reg-name {
    grid-column: 1 / 3;
    grid-row: 1;
  }

  body.cl-dashboard-redesign-page #cl-marketing-page #webmaster-setting > .mkt-reg:not([data-type="sitemap"]):not([data-type="rss"]) .mkt-reg-code,
  body.cl-dashboard-redesign-page #cl-marketing-page #analytics-setting > .mkt-reg .mkt-reg-code {
    grid-column: 1;
    grid-row: 2;
  }

  body.cl-dashboard-redesign-page #cl-marketing-page #webmaster-setting > .mkt-reg:not([data-type="sitemap"]):not([data-type="rss"]) .mkt-row-switch,
  body.cl-dashboard-redesign-page #cl-marketing-page #analytics-setting > .mkt-reg .mkt-row-switch {
    grid-column: 2;
    grid-row: 2;
  }

  body.cl-dashboard-redesign-page #cl-marketing-page .mkt-reg.is-editing > .msetting-edit-box {
    grid-column: 1 / 3;
    grid-row: 3;
  }
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-reg-code {
  display: block;
  align-self: center;
  max-width: none;
  overflow: hidden;
  min-width: 0;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page #cl-marketing-page .msetting-edit-box {
  position: static;
  top: auto;
  left: auto;
  grid-column: 2 / 4;
  grid-row: 2;
  align-self: start;
  display: flex;
  flex-direction: column;
  gap: 7px;
  width: 100%;
  max-width: none;
  margin-top: 0;
  box-sizing: border-box;
  transform: none !important;
}

body.cl-dashboard-redesign-page #cl-marketing-page .msetting-edit-box .mre-pre {
  color: var(--mkt-muted);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 12.5px;
  font-weight: 400;
  line-height: 1.5;
  word-break: break-all;
}

body.cl-dashboard-redesign-page #cl-marketing-page .msetting-edit-box .mre-row {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  max-width: none;
}

body.cl-dashboard-redesign-page #cl-marketing-page .msetting-edit-field {
  position: relative;
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  min-width: 0;
  height: auto;
  background: transparent;
  border: 0;
  border-radius: 0;
  overflow: visible;
}

body.cl-dashboard-redesign-page #cl-marketing-page .msetting-edit-input {
  display: block;
  width: 100%;
  height: 40px;
  min-width: 0;
  margin: 0;
  padding: 10px 34px 10px 12px;
  background: #fff;
  border: 1px solid var(--mkt-green);
  border-radius: 8px;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .12);
  color: var(--mkt-text);
  font-family: inherit;
  font-size: 13.5px;
  font-weight: 400;
  line-height: 18px;
  outline: 0;
}

body.cl-dashboard-redesign-page #cl-marketing-page .msetting-edit-input::placeholder {
  color: var(--mkt-muted);
}

body.cl-dashboard-redesign-page #cl-marketing-page .msetting-edit-input:focus {
  border-color: var(--mkt-green);
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .12);
}

body.cl-dashboard-redesign-page #cl-marketing-page .msetting-edit-save,
body.cl-dashboard-redesign-page #cl-marketing-page .msetting-edit-cancel {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  padding: 0;
  box-shadow: none;
  cursor: pointer;
}

body.cl-dashboard-redesign-page #cl-marketing-page .msetting-edit-save {
  flex: none;
  width: 40px;
  height: 40px;
  border: 1px solid var(--mkt-green);
  border-radius: 8px;
  background: var(--mkt-green);
  color: #fff;
  transition: background .12s, border-color .12s;
}

body.cl-dashboard-redesign-page #cl-marketing-page .msetting-edit-save:hover,
body.cl-dashboard-redesign-page #cl-marketing-page .msetting-edit-save:focus {
  background: var(--mkt-green-hover);
  border-color: var(--mkt-green-hover);
  outline: 0;
}

body.cl-dashboard-redesign-page #cl-marketing-page .msetting-edit-cancel.mre-clear {
  position: absolute;
  top: 50%;
  right: 7px;
  width: 22px;
  height: 22px;
  border: 0;
  border-radius: 5px;
  background-image: none;
  background: transparent;
  color: var(--mkt-muted);
  font-size: 0;
  line-height: 0;
  overflow: hidden;
  text-decoration: none;
  transform: translateY(-50%);
  -webkit-appearance: none;
  appearance: none;
  transition: background .12s, color .12s;
}

body.cl-dashboard-redesign-page #cl-marketing-page .msetting-edit-cancel.mre-clear:hover,
body.cl-dashboard-redesign-page #cl-marketing-page .msetting-edit-cancel.mre-clear:focus {
  background: #f1f2f5;
  color: var(--mkt-text);
  outline: 0;
}

body.cl-dashboard-redesign-page #cl-marketing-page .msetting-edit-cancel.mre-clear::before,
body.cl-dashboard-redesign-page #cl-marketing-page .msetting-edit-cancel.mre-clear::after {
  position: absolute;
  top: 50%;
  left: 50%;
  display: block;
  width: 11px;
  height: 1.5px;
  margin: 0;
  background: currentColor;
  border: 0;
  border-radius: 999px;
  content: "";
  transform-origin: center;
}

body.cl-dashboard-redesign-page #cl-marketing-page .msetting-edit-cancel.mre-clear::before {
  transform: translate(-50%, -50%) rotate(45deg);
}

body.cl-dashboard-redesign-page #cl-marketing-page .msetting-edit-cancel.mre-clear::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}

body.cl-dashboard-redesign-page #cl-marketing-page .msetting-edit-save svg,
body.cl-dashboard-redesign-page #cl-marketing-page .msetting-edit-cancel svg {
  display: block;
  fill: none;
  stroke: currentColor;
}

body.cl-dashboard-redesign-page #cl-marketing-page .msetting-edit-cancel.mre-clear svg {
  display: none !important;
}

body.cl-dashboard-redesign-page #cl-marketing-page .msetting-edit-save svg {
  width: 16px;
  height: 16px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .msetting-edit-cancel svg {
  display: none;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mre-hint,
body.cl-dashboard-redesign-page #cl-marketing-page .mre-msg {
  max-width: none;
  color: var(--mkt-muted);
  font-size: 12px;
  font-weight: 400;
  line-height: 1.55;
  word-break: break-all;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mre-msg {
  word-break: keep-all;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mre-hint:empty,
body.cl-dashboard-redesign-page #cl-marketing-page .mre-msg:empty {
  display: none;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mre-msg.warn {
  color: #b26a00;
  font-weight: 600;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mre-msg.err {
  color: #d64545;
  font-weight: 600;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mre-field.invalid .msetting-edit-input,
body.cl-dashboard-redesign-page #cl-marketing-page .mre-field.invalid .msetting-edit-input:focus {
  border-color: #d64545;
  box-shadow: 0 0 0 3px rgba(214, 69, 69, .14);
}

body.cl-dashboard-redesign-page #cl-marketing-page .mre-field.invalid {
  animation: marketingRegShake .34s cubic-bezier(.36, .07, .19, .97);
}

@keyframes marketingRegShake {
  10%, 90% { transform: translateX(-2px); }
  20%, 80% { transform: translateX(3px); }
  30%, 50%, 70% { transform: translateX(-5px); }
  40%, 60% { transform: translateX(5px); }
}

@media (prefers-reduced-motion: reduce) {
  body.cl-dashboard-redesign-page #cl-marketing-page .mre-field.invalid {
    animation: none;
  }
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-row-switch {
  position: relative;
  display: inline-block;
  width: 36px;
  height: 20px;
  min-width: 36px;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: #d5d9e0;
  cursor: pointer;
  transition: background .18s ease;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-row-switch > span {
  position: absolute;
  left: 3px;
  top: 3px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .2);
  transition: transform .18s ease;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-row-switch.is-on {
  background: var(--mkt-green);
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-row-switch.is-on > span {
  transform: translateX(16px);
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-copy-btn {
  width: auto;
  min-width: 0;
  height: 24px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--cl-green-text);
  font-size: 13px;
  font-weight: 700;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-reg[data-type="sitemap"] .msetting-info,
body.cl-dashboard-redesign-page #cl-marketing-page .mkt-reg[data-type="rss"] .msetting-info {
  grid-template-columns: minmax(0, 1fr) auto;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-reg[data-type="sitemap"] .mkt-reg-code,
body.cl-dashboard-redesign-page #cl-marketing-page .mkt-reg[data-type="rss"] .mkt-reg-code {
  color: #8a8f98;
  font-weight: 600;
}

body.cl-dashboard-redesign-page #cl-marketing-page .marketing-common-code-panel {
  grid-column: 1 / -1;
  margin: 18px 0 28px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-common-sec {
  padding-top: 0;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-common-sec .mkt-sec-head {
  padding-top: 19px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-common-sec .mkt-row {
  grid-template-rows: 30px;
  align-items: center;
  min-height: 0;
  padding: 16px 0;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-common-sec .mkt-row-ctrl {
  align-items: center;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-common-sec .marketing-common-code-panel {
  margin: 0 0 28px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-faq {
  padding-top: 30px;
  padding-bottom: 30px;
  border-bottom: 0;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-faq .mkt-sec-head {
  padding-top: 2px;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-faq .mkt-sec-head h2 {
  font-size: 16px;
  font-weight: 700;
  line-height: 22px;
}

@media (max-width: 1180px) {
  body.cl-dashboard-redesign-page #cl-marketing-page .mkt-faq .mkt-sec-head {
    margin-bottom: 14px;
  }
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-faq .mkt-sec-body {
  max-width: none;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-faq-list {
  margin: 0;
  padding: 0;
}

body.cl-dashboard-redesign-page #cl-marketing-page .faq-item {
  border-bottom: 1px solid #eef0f3;
}

body.cl-dashboard-redesign-page #cl-marketing-page .faq-item:last-child {
  border-bottom: 0;
}

body.cl-dashboard-redesign-page #cl-marketing-page .faq-q {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  margin: 0;
  padding: 18px 2px;
  border: 0;
  background: transparent;
  color: #222428;
  font-family: inherit;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.45;
  text-align: left;
  cursor: pointer;
  transition: color .12s;
}

body.cl-dashboard-redesign-page #cl-marketing-page .mkt-faq-list > .faq-item:first-child > .faq-q {
  padding-top: 0;
}

body.cl-dashboard-redesign-page #cl-marketing-page .faq-q:hover,
body.cl-dashboard-redesign-page #cl-marketing-page .faq-q:focus {
  color: var(--cl-green-text);
  outline: 0;
}

body.cl-dashboard-redesign-page #cl-marketing-page .faq-item.open .faq-q {
  color: var(--cl-green-text);
  font-weight: 700;
}

body.cl-dashboard-redesign-page #cl-marketing-page .faq-q .fchev {
  width: 18px;
  height: 18px;
  color: #b4b8bf;
  flex: 0 0 auto;
  transition: transform .18s, color .12s;
}

body.cl-dashboard-redesign-page #cl-marketing-page .faq-q:hover .fchev,
body.cl-dashboard-redesign-page #cl-marketing-page .faq-q:focus .fchev,
body.cl-dashboard-redesign-page #cl-marketing-page .faq-item.open .faq-q .fchev {
  color: var(--mkt-green);
}

body.cl-dashboard-redesign-page #cl-marketing-page .faq-item.open .faq-q .fchev {
  transform: rotate(180deg);
}

body.cl-dashboard-redesign-page #cl-marketing-page .faq-a {
  overflow: hidden;
  max-height: 0;
  opacity: 0;
  transition: max-height .34s cubic-bezier(.4, 0, .2, 1), opacity .28s ease;
}

body.cl-dashboard-redesign-page #cl-marketing-page .faq-item.open .faq-a {
  opacity: 1;
}

body.cl-dashboard-redesign-page #cl-marketing-page .faq-a-in {
  padding: 0 2px 20px;
  color: #8a8f98;
  font-size: 13px;
  line-height: 1.9;
}

body.cl-dashboard-redesign-page #cl-marketing-page .faq-a p {
  margin: 0 0 14px;
  color: #8a8f98;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.9;
}

body.cl-dashboard-redesign-page #cl-marketing-page .faq-a p:last-child {
  margin-bottom: 0;
}

@container cl-marketing-content (max-width: 900px) {
  body.cl-dashboard-redesign-page #cl-marketing-page .cl-source-marketing-panel {
    max-width: none;
  }

  body.cl-dashboard-redesign-page #cl-marketing-page .mkt-guide {
    margin: 20px 18px 12px;
    padding: 18px;
  }

  body.cl-dashboard-redesign-page #cl-marketing-page .mkt-sec,
  body.cl-dashboard-redesign-page #cl-marketing-page .mkt-row,
  body.cl-dashboard-redesign-page #cl-marketing-page .mkt-reg {
    grid-template-columns: 1fr;
  }

  body.cl-dashboard-redesign-page #cl-marketing-page .mkt-sec {
    margin: 0 18px;
    padding: 18px 0 0;
  }

  body.cl-dashboard-redesign-page #cl-marketing-page.is-seo-detail-open #marketing-seo-geo {
    padding-bottom: 0;
  }

  body.cl-dashboard-redesign-page #cl-marketing-page .mkt-sec-head {
    padding-top: 0;
  }

  body.cl-dashboard-redesign-page #cl-marketing-page .mkt-reg-sec .mkt-sec-head {
    padding-top: 0;
  }

  body.cl-dashboard-redesign-page #cl-marketing-page .mkt-row,
  body.cl-dashboard-redesign-page #cl-marketing-page .mkt-reg {
    gap: 8px;
  }

  body.cl-dashboard-redesign-page #cl-marketing-page .seo-basic,
  body.cl-dashboard-redesign-page #cl-marketing-page .seo-etc {
    flex-direction: column;
    gap: 20px;
  }

  body.cl-dashboard-redesign-page #cl-marketing-page .seo-basic-side {
    flex: 0 0 auto;
  }

  body.cl-dashboard-redesign-page #cl-marketing-page .seo-basic-side,
  body.cl-dashboard-redesign-page #cl-marketing-page .seo-basic-main,
  body.cl-dashboard-redesign-page #cl-marketing-page .seo-etc-body,
  body.cl-dashboard-redesign-page #cl-marketing-page .seo-basic-preview,
  body.cl-dashboard-redesign-page #cl-marketing-page .seo-thumb {
    width: 100%;
  }
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-download-limit-alert-wrap {
  position: fixed !important;
  inset: 0 !important;
  z-index: 1000003 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100vw !important;
  height: 100vh !important;
  min-height: 100vh !important;
  padding: 24px !important;
  overflow: hidden !important;
  background: rgba(0, 0, 0, .45) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-download-limit-alert-wrap + .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-source-download-limit-alert-wrap + .modal-backdrop.fade,
body.cl-dashboard-redesign-page .flat-modal.cl-source-download-limit-alert-wrap + .modal-backdrop.in {
  display: none !important;
  opacity: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-download-limit-alert-wrap .modal-default,
body.cl-dashboard-redesign-page .flat-modal.cl-source-download-limit-alert-wrap .modal-default.in,
body.cl-dashboard-redesign-page .flat-modal.cl-source-download-limit-alert-wrap .modal-default.show {
  position: static !important;
  inset: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: auto !important;
  min-height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-download-limit-alert-wrap .modal-default > .cl-mobile-btn.close {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-download-limit-alert-wrap .modal-dialog.cl-source-download-limit-alert {
  width: 420px !important;
  max-width: calc(100vw - 48px) !important;
  min-height: 0 !important;
  margin: 0 auto !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-download-limit-alert-wrap .modal-dialog.cl-source-download-limit-alert .modal-content {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  width: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 34px 32px 28px !important;
  overflow: visible !important;
  background: #fff !important;
  border: 1px solid var(--cl-border, #e5e7eb) !important;
  border-radius: var(--cl-radius-lg, 14px) !important;
  box-shadow: 0 24px 64px rgba(20, 24, 32, .22) !important;
  color: var(--cl-text, #222428) !important;
  font-family: var(--cl-source-font) !important;
  letter-spacing: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-download-limit-alert-wrap .modal-dialog.cl-source-download-limit-alert .modal-body,
body.cl-dashboard-redesign-page .flat-modal.cl-source-download-limit-alert-wrap .modal-dialog.cl-source-download-limit-alert .modal-footer {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-download-limit-alert-wrap .modal-dialog.cl-source-download-limit-alert .modal-title {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-download-limit-alert-wrap .modal-dialog.cl-source-download-limit-alert .download-limit-alert-message {
  margin: 0 !important;
  padding: 0 22px !important;
  color: var(--cl-text-sub, #696c71) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 22px !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  word-break: keep-all !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-download-limit-alert-wrap .modal-dialog.cl-source-download-limit-alert .modal-content > .close.close-button-dialog {
  position: absolute !important;
  top: 16px !important;
  right: 16px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  min-height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub, #696c71) !important;
  font-size: 0 !important;
  line-height: 1 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-download-limit-alert-wrap .modal-dialog.cl-source-download-limit-alert .modal-content > .close.close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-download-limit-alert-wrap .modal-dialog.cl-source-download-limit-alert .modal-content > .close.close-button-dialog:focus {
  background: #f1f2f5 !important;
  color: var(--cl-text, #222428) !important;
  outline: 0 !important;
  transform: rotate(90deg) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-download-limit-alert-wrap .modal-dialog.cl-source-download-limit-alert .modal-content > .close.close-button-dialog svg {
  display: block !important;
  width: 9px !important;
  height: 9px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-download-limit-alert-wrap .modal-dialog.cl-source-download-limit-alert .modal-footer {
  display: flex !important;
  align-items: stretch !important;
  justify-content: center !important;
  margin-top: 24px !important;
  border: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-download-limit-alert-wrap .modal-dialog.cl-source-download-limit-alert .modal-footer::before,
body.cl-dashboard-redesign-page .flat-modal.cl-source-download-limit-alert-wrap .modal-dialog.cl-source-download-limit-alert .modal-footer::after {
  display: none !important;
  content: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-download-limit-alert-wrap .modal-dialog.cl-source-download-limit-alert .modal-footer > .btn,
body.cl-dashboard-redesign-page .flat-modal.cl-source-download-limit-alert-wrap .modal-dialog.cl-source-download-limit-alert .modal-footer > .btn.btn-primary,
body.cl-dashboard-redesign-page .flat-modal.cl-source-download-limit-alert-wrap .modal-dialog.cl-source-download-limit-alert .modal-footer > .close-button-dialog,
body.cl-dashboard-redesign-page .flat-modal.cl-source-download-limit-alert-wrap .modal-dialog.cl-source-download-limit-alert .modal-footer > .ok-button-dialog,
body.cl-dashboard-redesign-page .flat-modal.cl-source-download-limit-alert-wrap .modal-dialog.cl-source-download-limit-alert .modal-footer > .btn:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-download-limit-alert-wrap .modal-dialog.cl-source-download-limit-alert .modal-footer > .btn:focus {
  float: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 44px !important;
  min-height: 44px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  background: var(--cl-green, #03C75A) !important;
  border: 1px solid var(--cl-green, #03C75A) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  text-align: center !important;
  text-shadow: none !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-download-limit-alert-wrap .modal-dialog.cl-source-download-limit-alert .modal-footer > .btn:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-download-limit-alert-wrap .modal-dialog.cl-source-download-limit-alert .modal-footer > .btn:focus {
  background: var(--cl-green-hover, #02b351) !important;
  border-color: var(--cl-green-hover, #02b351) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap {
  position: relative !important;
  z-index: 1000004 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap + .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap + .modal-backdrop.fade,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap + .modal-backdrop.in {
  z-index: 1000003 !important;
  background: rgba(17, 24, 39, .46) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-default {
  z-index: 1000004 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-default.in,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-default.show {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 24px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-default > .cl-mobile-btn.close {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-default > .modal-dialog.cl-source-etc-exclude-date-modal {
  box-sizing: border-box !important;
  width: 420px !important;
  max-width: calc(100vw - 48px) !important;
  min-height: 0 !important;
  margin: 0 auto !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  transform: none !important;
  user-select: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal .modal-content {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-height: 0 !important;
  max-height: calc(100vh - 48px) !important;
  margin: 0 !important;
  padding: 28px 28px 24px !important;
  overflow: auto !important;
  background: #fff !important;
  border: 1px solid var(--cl-border, #e5e7eb) !important;
  border-radius: var(--cl-radius-lg, 14px) !important;
  box-shadow: 0 24px 64px rgba(20, 24, 32, .22) !important;
  color: var(--cl-text, #222428) !important;
  font-family: var(--cl-source-font) !important;
  letter-spacing: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal .modal-body,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal .modal-footer {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal .modal-title {
  margin: 0 156px 22px 0 !important;
  padding: 0 !important;
  color: var(--cl-text, #222428) !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  line-height: 24px !important;
  letter-spacing: 0 !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal .modal-content > .close.close-button-dialog {
  position: absolute !important;
  top: 16px !important;
  right: 16px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  min-height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub, #696c71) !important;
  font-size: 0 !important;
  line-height: 1 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal .modal-content > .close.close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal .modal-content > .close.close-button-dialog:focus {
  background: #f1f2f5 !important;
  color: var(--cl-text, #222428) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal .modal-content > .close.close-button-dialog svg {
  display: block !important;
  width: 10px !important;
  height: 10px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal .except-calendar-box {
  float: none !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal .except-calendar-box .unselect-all {
  position: absolute !important;
  top: 16px !important;
  right: 54px !important;
  float: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  width: auto !important;
  height: 30px !important;
  min-height: 30px !important;
  margin: 0 !important;
  padding: 0 10px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border, #e5e7eb) !important;
  border-radius: 7px !important;
  color: var(--cl-text-sub, #696c71) !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal .except-calendar-box .unselect-all.disabled {
  color: var(--cl-text-muted, #b1b3b7) !important;
  cursor: default !important;
  opacity: 1 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal .except-calendar-box .unselect-all:not(.disabled):hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal .except-calendar-box .unselect-all:not(.disabled):focus {
  border-color: var(--cl-green, #03C75A) !important;
  background: var(--cl-green-soft, #eaf9f1) !important;
  color: var(--cl-green-text) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal .except-calendar-box .unselect-all svg {
  display: block !important;
  flex: 0 0 14px !important;
  width: 14px !important;
  height: 14px !important;
  margin: 0 6px 0 0 !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker {
  float: none !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text, #222428) !important;
  font-size: 13px !important;
  font-family: inherit !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk.inline.d-show .d-calendar,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk.inline .d-calendar {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: #fff !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-header {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 40px !important;
  margin: 0 0 10px !important;
  padding: 0 34px !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-header p {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text, #222428) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 22px !important;
  letter-spacing: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-header .d-year,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-header .d-month {
  position: relative !important;
  display: inline-block !important;
  margin: 0 !important;
  padding: 0 !important;
  color: inherit !important;
  font: inherit !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-header .d-month {
  margin-left: 6px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-header .d-month::after {
  display: none !important;
  content: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-header i {
  position: absolute !important;
  top: 50% !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  width: 28px !important;
  height: 28px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 7px !important;
  color: var(--cl-text-sub, #696c71) !important;
  fill: currentColor !important;
  cursor: pointer !important;
  transform: translateY(-50%) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-header i:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-header i:focus {
  background: var(--cl-green-soft, #eaf9f1) !important;
  color: var(--cl-green, #03C75A) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-header i::before,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-header i::after {
  display: none !important;
  content: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-header i::before {
  content: "" !important;
  position: static !important;
  display: block !important;
  width: 16px !important;
  height: 16px !important;
  border: 0 !important;
  background-color: currentColor !important;
  transform: none !important;
  -webkit-mask-repeat: no-repeat !important;
  mask-repeat: no-repeat !important;
  -webkit-mask-position: center !important;
  mask-position: center !important;
  -webkit-mask-size: 16px 16px !important;
  mask-size: 16px 16px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-header i::after {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-header i svg {
  display: none !important;
  width: 13px !important;
  height: 13px !important;
  margin: 0 !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-header i#dy-previous::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M18 6l-6 6 6 6M11 6l-6 6 6 6'/%3E%3C/svg%3E") !important;
  mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M18 6l-6 6 6 6M11 6l-6 6 6 6'/%3E%3C/svg%3E") !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-header i#d-previous::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M15 18l-6-6 6-6'/%3E%3C/svg%3E") !important;
  mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M15 18l-6-6 6-6'/%3E%3C/svg%3E") !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-header i#d-next::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9 18l6-6-6-6'/%3E%3C/svg%3E") !important;
  mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9 18l6-6-6-6'/%3E%3C/svg%3E") !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-header i#dy-next::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6 6l6 6-6 6M13 6l6 6-6 6'/%3E%3C/svg%3E") !important;
  mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6 6l6 6-6 6M13 6l6 6-6 6'/%3E%3C/svg%3E") !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-header i#dy-previous {
  left: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-header i#d-previous {
  left: 32px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-header i#d-next {
  right: 32px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-header i#dy-next {
  right: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-weekdays,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-week,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-tables,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-table {
  box-sizing: border-box !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text, #222428) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-week {
  display: flex !important;
  align-items: center !important;
  margin-bottom: 6px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-week > div {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: calc(100% / 7) !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-week > div p {
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text-muted, #b1b3b7) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 28px !important;
  letter-spacing: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-table {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: flex-start !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-table input + label {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  width: calc(100% / 7) !important;
  height: 34px !important;
  min-height: 34px !important;
  margin: 1px 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px !important;
  color: var(--cl-text, #222428) !important;
  cursor: pointer !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-table input + label text {
  position: relative !important;
  z-index: 2 !important;
  color: currentColor !important;
  font: inherit !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-table input + label::before {
  content: "" !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  display: block !important;
  box-sizing: border-box !important;
  width: 28px !important;
  height: 28px !important;
  border: 1px solid transparent !important;
  border-radius: 8px !important;
  background: transparent !important;
  opacity: 1 !important;
  transform: translate(-50%, -50%) scale(0) !important;
  transform-origin: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-table input:not(:disabled) + label.exp {
  color: var(--cl-text, #222428) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-table input:not(:disabled) + label.exp text {
  color: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-table input:not(.active):not(:checked) + label.cl-source-outside-month,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-table input:not(.active):not(:checked) + label.cl-source-outside-month text {
  color: var(--cl-text-muted, #b1b3b7) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-table input.active + label.cl-source-outside-month,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-table input:checked + label.cl-source-outside-month {
  opacity: .72 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-table input:not(:disabled) + label:hover::before,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-table input:not(:disabled) + label.exp:hover::before {
  display: block !important;
  border-color: transparent !important;
  background: var(--cl-green-soft, #eaf9f1) !important;
  transform: translate(-50%, -50%) scale(1) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-table input.active + label,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-table input:checked + label,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-table input.active + label.exp,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-table input:checked + label.exp {
  background: transparent !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-table input.active + label text,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-table input:checked + label text,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-table input.active + label.exp text,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-table input:checked + label.exp text {
  color: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-table input.active + label::before,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-table input:checked + label::before,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-table input.active + label.exp::before,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-table input:checked + label.exp::before {
  display: block !important;
  border-color: var(--cl-green, #03C75A) !important;
  background: var(--cl-green-soft, #eaf9f1) !important;
  transform: translate(-50%, -50%) scale(1) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-table input:disabled + label,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-table input + label.disabled,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-table input + label.d-hidden {
  background: transparent !important;
  color: var(--cl-text-muted, #b1b3b7) !important;
  cursor: default !important;
  text-decoration: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-table input:disabled + label::before,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-table input + label.disabled::before,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-table input + label.d-hidden::before,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-table input:disabled + label::after,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-table input + label.disabled::after,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-table input + label.d-hidden::after {
  display: none !important;
  content: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal #etc-except-date-picker .Datepickk .d-table input + label.today text::before {
  background: var(--cl-green, #03C75A) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal .term-setting {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal .modal-footer {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  align-items: stretch !important;
  justify-items: stretch !important;
  gap: 8px !important;
  margin-top: 22px !important;
  border: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal .modal-footer::before,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal .modal-footer::after {
  display: none !important;
  content: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal .modal-footer > .btn {
  float: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 44px !important;
  min-height: 44px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  text-align: center !important;
  text-shadow: none !important;
  vertical-align: middle !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal .modal-footer > .ok-button-dialog {
  order: 2 !important;
  background: var(--cl-green, #03C75A) !important;
  border: 1px solid var(--cl-green, #03C75A) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal .modal-footer > .ok-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal .modal-footer > .ok-button-dialog:focus {
  background: var(--cl-green-hover, #02b351) !important;
  border-color: var(--cl-green-hover, #02b351) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal .modal-footer > .close-button-dialog {
  order: 1 !important;
  background: #fff !important;
  border: 1px solid var(--cl-border, #e5e7eb) !important;
  color: var(--cl-text-sub, #696c71) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal .modal-footer > .close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal .modal-footer > .close-button-dialog:focus {
  border-color: var(--cl-green, #03C75A) !important;
  background: var(--cl-green-soft, #eaf9f1) !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.term-setting {
  align-items: flex-start !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.etc-setting.term-setting > .title {
  align-self: flex-start !important;
  min-height: 40px !important;
  padding-top: 11px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.term-setting > .etc-content {
  align-self: flex-start !important;
  justify-content: flex-start !important;
  min-height: 40px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.etc-setting.term-setting .setting-etc-radio {
  height: 40px !important;
  min-height: 40px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box.etc-setting.term-setting .setting-text {
  margin-top: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap {
  position: relative !important;
  z-index: 1000004 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap + .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap + .modal-backdrop.fade,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap + .modal-backdrop.in {
  z-index: 1000003 !important;
  background: rgba(20, 24, 32, .48) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-default {
  z-index: 1000004 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-default.in,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-default.show {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 24px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-default > .cl-mobile-btn.close {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-default > .modal-dialog.cl-source-etc-term-date-modal {
  float: none !important;
  box-sizing: border-box !important;
  width: 500px !important;
  max-width: calc(100vw - 48px) !important;
  min-width: 0 !important;
  height: auto !important;
  max-height: calc(100vh - 48px) !important;
  margin: 0 auto !important;
  padding: 0 !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal .modal-content {
  position: relative !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-height: 0 !important;
  max-height: calc(100vh - 48px) !important;
  margin: 0 !important;
  padding: 28px 28px 24px !important;
  overflow: auto !important;
  border: 1px solid rgba(20, 24, 32, .08) !important;
  border-radius: 14px !important;
  background: #fff !important;
  box-shadow: 0 18px 44px rgba(20, 24, 32, .22) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal .modal-body,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal .modal-footer {
  float: none !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal .modal-title {
  display: block !important;
  margin: 0 40px 22px 0 !important;
  padding: 0 !important;
  color: var(--cl-text, #222428) !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  line-height: 24px !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal .modal-content > .close.close-button-dialog {
  position: absolute !important;
  top: 24px !important;
  right: 24px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  width: 28px !important;
  height: 28px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 7px !important;
  background: transparent !important;
  color: var(--cl-text-muted, #b1b3b7) !important;
  cursor: pointer !important;
  font-size: 0 !important;
  line-height: 0 !important;
  opacity: 1 !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal .modal-content > .close.close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal .modal-content > .close.close-button-dialog:focus {
  background: #f0f2f5 !important;
  color: var(--cl-text-sub, #696c71) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal .modal-content > .close.close-button-dialog svg {
  display: block !important;
  width: 14px !important;
  height: 14px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal .setting-row {
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  min-height: 36px !important;
  margin: 0 0 10px !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal .setting-label {
  flex: 0 0 72px !important;
  width: 72px !important;
  min-width: 72px !important;
  margin: 0 12px 0 0 !important;
  padding: 0 !important;
  color: var(--cl-text, #222428) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 18px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal .btn-group {
  display: flex !important;
  flex: 1 1 auto !important;
  width: auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  gap: 6px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal .btn-group > .btn {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 1 1 0 !important;
  min-width: 0 !important;
  height: 34px !important;
  margin: 0 !important;
  padding: 0 8px !important;
  border: 1px solid var(--cl-border, #e5e7eb) !important;
  border-radius: 7px !important;
  background: #fff !important;
  color: var(--cl-text-sub, #696c71) !important;
  box-shadow: none !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  text-align: center !important;
  text-shadow: none !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal .btn-group > .btn.checked {
  border-color: var(--cl-green, #03C75A) !important;
  background: var(--cl-green-soft, #eaf9f1) !important;
  color: var(--cl-green-text) !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal .btn-group > .btn input {
  position: absolute !important;
  inset: 0 !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal .term-calendar-box {
  float: none !important;
  box-sizing: border-box !important;
  width: 100% !important;
  margin: 18px 0 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  border: 0 !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker {
  float: none !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text, #222428) !important;
  font-size: 13px !important;
  font-family: inherit !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk.inline.d-show .d-calendar,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk.inline .d-calendar {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: #fff !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-header {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 40px !important;
  margin: 0 0 10px !important;
  padding: 0 34px !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-header p {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text, #222428) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 22px !important;
  letter-spacing: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-header .d-year,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-header .d-month {
  position: relative !important;
  display: inline-block !important;
  margin: 0 !important;
  padding: 0 !important;
  color: inherit !important;
  font: inherit !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-header .d-month {
  margin-left: 6px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-header .d-month::after {
  display: none !important;
  content: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-header i {
  position: absolute !important;
  top: 50% !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  width: 28px !important;
  height: 28px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 7px !important;
  color: var(--cl-text-sub, #696c71) !important;
  fill: currentColor !important;
  cursor: pointer !important;
  transform: translateY(-50%) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-header i:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-header i:focus {
  background: var(--cl-green-soft, #eaf9f1) !important;
  color: var(--cl-green, #03C75A) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-header i::before {
  content: "" !important;
  position: static !important;
  display: block !important;
  width: 16px !important;
  height: 16px !important;
  border: 0 !important;
  background-color: currentColor !important;
  transform: none !important;
  -webkit-mask-repeat: no-repeat !important;
  mask-repeat: no-repeat !important;
  -webkit-mask-position: center !important;
  mask-position: center !important;
  -webkit-mask-size: 16px 16px !important;
  mask-size: 16px 16px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-header i::after {
  display: none !important;
  content: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-header i svg {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-header i#dy-previous::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M18 6l-6 6 6 6M11 6l-6 6 6 6'/%3E%3C/svg%3E") !important;
  mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M18 6l-6 6 6 6M11 6l-6 6 6 6'/%3E%3C/svg%3E") !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-header i#d-previous::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M15 18l-6-6 6-6'/%3E%3C/svg%3E") !important;
  mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M15 18l-6-6 6-6'/%3E%3C/svg%3E") !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-header i#d-next::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9 18l6-6-6-6'/%3E%3C/svg%3E") !important;
  mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9 18l6-6-6-6'/%3E%3C/svg%3E") !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-header i#dy-next::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6 6l6 6-6 6M13 6l6 6-6 6'/%3E%3C/svg%3E") !important;
  mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6 6l6 6-6 6M13 6l6 6-6 6'/%3E%3C/svg%3E") !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-header i#dy-previous {
  left: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-header i#d-previous {
  left: 32px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-header i#d-next {
  right: 32px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-header i#dy-next {
  right: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-weekdays,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-week,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-tables,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-table {
  box-sizing: border-box !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text, #222428) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-week {
  display: flex !important;
  align-items: center !important;
  margin-bottom: 6px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-week > div {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: calc(100% / 7) !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-week > div p {
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text-muted, #b1b3b7) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 28px !important;
  letter-spacing: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-table {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: flex-start !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-table input + label {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  width: calc(100% / 7) !important;
  height: 34px !important;
  min-height: 34px !important;
  margin: 1px 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px !important;
  color: var(--cl-text, #222428) !important;
  cursor: pointer !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-table input + label text {
  position: relative !important;
  z-index: 2 !important;
  color: currentColor !important;
  font: inherit !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-table input + label::before {
  content: "" !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  display: block !important;
  box-sizing: border-box !important;
  width: 28px !important;
  height: 28px !important;
  border: 1px solid transparent !important;
  border-radius: 8px !important;
  background: transparent !important;
  opacity: 1 !important;
  transform: translate(-50%, -50%) scale(0) !important;
  transform-origin: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-table input + label::after {
  display: none !important;
  content: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-table input:not(.etc-active):not(.etc-start-active):not(.etc-end-active):not(:checked) + label.prev,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-table input:not(.etc-active):not(.etc-start-active):not(.etc-end-active):not(:checked) + label.next,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-table input:not(.etc-active):not(.etc-start-active):not(.etc-end-active):not(:checked) + label.prev text,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-table input:not(.etc-active):not(.etc-start-active):not(.etc-end-active):not(:checked) + label.next text {
  color: var(--cl-text-muted, #b1b3b7) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-table input:not(:disabled) + label:hover::before {
  display: block !important;
  border-color: transparent !important;
  background: var(--cl-green-soft, #eaf9f1) !important;
  transform: translate(-50%, -50%) scale(1) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-table input.inRange + label,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-table input.inRange + label text {
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-table input.inRange + label::before {
  display: block !important;
  width: 100% !important;
  height: 28px !important;
  border-color: transparent !important;
  border-radius: 0 !important;
  background: var(--cl-green-tint, #f3fcf7) !important;
  transform: translate(-50%, -50%) scale(1) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-table input.etc-active + label,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-table input.etc-start-active + label,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-table input.etc-end-active + label,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-table input:checked + label {
  background: transparent !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-table input.etc-active + label text,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-table input.etc-start-active + label text,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-table input.etc-end-active + label text,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-table input:checked + label text {
  color: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-table input.etc-active + label::before,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-table input.etc-start-active + label::before,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-table input.etc-end-active + label::before,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-table input:checked + label::before {
  display: block !important;
  width: 28px !important;
  height: 28px !important;
  border-color: var(--cl-green, #03C75A) !important;
  border-radius: 8px !important;
  background: var(--cl-green, #03C75A) !important;
  transform: translate(-50%, -50%) scale(1) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-table input:disabled + label,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-table input + label.disabled,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-table input + label.d-hidden {
  background: transparent !important;
  color: var(--cl-text-muted, #b1b3b7) !important;
  cursor: default !important;
  text-decoration: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-table input:disabled + label::before,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-table input + label.disabled::before,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-table input + label.d-hidden::before {
  display: none !important;
  content: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-table input + label.today text::before {
  background: var(--cl-green, #03C75A) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-tables.range:not(.before) input:not(.single):checked + label {
  margin: 1px 0 !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-tables.range:not(.before) input:not(.single):checked + label::before {
  display: block !important;
  width: 28px !important;
  height: 28px !important;
  border-color: var(--cl-green, #03C75A) !important;
  border-radius: 8px !important;
  background: var(--cl-green, #03C75A) !important;
  transform: translate(-50%, -50%) scale(1) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-tables.range:not(.before) input:not(.single):checked + label ~ label:not(.hidden) {
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-tables.range:not(.before) input:not(.single):checked + label ~ label:not(.hidden)::before {
  display: block !important;
  width: 100% !important;
  height: 28px !important;
  border-color: transparent !important;
  border-radius: 0 !important;
  background: var(--cl-green-tint, #f3fcf7) !important;
  transform: translate(-50%, -50%) scale(1) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-tables.range:not(.before) input:not(.single):checked ~ label:hover ~ label,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-tables.range:not(.before) input:not(.single):checked ~ label:focus ~ label,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-tables.range:not(.before) input:not(.single):checked ~ input:checked + label ~ label {
  color: var(--cl-text, #222428) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-tables.range:not(.before) input:not(.single):checked ~ label:hover ~ label::before,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-tables.range:not(.before) input:not(.single):checked ~ label:focus ~ label::before,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-tables.range:not(.before) input:not(.single):checked ~ input:checked + label ~ label::before {
  transform: translate(-50%, -50%) scale(0) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-tables.range:not(.before) input:not(.single):checked ~ input:checked + label {
  color: #fff !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-tables.range:not(.before) input:not(.single):checked ~ input:checked + label::before {
  display: block !important;
  width: 28px !important;
  height: 28px !important;
  border-color: var(--cl-green, #03C75A) !important;
  border-radius: 8px !important;
  background: var(--cl-green, #03C75A) !important;
  transform: translate(-50%, -50%) scale(1) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-tables.range:not(.before) input:not(.single):checked ~ label:hover ~ label.next,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-tables.range:not(.before) input:not(.single):checked ~ label:focus ~ label.next,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-tables.range:not(.before) input:not(.single):checked ~ label:hover ~ label.prev,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-tables.range:not(.before) input:not(.single):checked ~ label:focus ~ label.prev,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-tables.range:not(.before) input:not(.single):checked ~ input:checked + label ~ label.next,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal #term-datepicker .Datepickk .d-tables.range:not(.before) input:not(.single):checked ~ input:checked + label ~ label.prev {
  color: var(--cl-text-muted, #b1b3b7) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal .term-setting {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-height: 36px !important;
  margin: 14px 0 0 !important;
  padding: 9px 12px !important;
  border: 1px solid var(--cl-green-line, #cdefdd) !important;
  border-radius: 8px !important;
  background: var(--cl-green-tint, #f3fcf7) !important;
  color: var(--cl-green-text) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 18px !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal .term-setting.hide {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal .modal-footer {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  align-items: stretch !important;
  justify-items: stretch !important;
  gap: 8px !important;
  margin-top: 22px !important;
  border: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal .modal-footer::before,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal .modal-footer::after {
  display: none !important;
  content: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal .modal-footer > .btn {
  float: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 44px !important;
  min-height: 44px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  text-align: center !important;
  text-shadow: none !important;
  vertical-align: middle !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal .modal-footer > .ok-button-dialog {
  order: 2 !important;
  background: var(--cl-green, #03C75A) !important;
  border: 1px solid var(--cl-green, #03C75A) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal .modal-footer > .ok-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal .modal-footer > .ok-button-dialog:focus {
  background: var(--cl-green-hover, #02b351) !important;
  border-color: var(--cl-green-hover, #02b351) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal .modal-footer > .close-button-dialog {
  order: 1 !important;
  background: #fff !important;
  border: 1px solid var(--cl-border, #e5e7eb) !important;
  color: var(--cl-text-sub, #696c71) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal .modal-footer > .close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-term-date-modal-wrap .modal-dialog.cl-source-etc-term-date-modal .modal-footer > .close-button-dialog:focus {
  border-color: var(--cl-green, #03C75A) !important;
  background: var(--cl-green-soft, #eaf9f1) !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-etc-exclude-date-modal-wrap, .cl-source-etc-term-date-modal-wrap) {
  position: fixed !important;
  inset: 0 !important;
  z-index: 1000004 !important;
  display: block !important;
  width: 100vw !important;
  height: 100vh !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-etc-exclude-date-modal-wrap, .cl-source-etc-term-date-modal-wrap) .modal-default,
body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-etc-exclude-date-modal-wrap, .cl-source-etc-term-date-modal-wrap) .modal-default.in,
body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-etc-exclude-date-modal-wrap, .cl-source-etc-term-date-modal-wrap) .modal-default.show {
  position: fixed !important;
  inset: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  width: 100vw !important;
  height: 100vh !important;
  min-height: 100vh !important;
  margin: 0 !important;
  padding: 24px !important;
  overflow: hidden !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-etc-exclude-date-modal-wrap, .cl-source-etc-term-date-modal-wrap) .modal-default.fade,
body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-etc-exclude-date-modal-wrap, .cl-source-etc-term-date-modal-wrap) .modal-default.fade.in,
body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-etc-exclude-date-modal-wrap, .cl-source-etc-term-date-modal-wrap) .modal-default.fade.show {
  -webkit-transition: opacity .2s linear !important;
  -moz-transition: opacity .2s linear !important;
  -o-transition: opacity .2s linear !important;
  transition: opacity .2s linear !important;
}

body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-etc-exclude-date-modal-wrap, .cl-source-etc-term-date-modal-wrap) .modal-default > .modal-dialog:is(.cl-source-etc-exclude-date-modal, .cl-source-etc-term-date-modal) {
  float: none !important;
  align-self: center !important;
  height: auto !important;
  max-height: calc(100vh - 48px) !important;
  -webkit-transform: none !important;
  -ms-transform: none !important;
  -o-transform: none !important;
  transform: none !important;
  -webkit-transition: none !important;
  -moz-transition: none !important;
  -o-transition: none !important;
  transition: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal .except-calendar-box {
  position: static !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal .modal-body {
  position: static !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-exclude-date-modal-wrap .modal-dialog.cl-source-etc-exclude-date-modal .except-calendar-box .unselect-all {
  top: 16px !important;
  right: 52px !important;
}

body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-etc-exclude-date-modal-wrap, .cl-source-etc-term-date-modal-wrap) .modal-dialog:is(.cl-source-etc-exclude-date-modal, .cl-source-etc-term-date-modal) :is(#etc-except-date-picker, #term-datepicker) .Datepickk .d-calendar {
  position: relative !important;
}

body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-etc-exclude-date-modal-wrap, .cl-source-etc-term-date-modal-wrap) .modal-dialog:is(.cl-source-etc-exclude-date-modal, .cl-source-etc-term-date-modal) :is(#etc-except-date-picker, #term-datepicker) .Datepickk .d-header p {
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-etc-exclude-date-modal-wrap, .cl-source-etc-term-date-modal-wrap) .modal-dialog:is(.cl-source-etc-exclude-date-modal, .cl-source-etc-term-date-modal) :is(#etc-except-date-picker, #term-datepicker) .Datepickk .d-header .d-year,
body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-etc-exclude-date-modal-wrap, .cl-source-etc-term-date-modal-wrap) .modal-dialog:is(.cl-source-etc-exclude-date-modal, .cl-source-etc-term-date-modal) :is(#etc-except-date-picker, #term-datepicker) .Datepickk .d-header .d-month {
  display: inline-flex !important;
  align-items: center !important;
  vertical-align: middle !important;
}

body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-etc-exclude-date-modal-wrap, .cl-source-etc-term-date-modal-wrap) .modal-dialog:is(.cl-source-etc-exclude-date-modal, .cl-source-etc-term-date-modal) :is(#etc-except-date-picker, #term-datepicker) .Datepickk .d-header .d-month::after {
  content: "" !important;
  display: inline-block !important;
  flex: 0 0 14px !important;
  width: 14px !important;
  height: 14px !important;
  margin-left: 5px !important;
  background-color: var(--cl-text-sub, #696c71) !important;
  transform: translateY(1px) !important;
  transition: transform .12s ease, background-color .12s ease !important;
  -webkit-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center / 14px 14px no-repeat !important;
  mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center / 14px 14px no-repeat !important;
}

body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-etc-exclude-date-modal-wrap, .cl-source-etc-term-date-modal-wrap) .modal-dialog:is(.cl-source-etc-exclude-date-modal, .cl-source-etc-term-date-modal) :is(#etc-except-date-picker, #term-datepicker) .Datepickk .d-header p:hover .d-month::after {
  background-color: var(--cl-green, #03C75A) !important;
}

body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-etc-exclude-date-modal-wrap, .cl-source-etc-term-date-modal-wrap) .modal-dialog:is(.cl-source-etc-exclude-date-modal, .cl-source-etc-term-date-modal) :is(#etc-except-date-picker, #term-datepicker) .Datepickk .d-calendar:has(.d-month-year-picker.d-show) .d-header .d-month::after {
  transform: translateY(1px) rotate(180deg) !important;
}

body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-etc-exclude-date-modal-wrap, .cl-source-etc-term-date-modal-wrap) .modal-dialog:is(.cl-source-etc-exclude-date-modal, .cl-source-etc-term-date-modal) :is(#etc-except-date-picker, #term-datepicker) .Datepickk .d-month-year-picker {
  position: absolute !important;
  top: 44px !important;
  left: 50% !important;
  z-index: 30 !important;
  box-sizing: border-box !important;
  width: 330px !important;
  max-width: calc(100% - 16px) !important;
  height: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
  visibility: hidden !important;
  background: #fff !important;
  border: 1px solid var(--cl-border, #e5e7eb) !important;
  border-radius: 10px !important;
  box-shadow: 0 12px 30px rgba(20, 24, 32, .16) !important;
  color: var(--cl-text, #222428) !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transform: translateX(-50%) translateY(-4px) !important;
  transition: opacity .12s ease, transform .12s ease !important;
}

body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-etc-exclude-date-modal-wrap, .cl-source-etc-term-date-modal-wrap) .modal-dialog:is(.cl-source-etc-exclude-date-modal, .cl-source-etc-term-date-modal) :is(#etc-except-date-picker, #term-datepicker) .Datepickk .d-month-year-picker.d-show {
  height: 188px !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  transform: translateX(-50%) translateY(0) !important;
}

body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-etc-exclude-date-modal-wrap, .cl-source-etc-term-date-modal-wrap) .modal-dialog:is(.cl-source-etc-exclude-date-modal, .cl-source-etc-term-date-modal) :is(#etc-except-date-picker, #term-datepicker) .Datepickk .d-month-year-picker .pick-header {
  position: relative !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  align-items: center !important;
  box-sizing: border-box !important;
  height: 38px !important;
  margin: 0 !important;
  padding: 0 34px 0 0 !important;
  border-bottom: 1px solid var(--cl-line, #eef0f4) !important;
  background: #fafbfc !important;
}

body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-etc-exclude-date-modal-wrap, .cl-source-etc-term-date-modal-wrap) .modal-dialog:is(.cl-source-etc-exclude-date-modal, .cl-source-etc-term-date-modal) :is(#etc-except-date-picker, #term-datepicker) .Datepickk .d-month-year-picker .pick-header > div {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  width: auto !important;
  min-width: 0 !important;
  height: 38px !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text-sub, #696c71) !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}

body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-etc-exclude-date-modal-wrap, .cl-source-etc-term-date-modal-wrap) .modal-dialog:is(.cl-source-etc-exclude-date-modal, .cl-source-etc-term-date-modal) :is(#etc-except-date-picker, #term-datepicker) .Datepickk .d-month-year-picker .pick-header .close-picker {
  position: absolute !important;
  top: 50% !important;
  right: 8px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  width: 24px !important;
  height: 24px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 7px !important;
  background: transparent !important;
  color: var(--cl-text-muted, #b1b3b7) !important;
  transform: translateY(-50%) !important;
}

body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-etc-exclude-date-modal-wrap, .cl-source-etc-term-date-modal-wrap) .modal-dialog:is(.cl-source-etc-exclude-date-modal, .cl-source-etc-term-date-modal) :is(#etc-except-date-picker, #term-datepicker) .Datepickk .d-month-year-picker .pick-header .close-picker:hover,
body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-etc-exclude-date-modal-wrap, .cl-source-etc-term-date-modal-wrap) .modal-dialog:is(.cl-source-etc-exclude-date-modal, .cl-source-etc-term-date-modal) :is(#etc-except-date-picker, #term-datepicker) .Datepickk .d-month-year-picker .pick-header .close-picker:focus {
  background: #f0f2f5 !important;
  color: var(--cl-text-sub, #696c71) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-etc-exclude-date-modal-wrap, .cl-source-etc-term-date-modal-wrap) .modal-dialog:is(.cl-source-etc-exclude-date-modal, .cl-source-etc-term-date-modal) :is(#etc-except-date-picker, #term-datepicker) .Datepickk .d-month-year-picker .pick-header .close-picker svg {
  display: block !important;
  width: 10px !important;
  height: 10px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-etc-exclude-date-modal-wrap, .cl-source-etc-term-date-modal-wrap) .modal-dialog:is(.cl-source-etc-exclude-date-modal, .cl-source-etc-term-date-modal) :is(#etc-except-date-picker, #term-datepicker) .Datepickk .d-month-year-picker .pick-body {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  box-sizing: border-box !important;
  height: 150px !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-etc-exclude-date-modal-wrap, .cl-source-etc-term-date-modal-wrap) .modal-dialog:is(.cl-source-etc-exclude-date-modal, .cl-source-etc-term-date-modal) :is(#etc-except-date-picker, #term-datepicker) .Datepickk .d-month-year-picker .pick-body > div {
  box-sizing: border-box !important;
  width: auto !important;
  height: 150px !important;
  margin: 0 !important;
  padding: 6px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}

body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-etc-exclude-date-modal-wrap, .cl-source-etc-term-date-modal-wrap) .modal-dialog:is(.cl-source-etc-exclude-date-modal, .cl-source-etc-term-date-modal) :is(#etc-except-date-picker, #term-datepicker) .Datepickk .d-month-year-picker .pick-body .year-picker {
  border-right: 1px solid var(--cl-line, #eef0f4) !important;
}

body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-etc-exclude-date-modal-wrap, .cl-source-etc-term-date-modal-wrap) .modal-dialog:is(.cl-source-etc-exclude-date-modal, .cl-source-etc-term-date-modal) :is(#etc-except-date-picker, #term-datepicker) .Datepickk .d-month-year-picker .pick-body > div > div {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  width: 100% !important;
  height: 30px !important;
  margin: 0 0 2px !important;
  padding: 0 8px !important;
  border-radius: 6px !important;
  background: transparent !important;
  color: var(--cl-text-sub, #696c71) !important;
  cursor: pointer !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
}

body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-etc-exclude-date-modal-wrap, .cl-source-etc-term-date-modal-wrap) .modal-dialog:is(.cl-source-etc-exclude-date-modal, .cl-source-etc-term-date-modal) :is(#etc-except-date-picker, #term-datepicker) .Datepickk .d-month-year-picker .pick-body > div > div.hide {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-etc-exclude-date-modal-wrap, .cl-source-etc-term-date-modal-wrap) .modal-dialog:is(.cl-source-etc-exclude-date-modal, .cl-source-etc-term-date-modal) :is(#etc-except-date-picker, #term-datepicker) .Datepickk .d-month-year-picker .pick-body > div > div:hover,
body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-etc-exclude-date-modal-wrap, .cl-source-etc-term-date-modal-wrap) .modal-dialog:is(.cl-source-etc-exclude-date-modal, .cl-source-etc-term-date-modal) :is(#etc-except-date-picker, #term-datepicker) .Datepickk .d-month-year-picker .pick-body > div > div:focus {
  background: var(--cl-green-soft, #eaf9f1) !important;
  color: var(--cl-green-text) !important;
  font-weight: 700 !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-etc-exclude-date-modal-wrap, .cl-source-etc-term-date-modal-wrap) .modal-dialog:is(.cl-source-etc-exclude-date-modal, .cl-source-etc-term-date-modal) :is(#etc-except-date-picker, #term-datepicker) .Datepickk .d-month-year-picker .pick-body .month-picker .current,
body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-etc-exclude-date-modal-wrap, .cl-source-etc-term-date-modal-wrap) .modal-dialog:is(.cl-source-etc-exclude-date-modal, .cl-source-etc-term-date-modal) :is(#etc-except-date-picker, #term-datepicker) .Datepickk .d-month-year-picker .pick-body .year-picker .current {
  background: var(--cl-green-soft, #eaf9f1) !important;
  color: var(--cl-green-text) !important;
  font-weight: 700 !important;
  cursor: default !important;
}

body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-etc-exclude-date-modal-wrap, .cl-source-etc-term-date-modal-wrap) .modal-dialog:is(.cl-source-etc-exclude-date-modal, .cl-source-etc-term-date-modal) .modal-footer {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-auto-rows: 46px !important;
  align-items: center !important;
  justify-items: stretch !important;
  gap: 14px !important;
  width: 100% !important;
  margin: 22px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-etc-exclude-date-modal-wrap, .cl-source-etc-term-date-modal-wrap) .modal-dialog:is(.cl-source-etc-exclude-date-modal, .cl-source-etc-term-date-modal) .modal-footer > .btn,
body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-etc-exclude-date-modal-wrap, .cl-source-etc-term-date-modal-wrap) .modal-dialog:is(.cl-source-etc-exclude-date-modal, .cl-source-etc-term-date-modal) .modal-footer > button {
  position: static !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  float: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  align-self: stretch !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 46px !important;
  min-height: 46px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  transform: none !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 20px !important;
  text-align: center !important;
  vertical-align: middle !important;
}

body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-etc-exclude-date-modal-wrap, .cl-source-etc-term-date-modal-wrap) .modal-dialog:is(.cl-source-etc-exclude-date-modal, .cl-source-etc-term-date-modal) .modal-footer > .ok-button-dialog {
  order: 1 !important;
  background: var(--cl-green, #03C75A) !important;
  border: 1px solid var(--cl-green, #03C75A) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: #fff !important;
  text-shadow: none !important;
}

body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-etc-exclude-date-modal-wrap, .cl-source-etc-term-date-modal-wrap) .modal-dialog:is(.cl-source-etc-exclude-date-modal, .cl-source-etc-term-date-modal) .modal-footer > .ok-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-etc-exclude-date-modal-wrap, .cl-source-etc-term-date-modal-wrap) .modal-dialog:is(.cl-source-etc-exclude-date-modal, .cl-source-etc-term-date-modal) .modal-footer > .ok-button-dialog:focus {
  background: var(--cl-green-hover, #02b351) !important;
  border-color: var(--cl-green-hover, #02b351) !important;
  color: #fff !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-etc-exclude-date-modal-wrap, .cl-source-etc-term-date-modal-wrap) .modal-dialog:is(.cl-source-etc-exclude-date-modal, .cl-source-etc-term-date-modal) .modal-footer > .close-button-dialog {
  order: 2 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub, #696c71) !important;
  text-shadow: none !important;
}

body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-etc-exclude-date-modal-wrap, .cl-source-etc-term-date-modal-wrap) .modal-dialog:is(.cl-source-etc-exclude-date-modal, .cl-source-etc-term-date-modal) .modal-footer > .close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal:is(.cl-source-etc-exclude-date-modal-wrap, .cl-source-etc-term-date-modal-wrap) .modal-dialog:is(.cl-source-etc-exclude-date-modal, .cl-source-etc-term-date-modal) .modal-footer > .close-button-dialog:focus {
  background: var(--cl-green-soft, #eaf9f1) !important;
  color: var(--cl-green-text) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap {
  position: fixed !important;
  inset: 0 !important;
  z-index: 1000004 !important;
  display: block !important;
  width: 100vw !important;
  height: 100vh !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap + .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap + .modal-backdrop.fade,
body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap + .modal-backdrop.in {
  z-index: 1000003 !important;
  background: rgba(20, 24, 32, .45) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-default,
body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-default.in,
body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-default.show {
  z-index: 1000004 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-default.in,
body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-default.show {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 16px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-default > .cl-mobile-btn.close {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal {
  float: none !important;
  margin: 0 auto !important;
  background: transparent;
  border: 0;
  box-shadow: none;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.cover.setting-form-option-date2 {
  overflow: visible;
  border-radius: var(--r-xl, 14px);
  width: 420px !important;
  max-width: 100% !important;
  min-width: 0 !important;
  padding: 0 !important;
  height: auto !important;
  max-height: calc(100dvh - 32px) !important;
  transform: none !important;
  user-select: none !important;
  -webkit-user-select: none !important;
  -moz-user-select: none !important;
  -ms-user-select: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .modal-content .modal-body {
  width: 100% !important;
  height: auto !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .modal-footer {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 14px !important;
  width: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .modal-footer::before,
body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .modal-footer::after {
  display: none !important;
  content: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .modal-footer > .btn {
  width: 100% !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-product-sale-datetime .modal-content .modal-title {
  margin: 0 32px 20px 0 !important;
  padding: 0 !important;
  font-size: var(--fs-2xl, 16px) !important;
  font-weight: 700 !important;
  line-height: 24px !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-product-sale-datetime .modal-footer {
  margin: 20px 0 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .setting-row {
  position: relative !important;
  max-width: 360px !important;
  margin: 0 auto 15px auto !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-product-sale-datetime .setting-row {
  margin: 0 auto 20px auto !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-product-sale-datetime .setting-row:last-child {
  margin: 0 auto 16px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .setting-label {
  width: 57px !important;
  margin: 0 20px 0 0 !important;
  color: #707070 !important;
  font-size: 14px !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-product-sale-datetime .setting-label {
  width: 63px !important;
  font-size: 16px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .sale-calendar-box {
  width: 100% !important;
  margin: -1px auto 0 auto !important;
  border-top: 1px solid var(--cl-line, #eef0f4) !important;
  border-bottom: 1px solid var(--cl-line, #eef0f4) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .sale-calendar-box > .setting-label {
  width: 100% !important;
  height: 44px !important;
  margin: 0 !important;
  padding: 10px 0 !important;
  color: #222428 !important;
  font-size: var(--fs-lg, 14px) !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .sale-calendar-box > .setting-label .datetime-txt {
  margin-left: 8px !important;
  color: rgba(142, 144, 149, 0.9) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-product-sale-datetime .sale-calendar-box > .setting-label .datetime-txt {
  font-size: 14px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .sale-calendar-box.open > .setting-label svg {
  transform: rotate(180deg) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .sale-calendar-box .setting-datetime-input.guide-wrap,
body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .sale-calendar-box .setting-datetime-input #sale-datepicker {
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .sale-calendar-box .setting-datetime-input #sale-datepicker:empty {
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .sale-calendar-box .setting-row .newcheckbox label {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  gap: 6px;
  line-height: 1;
  margin: 0 12px 0 0 !important;
  white-space: nowrap;
  color: var(--ink-2s, #5c616b) !important;
  font-size: var(--fs-md, 13px) !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .sale-calendar-box .setting-row .newcheckbox .newcheckboxSvgRadio {
  flex: none;
  float: none;
  margin: 0;
  width: 18px;
  height: 18px;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .sale-calendar-box .setting-row .newcheckbox .newcheckboxSvgRadio svg {
  fill: var(--border-hover, #d5d9e0);
  pointer-events: none;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .sale-calendar-box .setting-row .newcheckbox .newcheckboxSvgRadio svg.active {
  fill: var(--cl-green, #03C75A);
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .sale-calendar-box .setting-row .newcheckbox .newcheckboxSvgRadio input:focus-visible ~ svg {
  border-radius: var(--r-full, 999px);
  box-shadow: var(--ring, 0 0 0 3px rgba(3, 199, 90, .13));
}


body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .time-interval {
  display: flex !important;
  flex-wrap: wrap !important;
  margin: 10px -6px 0 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .time-interval label {
  width: 25% !important;
  max-width: 85px !important;
  height: 30px !important;
  margin: 0 6px 6px 0 !important;
  border: 1px solid transparent !important;
  background-color: var(--bg-2, #fafbfc) !important;
  color: #bbbbbb !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 30px !important;
  text-align: center !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .sale-calendar-box .time-interval label {
  width: calc(25% - 6px) !important;
  max-width: none !important;
  margin: 0 6px 4px 0 !important;
  background-color: var(--bg-2, #fafbfc) !important;
  color: var(--ink-2s, #5c616b) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .sale-calendar-box .time-interval > input + label:nth-child(8n+8) {
  margin: 0 0 4px 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .sale-calendar-box .time-interval input:disabled + label {
  color: #d1d3d5 !important;
  cursor: default !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .sale-calendar-box .time-interval input:not(:checked):not(:disabled) + label:hover {
  border-color: var(--cl-green, #03C75A) !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .sale-calendar-box .time-interval input:checked + label {
  border-color: var(--cl-green, #03C75A) !important;
  background-color: var(--cl-green, #03C75A) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 #sale-datepicker .Datepickk.inline.d-show .d-calendar {
  padding: 0 0 12px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .Datepickk .d-week {
  margin-bottom: 10px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .Datepickk .d-week,
body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .Datepickk .d-table {
  color: #696c71 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .Datepickk .d-header i {
  margin-top: 5px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .Datepickk .d-header i,
body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .Datepickk .d-header svg {
  width: 14px !important;
  height: 14px !important;
  fill: #b1b3b7 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .Datepickk .d-header p {
  margin: 0 !important;
  color: #404347 !important;
  font-size: var(--fs-2xl, 16px) !important;
  font-weight: 500 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .Datepickk .d-header i#d-previous {
  left: 36px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .Datepickk .d-header i#d-next {
  display: none;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .Datepickk .d-header i#dy-previous {
  left: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .Datepickk .d-header i#dy-next {
  display: none;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .Datepickk .d-header i#dy-previous svg,
body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .Datepickk .d-header i#dy-next svg {
  width: 14px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .Datepickk .d-year {
  display: inline-block !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .Datepickk .d-month {
  position: relative !important;
  display: inline-block !important;
  margin-left: 5px !important;
  padding-right: 15px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .Datepickk .d-month:after {
  content: "" !important;
  position: absolute !important;
  top: 8px !important;
  right: 2px !important;
  width: 6px;
  height: 6px;
  border-right: 1px solid currentColor;
  border-bottom: 1px solid currentColor;
  transform: rotate(45deg);
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .Datepickk .d-month-year-picker {
  top: 61px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .sale-calendar-box #sale-datepicker .Datepickk .d-table input + label {
  position: relative !important;
  width: calc(100% / 7) !important;
  height: 28px !important;
  margin: 1px 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .sale-calendar-box #sale-datepicker .Datepickk .d-table input + label::before,
body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .sale-calendar-box #sale-datepicker .Datepickk .d-table input + label::after {
  content: "" !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  width: 28px !important;
  height: 28px !important;
  border-radius: 50% !important;
  transform: translate(-50%, -50%) !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .sale-calendar-box #sale-datepicker .Datepickk .d-table input + label::before {
  display: block !important;
  border: 1px solid transparent !important;
  background-color: transparent !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .sale-calendar-box #sale-datepicker .Datepickk .d-table input + label::after {
  display: none !important;
  border: 1px solid transparent !important;
  background-color: transparent !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .sale-calendar-box #sale-datepicker .Datepickk .d-table input + label.enabled,
body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .sale-calendar-box #sale-datepicker .Datepickk .d-table input + label.d-hidden,
body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .sale-calendar-box #sale-datepicker .Datepickk .d-table input.active + label,
body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .sale-calendar-box #sale-datepicker .Datepickk .d-table input:checked + label,
body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .sale-calendar-box #sale-datepicker .Datepickk .d-table input:disabled + label {
  border-radius: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .sale-calendar-box #sale-datepicker .Datepickk .d-table input + label.enabled::before,
body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .sale-calendar-box #sale-datepicker .Datepickk .d-table input + label.d-hidden::before {
  display: block !important;
  border-color: transparent !important;
  background-color: #f0f0f0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .sale-calendar-box #sale-datepicker .Datepickk .d-table input:not(:disabled):not(:checked) + label:not(.disabled):not(.d-hidden):hover::before {
  border-color: var(--cl-green, #03C75A) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .sale-calendar-box #sale-datepicker .Datepickk .d-table input + label text {
  position: relative !important;
  z-index: 9 !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .sale-calendar-box #sale-datepicker .Datepickk .d-table input + label.disabled,
body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .sale-calendar-box #sale-datepicker .Datepickk .d-table input + label.next,
body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .sale-calendar-box #sale-datepicker .Datepickk .d-table input + label.prev,
body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .sale-calendar-box #sale-datepicker .Datepickk .d-table input + label.d-hidden,
body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .sale-calendar-box #sale-datepicker .Datepickk .d-table input:disabled + label {
  color: #d1d3d5 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .sale-calendar-box #sale-datepicker .Datepickk .d-table input.active + label {
  border-radius: 50% !important;
  background-color: transparent !important;
  color: inherit !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .sale-calendar-box #sale-datepicker .Datepickk .d-table input:checked + label {
  color: #fff !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .sale-calendar-box #sale-datepicker .Datepickk .d-table input:checked + label:after {
  content: "" !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  display: block !important;
  width: 28px !important;
  height: 28px !important;
  border-radius: 50% !important;
  background-color: var(--cl-green, #03C75A) !important;
  transform: translate(-50%, -50%) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .sale-calendar-box #sale-datepicker .Datepickk .d-table input:disabled + label:hover::before,
body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .sale-calendar-box #sale-datepicker .Datepickk .d-table input + label.disabled:hover::before {
  border-color: transparent !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .sale-calendar-box #sale-datepicker .Datepickk .d-table input:disabled + label:after,
body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .sale-calendar-box #sale-datepicker .Datepickk .d-table input + label.disabled:after,
body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .sale-calendar-box #sale-datepicker .Datepickk .d-table input + label.d-hidden:after {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal .modal-content {
  position: relative;
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  min-height: 0;
  max-height: calc(100dvh - 32px);
  margin: 0;
  padding: 20px;
  overflow-x: hidden;
  overflow-y: auto;
  border: 0;
  border-radius: var(--r-xl, 14px);
  background: var(--surface, #fff);
  box-shadow: var(--shadow-modal, 0 20px 50px rgba(20,24,32,.25));
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .modal-content .modal-body {
  padding: 0;
  margin: 0;
  overflow: visible;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal .modal-content > .close.close-button-dialog {
  position: absolute;
  top: 10px;
  right: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 0;
  border-radius: var(--r-md, 8px);
  background: transparent;
  color: var(--ink-2, #8a8f98);
  opacity: 1;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal .modal-content > .close.close-button-dialog svg {
  display: block;
  width: 14px;
  height: 14px;
  fill: currentColor;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal .modal-content > .close.close-button-dialog:is(:hover, :focus-visible) {
  background: var(--bg-3, #f1f2f5);
  color: var(--ink, #222428);
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .modal-footer {
  border: 0;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .modal-footer > .btn {
  position: static;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  height: 46px;
  padding: 0 12px;
  border: 0;
  border-radius: var(--r-md, 8px);
  background: var(--cl-green, #03C75A);
  color: var(--surface, #fff);
  font-size: var(--fs-lg, 14px);
  font-weight: 600;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .modal-footer > .btn:is(:hover, :focus-visible) {
  background: var(--cl-green-hover, #02b351);
  color: var(--surface, #fff);
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal #sale-datepicker .Datepickk {
  width: 100%;
  min-width: 0;
  font-family: inherit;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal .sale-calendar-box > .setting-label > div {
  min-width: 0;
  flex-wrap: wrap;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal .sale-calendar-box > .setting-label > svg {
  flex: none;
  width: 12px;
  height: 12px;
  margin-left: 8px;
  fill: var(--ink-2, #8a8f98);
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal .Datepickk .d-month-year-picker {
  left: 0;
  width: 100%;
  max-width: none;
  border: 1px solid var(--border, #e5e7eb);
  border-radius: var(--r-md, 8px);
  box-shadow: var(--shadow-menu, 0 14px 40px rgba(20,24,32,.2));
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal .Datepickk .d-month-year-picker .pick-body > div > div:is(.current, :hover) {
  background: var(--green-soft, #f1fbf5);
  color: var(--cl-green-text);
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .sale-calendar-box .setting-row > .setting-label {
  flex: none;
  width: auto !important;
  margin-right: 12px !important;
  font-size: var(--fs-md, 13px) !important;
}


body.cl-dashboard-redesign-page .flat-modal.cl-source-product-sale-datetime-modal-wrap .modal-dialog.cl-source-product-sale-datetime-modal.setting-form-option-date2 .sale-calendar-box .time-interval label {
  border-radius: var(--r-sm, 6px);
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap {
  position: fixed !important;
  inset: 0 !important;
  z-index: 1000004 !important;
  display: block !important;
  width: 100vw !important;
  height: 100vh !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap + .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap + .modal-backdrop.fade,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap + .modal-backdrop.in {
  z-index: 1000003 !important;
  background: rgba(17, 24, 39, .46) !important;
  opacity: 1 !important;
}

body.cl-dashboard-redesign-page:has(.flat-modal.cl-source-etc-time-modal-wrap .modal-default.in) .ui-selectable-helper,
body.cl-dashboard-redesign-page:has(.flat-modal.cl-source-etc-time-modal-wrap .modal-default.show) .ui-selectable-helper {
  z-index: 1000006 !important;
  border-color: rgba(34, 36, 40, .72) !important;
  background: rgba(3, 199, 90, .08) !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-default,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-default.in,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-default.show {
  position: fixed !important;
  inset: 0 !important;
  z-index: 1000004 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  width: 100vw !important;
  height: 100vh !important;
  min-height: 100vh !important;
  margin: 0 !important;
  padding: 24px !important;
  overflow: hidden !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-default.fade,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-default.fade.in,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-default.fade.show {
  -webkit-transition: opacity .2s linear !important;
  -moz-transition: opacity .2s linear !important;
  -o-transition: opacity .2s linear !important;
  transition: opacity .2s linear !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-default > .cl-mobile-btn.close {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-default > .modal-dialog.cl-source-etc-time-modal {
  float: none !important;
  align-self: center !important;
  box-sizing: border-box !important;
  width: 560px !important;
  max-width: calc(100vw - 48px) !important;
  height: auto !important;
  max-height: calc(100vh - 48px) !important;
  margin: 0 auto !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  user-select: none !important;
  -webkit-transform: none !important;
  -ms-transform: none !important;
  -o-transform: none !important;
  transform: none !important;
  -webkit-transition: none !important;
  -moz-transition: none !important;
  -o-transition: none !important;
  transition: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .modal-content {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-height: 0 !important;
  max-height: calc(100vh - 48px) !important;
  margin: 0 !important;
  padding: 28px 28px 24px !important;
  overflow: hidden !important;
  background: #fff !important;
  border: 1px solid var(--cl-border, #e5e7eb) !important;
  border-radius: var(--cl-radius-lg, 14px) !important;
  box-shadow: 0 24px 64px rgba(20, 24, 32, .22) !important;
  color: var(--cl-text, #222428) !important;
  font-family: var(--cl-source-font) !important;
  letter-spacing: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .modal-body {
  flex: 1 1 auto !important;
  display: flex !important;
  flex-direction: column !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 0 !important;
  height: auto !important;
  max-height: calc(100vh - 188px) !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow-x: hidden !important;
  overflow-y: hidden !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .modal-title {
  margin: 0 44px 24px 0 !important;
  padding: 0 !important;
  color: var(--cl-text, #222428) !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  line-height: 24px !important;
  letter-spacing: 0 !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .modal-content > .close.close-button-dialog {
  position: absolute !important;
  top: 16px !important;
  right: 16px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  min-height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub, #696c71) !important;
  font-size: 0 !important;
  line-height: 1 !important;
  opacity: 1 !important;
  text-shadow: none !important;
  transition: background-color .18s ease, color .18s ease, transform .18s cubic-bezier(.34, 1.56, .64, 1) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .modal-content > .close.close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .modal-content > .close.close-button-dialog:focus {
  background: #f1f2f5 !important;
  color: var(--cl-text, #222428) !important;
  outline: 0 !important;
  transform: rotate(90deg) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .modal-content > .close.close-button-dialog svg {
  display: block !important;
  width: 9px !important;
  height: 9px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .guide-wrap {
  flex: 1 1 auto !important;
  display: flex !important;
  flex-direction: column !important;
  box-sizing: border-box !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .setting-row {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 0 18px !important;
  padding: 0 !important;
  color: var(--cl-text, #222428) !important;
  font-size: 13px !important;
  letter-spacing: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .guide-wrap > .setting-row:first-child {
  flex: 0 0 auto !important;
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 12px 18px !important;
  margin-bottom: 0 !important;
  padding-bottom: 18px !important;
  border-bottom: 1px solid var(--cl-line, #eef0f4) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .time-select-toolbar {
  flex: 0 0 auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-height: 44px !important;
  margin: 0 !important;
  padding: 12px 0 10px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .time-list-scroll {
  flex: 1 1 auto !important;
  box-sizing: border-box !important;
  width: calc(100% + 9px) !important;
  min-height: 0 !important;
  max-height: calc(100vh - 350px) !important;
  margin: 0 -9px 0 0 !important;
  padding: 0 9px 0 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .guide-wrap > .setting-row:not(:first-child),
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .time-list-scroll .setting-row {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 58px minmax(0, 1fr) !important;
  column-gap: 14px !important;
  align-items: start !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .setting-row.am {
  margin-top: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .setting-label {
  flex: 0 0 64px !important;
  width: 64px !important;
  min-width: 64px !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text, #222428) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 34px !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .guide-wrap > .setting-row:not(:first-child) > .setting-label,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .time-list-scroll .setting-row > .setting-label {
  grid-column: 1 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .newcheckbox {
  float: none !important;
  display: inline-flex !important;
  align-items: center !important;
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .newcheckbox label,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal label.all-time {
  float: none !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  width: auto !important;
  min-width: 0 !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text-sub, #696c71) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 30px !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .newcheckbox label span,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal label.all-time span {
  display: inline-block !important;
  color: inherit !important;
  line-height: 18px !important;
  vertical-align: middle !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .newcheckboxSvg,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .newcheckboxSvgRadio {
  position: relative !important;
  float: none !important;
  flex: 0 0 18px !important;
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .newcheckboxSvg input,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .newcheckboxSvgRadio input {
  position: absolute !important;
  inset: 0 !important;
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
  opacity: .00000001 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .newcheckboxSvg svg,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .newcheckboxSvgRadio svg {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  display: block !important;
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
  fill: #d1d3d5 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .newcheckboxSvg svg.active,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .newcheckboxSvgRadio svg.active {
  fill: var(--cl-green, #03C75A) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .newcheckbox label:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal label.all-time:hover {
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .time-interval {
  grid-column: 2 !important;
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 6px !important;
  box-sizing: border-box !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .time-interval input {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .time-interval label {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 34px !important;
  margin: 0 !important;
  padding: 0 8px !important;
  overflow: hidden !important;
  background: #f8fafb !important;
  border: 1px solid var(--cl-border, #e5e7eb) !important;
  border-radius: 8px !important;
  color: var(--cl-text-sub, #696c71) !important;
  cursor: pointer !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 18px !important;
  text-align: center !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .time-interval label.hide {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .time-interval input:not(:checked):not(:disabled) + label:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .time-interval input:not(:checked):not(:disabled) + label:focus {
  background: var(--cl-green-soft, #eaf9f1) !important;
  border-color: var(--cl-green-line, #cdefdd) !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .time-interval input:checked + label,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .time-interval label.ui-selected {
  background: var(--cl-green, #03C75A) !important;
  border-color: var(--cl-green, #03C75A) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .time-interval input:disabled + label {
  background: #f8fafb !important;
  border-color: transparent !important;
  color: var(--cl-text-muted, #b1b3b7) !important;
  cursor: default !important;
  opacity: .58 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal label.all-time {
  position: static !important;
  top: auto !important;
  right: auto !important;
  height: 30px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal label.all-time > .newcheckbox {
  position: relative !important;
  flex: 0 0 18px !important;
  width: 18px !important;
  min-width: 18px !important;
  height: 18px !important;
  min-height: 18px !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal label.all-time > .newcheckbox input[type="checkbox"] {
  position: absolute !important;
  inset: 0 !important;
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
  opacity: .00000001 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal label.all-time > .newcheckbox svg {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  display: block !important;
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
  fill: #d1d3d5 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal label.all-time > .newcheckbox svg.active {
  fill: var(--cl-green, #03C75A) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal label.all-time:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal label.all-time:focus-within {
  border-color: transparent !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .modal-footer {
  flex: 0 0 auto !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-auto-rows: 46px !important;
  align-items: center !important;
  justify-items: stretch !important;
  gap: 14px !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 0 !important;
  height: auto !important;
  margin: 22px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .modal-footer::before,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .modal-footer::after {
  display: none !important;
  content: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .modal-footer > .btn,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .modal-footer > button {
  position: static !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  float: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  align-self: stretch !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 46px !important;
  min-height: 46px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  transform: none !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 20px !important;
  text-align: center !important;
  vertical-align: middle !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .modal-footer > .ok-button-dialog {
  order: 1 !important;
  background: var(--cl-green, #03C75A) !important;
  border: 1px solid var(--cl-green, #03C75A) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: #fff !important;
  text-shadow: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .modal-footer > .ok-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .modal-footer > .ok-button-dialog:focus {
  background: var(--cl-green-hover, #02b351) !important;
  border-color: var(--cl-green-hover, #02b351) !important;
  color: #fff !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .modal-footer > .close-button-dialog {
  order: 2 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub, #696c71) !important;
  text-shadow: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .modal-footer > .close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .modal-footer > .close-button-dialog:focus {
  background: var(--cl-green-soft, #eaf9f1) !important;
  color: var(--cl-green-text) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .time-list-scroll {
  scrollbar-width: thin !important;
  scrollbar-color: #d1d3d5 transparent !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .modal-body::-webkit-scrollbar,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .time-list-scroll::-webkit-scrollbar {
  width: 9px !important;
  height: 9px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .modal-body::-webkit-scrollbar-thumb,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .time-list-scroll::-webkit-scrollbar-thumb {
  border: 2px solid transparent !important;
  border-radius: 6px !important;
  background: #d1d3d5 !important;
  background-clip: padding-box !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .modal-body::-webkit-scrollbar-track,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .time-list-scroll::-webkit-scrollbar-track {
  background: transparent !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .modal-body::-webkit-scrollbar-button,
body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .time-list-scroll::-webkit-scrollbar-button {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
}

body.cl-dashboard-redesign-page #toast {
  position: fixed;
  left: 50%;
  top: 50%;
  z-index: 3000;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  padding: 12px 20px;
  border-radius: 10px;
  background: var(--cl-green, #03C75A);
  color: #fff;
  box-shadow: 0 14px 40px rgba(3, 199, 90, .42);
  font-size: 14px;
  font-weight: 600;
  line-height: 0;
  white-space: nowrap;
  word-break: keep-all;
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, -50%) scale(.94);
  transition: opacity .3s ease, transform .3s cubic-bezier(.34, 1.4, .5, 1);
}

body.cl-dashboard-redesign-page #toast.show {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
}

body.cl-dashboard-redesign-page #toast.warn {
  background: #4a515b;
  box-shadow: 0 14px 40px rgba(35, 40, 48, .34);
}

body.cl-dashboard-redesign-page #toast svg {
  display: block;
  width: 18px;
  height: 18px;
  flex: none;
  align-self: center;
}

body.cl-dashboard-redesign-page #toast .cl-marketing-toast-line {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  flex-wrap: nowrap;
  height: 18px;
  line-height: 18px;
  white-space: nowrap;
  word-break: keep-all;
}

body.cl-dashboard-redesign-page #toast .cl-marketing-toast-text {
  display: block;
  height: 18px;
  line-height: 18px;
  white-space: nowrap;
  word-break: keep-all;
}

/* 리디자인 팝업 공통 상단 닫기 버튼: v2 발신내역 모달 기준 */
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog .modal-content > .close,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog .modal-content > button.close,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog .modal-content > .modal-close,
body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .modal-content > .close.close-button-dialog,
body.cl-source-card-add-modal-open #billingCardModalRoot .card-add-modal-default .modal-content > .modal-close,
body.cl-dashboard-redesign-page .cl-source-social-guide-modal .modal-dialog > .modal-content > .close,
body.cl-dashboard-redesign-page .cl-source-uadmin-modal .modal-content > .close,
body.cl-dashboard-redesign-page .cl-basic-site-screen-close {
  position: absolute !important;
  top: 20px !important;
  right: 22px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  min-width: 30px !important;
  max-width: 30px !important;
  height: 30px !important;
  min-height: 30px !important;
  max-height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text-muted, #b4b8bf) !important;
  cursor: pointer !important;
  font-size: 0 !important;
  line-height: 0 !important;
  opacity: 1 !important;
  text-decoration: none !important;
  text-shadow: none !important;
  transform: none !important;
  -webkit-appearance: none !important;
  appearance: none !important;
  transition: color .15s, background .15s, transform .18s cubic-bezier(.34, 1.56, .64, 1) !important;
  z-index: 3 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog .modal-content > .close:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog .modal-content > .close:focus,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog .modal-content > button.close:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog .modal-content > button.close:focus,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog .modal-content > .modal-close:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog .modal-content > .modal-close:focus,
body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .modal-content > .close.close-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .modal-content > .close.close-button-dialog:focus,
body.cl-source-card-add-modal-open #billingCardModalRoot .card-add-modal-default .modal-content > .modal-close:hover,
body.cl-source-card-add-modal-open #billingCardModalRoot .card-add-modal-default .modal-content > .modal-close:focus,
body.cl-dashboard-redesign-page .cl-source-social-guide-modal .modal-dialog > .modal-content > .close:hover,
body.cl-dashboard-redesign-page .cl-source-social-guide-modal .modal-dialog > .modal-content > .close:focus,
body.cl-dashboard-redesign-page .cl-source-uadmin-modal .modal-content > .close:hover,
body.cl-dashboard-redesign-page .cl-source-uadmin-modal .modal-content > .close:focus,
body.cl-dashboard-redesign-page .cl-basic-site-screen-close:hover,
body.cl-dashboard-redesign-page .cl-basic-site-screen-close:focus {
  background: #f1f2f5 !important;
  color: var(--cl-text, #222428) !important;
  outline: 0 !important;
  transform: rotate(90deg) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog .modal-content > .close > span,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog .modal-content > .close svg,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog .modal-content > .close img,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog .modal-content > .modal-close > span,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog .modal-content > .modal-close svg,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog .modal-content > .modal-close img,
body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .modal-content > .close.close-button-dialog > span,
body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .modal-content > .close.close-button-dialog svg,
body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .modal-content > .close.close-button-dialog img,
body.cl-source-card-add-modal-open #billingCardModalRoot .card-add-modal-default .modal-content > .modal-close > span,
body.cl-source-card-add-modal-open #billingCardModalRoot .card-add-modal-default .modal-content > .modal-close svg,
body.cl-source-card-add-modal-open #billingCardModalRoot .card-add-modal-default .modal-content > .modal-close img,
body.cl-dashboard-redesign-page .cl-source-social-guide-modal .modal-dialog > .modal-content > .close > span,
body.cl-dashboard-redesign-page .cl-source-social-guide-modal .modal-dialog > .modal-content > .close svg,
body.cl-dashboard-redesign-page .cl-source-social-guide-modal .modal-dialog > .modal-content > .close img,
body.cl-dashboard-redesign-page .cl-source-uadmin-modal .modal-content > .close > span,
body.cl-dashboard-redesign-page .cl-source-uadmin-modal .modal-content > .close svg,
body.cl-dashboard-redesign-page .cl-source-uadmin-modal .modal-content > .close img,
body.cl-dashboard-redesign-page .cl-basic-site-screen-close > span,
body.cl-dashboard-redesign-page .cl-basic-site-screen-close svg,
body.cl-dashboard-redesign-page .cl-basic-site-screen-close img {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog .modal-content > .close::before,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog .modal-content > .close::after,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog .modal-content > button.close::before,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog .modal-content > button.close::after,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog .modal-content > .modal-close::before,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog .modal-content > .modal-close::after,
body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .modal-content > .close.close-button-dialog::before,
body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .modal-content > .close.close-button-dialog::after,
body.cl-source-card-add-modal-open #billingCardModalRoot .card-add-modal-default .modal-content > .modal-close::before,
body.cl-source-card-add-modal-open #billingCardModalRoot .card-add-modal-default .modal-content > .modal-close::after,
body.cl-dashboard-redesign-page .cl-source-social-guide-modal .modal-dialog > .modal-content > .close::before,
body.cl-dashboard-redesign-page .cl-source-social-guide-modal .modal-dialog > .modal-content > .close::after,
body.cl-dashboard-redesign-page .cl-source-uadmin-modal .modal-content > .close::before,
body.cl-dashboard-redesign-page .cl-source-uadmin-modal .modal-content > .close::after,
body.cl-dashboard-redesign-page .cl-basic-site-screen-close::before,
body.cl-dashboard-redesign-page .cl-basic-site-screen-close::after {
  content: "" !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  display: block !important;
  width: 15px !important;
  height: 1.7px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: currentColor !important;
  border: 0 !important;
  border-radius: 999px !important;
  opacity: 1 !important;
  pointer-events: none !important;
  transform-origin: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog .modal-content > .close::before,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog .modal-content > button.close::before,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog .modal-content > .modal-close::before,
body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .modal-content > .close.close-button-dialog::before,
body.cl-source-card-add-modal-open #billingCardModalRoot .card-add-modal-default .modal-content > .modal-close::before,
body.cl-dashboard-redesign-page .cl-source-social-guide-modal .modal-dialog > .modal-content > .close::before,
body.cl-dashboard-redesign-page .cl-source-uadmin-modal .modal-content > .close::before,
body.cl-dashboard-redesign-page .cl-basic-site-screen-close::before {
  transform: translate(-50%, -50%) rotate(45deg) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog .modal-content > .close::after,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog .modal-content > button.close::after,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog .modal-content > .modal-close::after,
body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .modal-content > .close.close-button-dialog::after,
body.cl-source-card-add-modal-open #billingCardModalRoot .card-add-modal-default .modal-content > .modal-close::after,
body.cl-dashboard-redesign-page .cl-source-social-guide-modal .modal-dialog > .modal-content > .close::after,
body.cl-dashboard-redesign-page .cl-source-uadmin-modal .modal-content > .close::after,
body.cl-dashboard-redesign-page .cl-basic-site-screen-close::after {
  transform: translate(-50%, -50%) rotate(-45deg) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog .modal-content > .close.hide,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog .modal-content > button.close.hide,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog .modal-content > .modal-close.hide,
body.cl-dashboard-redesign-page .flat-modal.cl-source-screen-upload-modal-wrap .modal-dialog.cl-screenUpload .modal-content > .close.close-button-dialog.hide,
body.cl-source-card-add-modal-open #billingCardModalRoot .card-add-modal-default .modal-content > .modal-close.hide,
body.cl-dashboard-redesign-page .cl-source-social-guide-modal .modal-dialog > .modal-content > .close.hide,
body.cl-dashboard-redesign-page .cl-source-uadmin-modal .modal-content > .close.hide,
body.cl-dashboard-redesign-page .cl-basic-site-screen-close.hide {
  display: none !important;
}

@media (max-width: 640px) {
  body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-default,
  body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-default.in,
  body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-default.show {
    padding: 16px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-default > .modal-dialog.cl-source-etc-time-modal {
    max-width: calc(100vw - 32px) !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .modal-content {
    max-height: calc(100vh - 32px) !important;
    padding: 24px 20px 20px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .guide-wrap > .setting-row:not(:first-child),
  body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .time-list-scroll .setting-row {
    grid-template-columns: 52px minmax(0, 1fr) !important;
    column-gap: 10px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .setting-label {
    flex-basis: 58px !important;
    width: 58px !important;
    min-width: 58px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-source-etc-time-modal-wrap .modal-dialog.cl-source-etc-time-modal .time-interval {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

/* v2 marketing guide popover */
body.cl-dashboard-redesign-page .popover.cl-source-help-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover),
body.cl-redesign-scroll-page .popover.cl-source-help-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) {
  box-sizing: border-box !important;
  width: max-content !important;
  min-width: 0 !important;
  max-width: min(300px, calc(100vw - 32px)) !important;
  padding: 0 !important;
  background: #fff !important;
  border: 1px solid var(--cl-border, #E5E7EB) !important;
  border-radius: 10px !important;
  box-shadow: 0 8px 24px rgba(20, 24, 32, .14) !important;
  color: var(--cl-text-sub, #8A8F98) !important;
  font-family: var(--cl-source-font) !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  line-height: 1.55 !important;
  letter-spacing: 0 !important;
  text-align: left !important;
  white-space: normal !important;
  word-break: keep-all !important;
  pointer-events: auto !important;
  z-index: 10050 !important;
}

body.cl-dashboard-redesign-page .popover.cl-source-help-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) .popover-title,
body.cl-redesign-scroll-page .popover.cl-source-help-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) .popover-title {
  display: none !important;
}

body.cl-dashboard-redesign-page .popover.cl-source-help-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) .popover-content,
body.cl-redesign-scroll-page .popover.cl-source-help-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) .popover-content {
  box-sizing: border-box !important;
  padding: 14px 16px 13px !important;
  color: var(--cl-text-sub, #8A8F98) !important;
  font-family: inherit !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  line-height: 1.55 !important;
  letter-spacing: 0 !important;
  text-align: left !important;
  white-space: normal !important;
  word-break: keep-all !important;
}

body.cl-dashboard-redesign-page .popover.cl-source-help-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) .popover-content :where(p, div),
body.cl-redesign-scroll-page .popover.cl-source-help-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) .popover-content :where(p, div) {
  margin-top: 0 !important;
}

body.cl-dashboard-redesign-page .popover.cl-source-help-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) .popover-content :where(p, div):not(:last-child),
body.cl-redesign-scroll-page .popover.cl-source-help-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) .popover-content :where(p, div):not(:last-child) {
  margin-bottom: 9px !important;
}

/* body로 이동한 알림 툴팁에서도 SVG 글머리와 줄바꿈 들여쓰기를 유지한다. */
body.cl-dashboard-redesign-page .popover.cl-notification-help-popover .popover-content > div:has(> svg) {
  position: relative;
  padding-left: 11px;
}

body.cl-dashboard-redesign-page .popover.cl-notification-help-popover .popover-content > div > svg {
  position: absolute;
  display: block;
  top: 8px;
  left: 0;
  width: 3px;
  height: 3px;
  margin: 0;
  fill: #b9bfc7;
  transform: none;
}

body.cl-dashboard-redesign-page .popover.cl-notification-point-popover .popover-content .br-tag-height {
  display: none;
}

body.cl-dashboard-redesign-page .popover.cl-source-help-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) .popover-content :where(.ht-t, .title),
body.cl-redesign-scroll-page .popover.cl-source-help-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) .popover-content :where(.ht-t, .title) {
  color: var(--cl-text, #222428) !important;
  display: block !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  line-height: 1.45 !important;
  margin: 0 0 9px !important;
}

body.cl-dashboard-redesign-page .popover.cl-source-help-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) .popover-content :where(.ht-b, .desc),
body.cl-redesign-scroll-page .popover.cl-source-help-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) .popover-content :where(.ht-b, .desc) {
  color: var(--cl-text-sub, #8A8F98) !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  line-height: 1.65 !important;
}

body.cl-dashboard-redesign-page .popover.cl-source-help-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) .popover-content ul,
body.cl-redesign-scroll-page .popover.cl-source-help-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) .popover-content ul {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

body.cl-dashboard-redesign-page .popover.cl-source-help-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) .popover-content li,
body.cl-redesign-scroll-page .popover.cl-source-help-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) .popover-content li {
  /* 기존 li의 disc 표시와 리디자인 ::before 글머리가 중복되지 않도록 한다. */
  list-style: none !important;
  position: relative !important;
  margin: 0 0 9px !important;
  padding: 0 0 0 11px !important;
  color: var(--cl-text-sub, #8A8F98) !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  line-height: 1.65 !important;
}

body.cl-dashboard-redesign-page .popover.cl-source-help-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) .popover-content li:last-child,
body.cl-redesign-scroll-page .popover.cl-source-help-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) .popover-content li:last-child {
  margin-bottom: 0 !important;
}

body.cl-dashboard-redesign-page .popover.cl-source-help-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) .popover-content li::before,
body.cl-redesign-scroll-page .popover.cl-source-help-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) .popover-content li::before {
  content: "" !important;
  position: absolute !important;
  top: 8px !important;
  left: 0 !important;
  width: 3px !important;
  height: 3px !important;
  border-radius: 50% !important;
  background: #B9BFC7 !important;
}

body.cl-dashboard-redesign-page .popover.cl-source-help-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) .popover-content li.title,
body.cl-redesign-scroll-page .popover.cl-source-help-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) .popover-content li.title {
  padding-left: 0 !important;
  color: var(--cl-text, #222428) !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page .popover.cl-source-help-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) .popover-content li.title::before,
body.cl-redesign-scroll-page .popover.cl-source-help-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) .popover-content li.title::before {
  display: none !important;
}

body.cl-dashboard-redesign-page .popover.cl-source-help-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) .popover-content :where(b, strong),
body.cl-redesign-scroll-page .popover.cl-source-help-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) .popover-content :where(b, strong) {
  color: var(--cl-text, #222428) !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page .popover.cl-source-help-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) .popover-content a,
body.cl-redesign-scroll-page .popover.cl-source-help-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) .popover-content a {
  color: var(--cl-green-text) !important;
  font-weight: 700 !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
  pointer-events: auto !important;
}

body.cl-dashboard-redesign-page .popover.cl-source-help-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) .popover-content .tip-links,
body.cl-redesign-scroll-page .popover.cl-source-help-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) .popover-content .tip-links {
  display: block !important;
  margin-top: 9px !important;
}

body.cl-dashboard-redesign-page .popover.cl-source-help-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) .popover-content .ht-b > div,
body.cl-redesign-scroll-page .popover.cl-source-help-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) .popover-content .ht-b > div {
  margin-bottom: 9px !important;
}

body.cl-dashboard-redesign-page .popover.cl-source-help-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) .popover-content .ht-b > div:last-child,
body.cl-redesign-scroll-page .popover.cl-source-help-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) .popover-content .ht-b > div:last-child {
  margin-bottom: 0 !important;
}

body.cl-dashboard-redesign-page .popover.cl-source-help-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) .popover-content .ht-b .mb-20,
body.cl-redesign-scroll-page .popover.cl-source-help-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) .popover-content .ht-b .mb-20 {
  margin-bottom: 12px !important;
}

body.cl-dashboard-redesign-page .popover.cl-source-help-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) .popover-content li div,
body.cl-redesign-scroll-page .popover.cl-source-help-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) .popover-content li div {
  margin-top: 5px !important;
  color: var(--cl-text-muted, #B4B8BF) !important;
}

body.cl-dashboard-redesign-page .popover.cl-source-help-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) > .arrow,
body.cl-redesign-scroll-page .popover.cl-source-help-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) > .arrow {
  display: block !important;
  box-sizing: border-box !important;
  width: 11px !important;
  height: 11px !important;
  margin: 0 !important;
  background: #fff !important;
  border: 0 !important;
  transform: rotate(45deg) !important;
}

body.cl-dashboard-redesign-page .popover.cl-source-help-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) > .arrow::before,
body.cl-dashboard-redesign-page .popover.cl-source-help-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) > .arrow::after,
body.cl-redesign-scroll-page .popover.cl-source-help-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) > .arrow::before,
body.cl-redesign-scroll-page .popover.cl-source-help-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) > .arrow::after {
  display: none !important;
  content: none !important;
  border: 0 !important;
}

body.cl-dashboard-redesign-page .popover.cl-source-help-popover.top:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) > .arrow,
body.cl-redesign-scroll-page .popover.cl-source-help-popover.top:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) > .arrow {
  bottom: -6px !important;
  margin-left: -5.5px !important;
  border-right: 1px solid var(--cl-border, #E5E7EB) !important;
  border-bottom: 1px solid var(--cl-border, #E5E7EB) !important;
}

body.cl-dashboard-redesign-page .popover.cl-source-help-popover.bottom:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) > .arrow,
body.cl-redesign-scroll-page .popover.cl-source-help-popover.bottom:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) > .arrow {
  top: -6px !important;
  margin-left: -5.5px !important;
  border-top: 1px solid var(--cl-border, #E5E7EB) !important;
  border-left: 1px solid var(--cl-border, #E5E7EB) !important;
}

body.cl-dashboard-redesign-page .popover.cl-source-help-popover.left:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) > .arrow,
body.cl-redesign-scroll-page .popover.cl-source-help-popover.left:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) > .arrow {
  right: -6px !important;
  margin-top: -5.5px !important;
  border-top: 1px solid var(--cl-border, #E5E7EB) !important;
  border-right: 1px solid var(--cl-border, #E5E7EB) !important;
}

body.cl-dashboard-redesign-page .popover.cl-source-help-popover.right:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) > .arrow,
body.cl-redesign-scroll-page .popover.cl-source-help-popover.right:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) > .arrow {
  left: -6px !important;
  margin-top: -5.5px !important;
  border-bottom: 1px solid var(--cl-border, #E5E7EB) !important;
  border-left: 1px solid var(--cl-border, #E5E7EB) !important;
}

body.cl-dashboard-redesign-page .cl-source-sidebar .cl-source-site-select-row > .cl-source-site-add.site-create-btn:not(.site-list-wrap),
body.cl-redesign-scroll-page .cl-source-sidebar .cl-source-site-select-row > .cl-source-site-add.site-create-btn:not(.site-list-wrap) {
  box-sizing: border-box;
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  min-height: 38px;
  margin: 0;
  padding: 0;
  float: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  border: 1px solid var(--cl-border, #E5E7EB);
  border-radius: var(--cl-radius-sm, 6px);
  color: var(--cl-green, #03C75A);
  opacity: 1;
  box-shadow: none;
  transform: none;
}

body.cl-dashboard-redesign-page .cl-source-sidebar .cl-source-site-select-row > .cl-source-site-add.site-create-btn:not(.site-list-wrap) svg,
body.cl-redesign-scroll-page .cl-source-sidebar .cl-source-site-select-row > .cl-source-site-add.site-create-btn:not(.site-list-wrap) svg {
  position: relative;
  flex: none;
  shape-rendering: geometricPrecision;
  inset: auto;
  z-index: 3;
  width: 16px;
  height: 16px;
  fill: none;
  color: currentColor;
  transform: none;
}

body.cl-dashboard-redesign-page .cl-source-sidebar .cl-source-site-select-row > .cl-source-site-add.site-create-btn:not(.site-list-wrap) svg rect,
body.cl-redesign-scroll-page .cl-source-sidebar .cl-source-site-select-row > .cl-source-site-add.site-create-btn:not(.site-list-wrap) svg rect {
  fill: currentColor;
  stroke: currentColor;
}

body.cl-dashboard-redesign-page .cl-source-sidebar .cl-source-site-select-row > .cl-source-site-add.site-create-btn:not(.site-list-wrap):hover,
body.cl-dashboard-redesign-page .cl-source-sidebar .cl-source-site-select-row > .cl-source-site-add.site-create-btn:not(.site-list-wrap):focus,
body.cl-redesign-scroll-page .cl-source-sidebar .cl-source-site-select-row > .cl-source-site-add.site-create-btn:not(.site-list-wrap):hover,
body.cl-redesign-scroll-page .cl-source-sidebar .cl-source-site-select-row > .cl-source-site-add.site-create-btn:not(.site-list-wrap):focus {
  background: #F1FBF5;
  border-color: #B7E7C9;
  color: var(--cl-green, #03C75A);
  opacity: 1;
  box-shadow: none;
  outline: 0;
  transform: none;
}

body.cl-dashboard-redesign-page .cl-source-sidebar .cl-source-site-select-row > .cl-source-site-add.site-create-btn:not(.site-list-wrap):is(.ss_user_noActive, .member_disabled, .disabled, :disabled),
body.cl-dashboard-redesign-page .cl-source-sidebar .cl-source-site-select-row > .cl-source-site-add.site-create-btn:not(.site-list-wrap):is(.ss_user_noActive, .member_disabled, .disabled, :disabled):hover,
body.cl-dashboard-redesign-page .cl-source-sidebar .cl-source-site-select-row > .cl-source-site-add.site-create-btn:not(.site-list-wrap):is(.ss_user_noActive, .member_disabled, .disabled, :disabled):focus,
body.cl-dashboard-redesign-page .cl-source-sidebar .cl-source-site-select-row > .cl-source-site-add.site-create-btn:not(.site-list-wrap):is(.ss_user_noActive, .member_disabled, .disabled, :disabled):active,
body.cl-redesign-scroll-page .cl-source-sidebar .cl-source-site-select-row > .cl-source-site-add.site-create-btn:not(.site-list-wrap):is(.ss_user_noActive, .member_disabled, .disabled, :disabled),
body.cl-redesign-scroll-page .cl-source-sidebar .cl-source-site-select-row > .cl-source-site-add.site-create-btn:not(.site-list-wrap):is(.ss_user_noActive, .member_disabled, .disabled, :disabled):hover,
body.cl-redesign-scroll-page .cl-source-sidebar .cl-source-site-select-row > .cl-source-site-add.site-create-btn:not(.site-list-wrap):is(.ss_user_noActive, .member_disabled, .disabled, :disabled):focus,
body.cl-redesign-scroll-page .cl-source-sidebar .cl-source-site-select-row > .cl-source-site-add.site-create-btn:not(.site-list-wrap):is(.ss_user_noActive, .member_disabled, .disabled, :disabled):active {
  background: #F7F8FA !important;
  border: 1px solid var(--cl-border, #E5E7EB) !important;
  color: var(--cl-text-muted, #B4B8BF) !important;
  cursor: default !important;
  opacity: 1 !important;
  pointer-events: none !important;
  box-shadow: none !important;
  outline: 0 !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-source-sidebar .cl-source-site-select-row > .cl-source-site-add.site-create-btn:not(.site-list-wrap):is(.ss_user_noActive, .member_disabled, .disabled, :disabled) svg,
body.cl-dashboard-redesign-page .cl-source-sidebar .cl-source-site-select-row > .cl-source-site-add.site-create-btn:not(.site-list-wrap):is(.ss_user_noActive, .member_disabled, .disabled, :disabled) svg rect,
body.cl-redesign-scroll-page .cl-source-sidebar .cl-source-site-select-row > .cl-source-site-add.site-create-btn:not(.site-list-wrap):is(.ss_user_noActive, .member_disabled, .disabled, :disabled) svg,
body.cl-redesign-scroll-page .cl-source-sidebar .cl-source-site-select-row > .cl-source-site-add.site-create-btn:not(.site-list-wrap):is(.ss_user_noActive, .member_disabled, .disabled, :disabled) svg rect {
  fill: currentColor !important;
  stroke: currentColor !important;
  color: var(--cl-text-muted, #B4B8BF) !important;
}

body.cl-dashboard-redesign-page .cl-source-site-mgmt-head > .cl-source-site-mgmt-add:is(.ss_user_noActive, .member_disabled, .disabled, :disabled),
body.cl-dashboard-redesign-page .cl-source-site-mgmt-head > .cl-source-site-mgmt-add:is(.ss_user_noActive, .member_disabled, .disabled, :disabled):hover,
body.cl-dashboard-redesign-page .cl-source-site-mgmt-head > .cl-source-site-mgmt-add:is(.ss_user_noActive, .member_disabled, .disabled, :disabled):focus,
body.cl-dashboard-redesign-page .cl-source-site-mgmt-head > .cl-source-site-mgmt-add:is(.ss_user_noActive, .member_disabled, .disabled, :disabled):active,
body.cl-redesign-scroll-page .cl-source-site-mgmt-head > .cl-source-site-mgmt-add:is(.ss_user_noActive, .member_disabled, .disabled, :disabled),
body.cl-redesign-scroll-page .cl-source-site-mgmt-head > .cl-source-site-mgmt-add:is(.ss_user_noActive, .member_disabled, .disabled, :disabled):hover,
body.cl-redesign-scroll-page .cl-source-site-mgmt-head > .cl-source-site-mgmt-add:is(.ss_user_noActive, .member_disabled, .disabled, :disabled):focus,
body.cl-redesign-scroll-page .cl-source-site-mgmt-head > .cl-source-site-mgmt-add:is(.ss_user_noActive, .member_disabled, .disabled, :disabled):active {
  background: #F7F8FA !important;
  border: 1px solid var(--cl-border, #E5E7EB) !important;
  color: var(--cl-text-muted, #B4B8BF) !important;
  cursor: default !important;
  opacity: 1 !important;
  pointer-events: none !important;
  box-shadow: none !important;
  outline: 0 !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-source-site-mgmt-head > .cl-source-site-mgmt-add:is(.ss_user_noActive, .member_disabled, .disabled, :disabled) svg,
body.cl-dashboard-redesign-page .cl-source-site-mgmt-head > .cl-source-site-mgmt-add:is(.ss_user_noActive, .member_disabled, .disabled, :disabled) svg rect,
body.cl-redesign-scroll-page .cl-source-site-mgmt-head > .cl-source-site-mgmt-add:is(.ss_user_noActive, .member_disabled, .disabled, :disabled) svg,
body.cl-redesign-scroll-page .cl-source-site-mgmt-head > .cl-source-site-mgmt-add:is(.ss_user_noActive, .member_disabled, .disabled, :disabled) svg rect {
  fill: currentColor !important;
  stroke: currentColor !important;
  color: var(--cl-text-muted, #B4B8BF) !important;
}

/* Terms and privacy policy pages */
body.cl-dashboard-redesign-page:has(.cl-policy-page) {
  min-width: 0 !important;
  padding-top: 0 !important;
  background: #F4F5F9 !important;
  color: #222428 !important;
  font-family: var(--cl-source-font) !important;
}

body.cl-dashboard-redesign-page .cl-policy-page,
body.cl-dashboard-redesign-page .cl-policy-page * {
  box-sizing: border-box;
  letter-spacing: 0;
}

body.cl-dashboard-redesign-page .cl-policy-page {
  min-height: calc(100vh - 56px);
  padding: 60px 24px 96px;
  background: #F4F5F9;
}

body.cl-dashboard-redesign-page .cl-policy-shell {
  width: min(1040px, 100%);
  margin: 0 auto;
}

body.cl-dashboard-redesign-page .cl-policy-heading {
  margin: 0 0 32px;
  text-align: center;
}

body.cl-dashboard-redesign-page .cl-policy-kicker {
  margin: 0 0 12px;
  color: var(--cl-green-text);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.4;
}

body.cl-dashboard-redesign-page .cl-policy-heading h1 {
  margin: 0;
  color: #222428;
  font-size: 34px;
  font-weight: 750;
  line-height: 1.3;
}

body.cl-dashboard-redesign-page .cl-policy-heading > p:not(.cl-policy-kicker) {
  margin: 12px 0 0;
  color: #737982;
  font-size: 15px;
  line-height: 1.6;
}

body.cl-dashboard-redesign-page .cl-policy-tabs {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-top: 30px;
  padding: 4px;
  background: #E9EBEF;
  border-radius: 8px;
}

body.cl-dashboard-redesign-page .cl-policy-tabs a,
body.cl-dashboard-redesign-page .cl-policy-tabs a:hover,
body.cl-dashboard-redesign-page .cl-policy-tabs a:focus {
  min-width: 132px;
  padding: 10px 18px;
  border-radius: 6px;
  color: #737982;
  font-size: 14px;
  font-weight: 650;
  line-height: 20px;
  text-align: center;
  text-decoration: none;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .cl-policy-tabs a:hover,
body.cl-dashboard-redesign-page .cl-policy-tabs a:focus {
  color: #222428;
  outline: 0;
}

body.cl-dashboard-redesign-page .cl-policy-tabs a.active {
  background: #fff;
  color: var(--cl-green-text);
  box-shadow: 0 1px 3px rgba(26, 31, 38, .08);
}

body.cl-dashboard-redesign-page .cl-policy-page .contentbox.cl-policy-document {
  float: none;
  width: 100%;
  min-height: 0;
  margin: 0;
  padding: 48px 56px;
  overflow: visible;
  background: #fff;
  border: 1px solid #E5E7EB;
  border-radius: 14px;
  box-shadow: 0 2px 7px rgba(28, 35, 43, .04);
}

body.cl-dashboard-redesign-page .cl-policy-page :where(.terms_content, .privacy_content) {
  padding: 0;
  color: #555B64;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.8;
  overflow-wrap: anywhere;
}

body.cl-dashboard-redesign-page .cl-policy-page :where(.terms_content, .privacy_content) :where(p, dl, ol, ul) {
  margin-top: 0;
}

body.cl-dashboard-redesign-page .cl-policy-page .terms_content .content,
body.cl-dashboard-redesign-page .cl-policy-page .privacy_content > ol {
  margin: 0;
  padding: 0;
}

body.cl-dashboard-redesign-page .cl-policy-page .terms_content .content > dt,
body.cl-dashboard-redesign-page .cl-policy-page .privacy_content > ol > li > h3,
body.cl-dashboard-redesign-page .cl-policy-page .privacy_content > dl > dt {
  margin: 44px 0 12px;
  color: #222428;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.5;
  text-transform: none;
}

body.cl-dashboard-redesign-page .cl-policy-page .terms_content .content > dt:first-child,
body.cl-dashboard-redesign-page .cl-policy-page .privacy_content > ol > li:first-child > h3,
body.cl-dashboard-redesign-page .cl-policy-page .privacy_content > dl > dt:first-child {
  margin-top: 0;
}

body.cl-dashboard-redesign-page .cl-policy-page .terms_content .content > dd,
body.cl-dashboard-redesign-page .cl-policy-page .privacy_content dd {
  margin: 0;
  padding: 0;
  color: #555B64;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.8;
}

body.cl-dashboard-redesign-page .cl-policy-page :where(.terms_content, .privacy_content) ol,
body.cl-dashboard-redesign-page .cl-policy-page :where(.terms_content, .privacy_content) ul {
  padding-left: 22px;
}

body.cl-dashboard-redesign-page .cl-policy-page :where(.terms_content, .privacy_content) li + li {
  margin-top: 6px;
}

body.cl-dashboard-redesign-page .cl-policy-page :where(.terms_content, .privacy_content) a {
  color: #0B8E49;
  text-decoration: underline;
  text-underline-offset: 2px;
}

body.cl-dashboard-redesign-page .cl-policy-page .privacy_top {
  margin: 0 0 40px;
  padding: 22px 24px;
  background: #F7F8FA;
  border-left: 3px solid #03C75A;
  border-radius: 0 8px 8px 0;
}

body.cl-dashboard-redesign-page .cl-policy-page .privacy_top > p {
  margin: 0;
  color: #555B64;
  font-size: 15px;
  line-height: 1.8;
}

body.cl-dashboard-redesign-page .cl-policy-page .privacy_content table {
  display: block;
  width: 100%;
  margin: 18px 0 24px;
  overflow-x: auto;
  border-collapse: collapse;
  border-spacing: 0;
}

body.cl-dashboard-redesign-page .cl-policy-page .privacy_content :where(th, td) {
  min-width: 130px;
  padding: 12px 14px;
  color: #555B64;
  font-family: inherit;
  font-size: 13px;
  line-height: 1.55;
  vertical-align: top;
  border: 1px solid #DDE1E6;
  word-break: keep-all;
}

body.cl-dashboard-redesign-page .cl-policy-page .privacy_content :where(th, .tg-34fe, .tg-style) {
  background: #F1F3F5;
  color: #34383E;
  font-weight: 650;
  text-align: center;
}

body.cl-dashboard-redesign-page .cl-policy-page .select-drop-box {
  float: none;
  display: block;
  width: 280px;
  max-width: 100%;
  margin: 48px 0 0;
  padding-top: 28px;
  border-top: 1px solid #E5E7EB;
}

body.cl-dashboard-redesign-page .cl-policy-page .select-drop-box > p {
  margin: 0 0 9px;
  color: #737982;
  font-size: 13px;
  font-weight: 600;
}

body.cl-dashboard-redesign-page .cl-policy-page .select-drop-box > .dropdown-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: 44px;
  padding: 0 15px;
  background: #fff;
  border: 1px solid #DDE1E6;
  border-radius: 7px;
  color: #34383E;
  font-size: 14px;
  text-decoration: none;
  cursor: pointer;
}

body.cl-dashboard-redesign-page .cl-policy-page .select-drop-box.open > .dropdown-menu {
  width: 100%;
  margin-top: 5px;
  padding: 6px;
  border: 1px solid #E5E7EB;
  border-radius: 8px;
  box-shadow: 0 10px 28px rgba(28, 35, 43, .12);
}

body.cl-dashboard-redesign-page .cl-policy-page .select-drop-box .dropdown-menu > li > a {
  padding: 9px 10px;
  border-radius: 5px;
  color: #555B64;
  font-size: 13px;
  text-decoration: none;
}

body.cl-dashboard-redesign-page .cl-policy-page .select-drop-box .dropdown-menu > li > a:hover,
body.cl-dashboard-redesign-page .cl-policy-page .select-drop-box .dropdown-menu > li > a:focus {
  background: #F1FBF5;
  color: #0B8E49;
}

@media (max-width: 767px) {
  body.cl-dashboard-redesign-page .cl-policy-page {
    padding: 48px 16px 64px;
  }

  body.cl-dashboard-redesign-page .cl-policy-heading {
    margin-bottom: 24px;
  }

  body.cl-dashboard-redesign-page .cl-policy-heading h1 {
    font-size: 27px;
  }

  body.cl-dashboard-redesign-page .cl-policy-heading > p:not(.cl-policy-kicker) {
    font-size: 14px;
  }

  body.cl-dashboard-redesign-page .cl-policy-tabs {
    display: flex;
    width: 100%;
    margin-top: 24px;
  }

  body.cl-dashboard-redesign-page .cl-policy-tabs a,
  body.cl-dashboard-redesign-page .cl-policy-tabs a:hover,
  body.cl-dashboard-redesign-page .cl-policy-tabs a:focus {
    flex: 1 1 50%;
    min-width: 0;
    padding: 9px 8px;
    font-size: 13px;
  }

  body.cl-dashboard-redesign-page .cl-policy-page .contentbox.cl-policy-document {
    padding: 28px 20px 32px;
    border-radius: 10px;
  }

  body.cl-dashboard-redesign-page .cl-policy-page :where(.terms_content, .privacy_content),
  body.cl-dashboard-redesign-page .cl-policy-page .terms_content .content > dd,
  body.cl-dashboard-redesign-page .cl-policy-page .privacy_content dd,
  body.cl-dashboard-redesign-page .cl-policy-page .privacy_top > p {
    font-size: 14px;
    line-height: 1.75;
  }

  body.cl-dashboard-redesign-page .cl-policy-page .terms_content .content > dt,
  body.cl-dashboard-redesign-page .cl-policy-page .privacy_content > ol > li > h3,
  body.cl-dashboard-redesign-page .cl-policy-page .privacy_content > dl > dt {
    margin-top: 34px;
    font-size: 17px;
  }

  body.cl-dashboard-redesign-page .cl-policy-page .privacy_top {
    margin-bottom: 30px;
    padding: 18px;
  }

  body.cl-dashboard-redesign-page .cl-policy-page .select-drop-box {
    width: 100%;
    margin-top: 36px;
  }
}

/* Account profile page */
body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) {
  min-width: 0 !important;
  padding-top: 56px !important;
  background: #F4F5F9 !important;
  color: #222428 !important;
  font-family: var(--cl-source-font) !important;
}

body.cl-dashboard-redesign-page #nav.cl-profile-redesign-head {
  position: fixed !important;
  top: 0 !important;
  left: max(0px, calc(50% - 960px)) !important;
  right: max(0px, calc(50% - 960px)) !important;
  z-index: 1200 !important;
  width: auto !important;
  height: 56px !important;
  min-height: 56px !important;
  margin: 0 !important;
  background: linear-gradient(90deg, #03C75A 0%, #00C4CB 52%, #2E8BF0 100%) !important;
  border: 0 !important;
  box-shadow: none !important;
  opacity: 1 !important;
}

body.cl-dashboard-redesign-page #nav.cl-profile-redesign-head > .header {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100% !important;
  max-width: 1920px !important;
  height: 56px !important;
  margin: 0 auto !important;
  padding: 0 24px !important;
}

body.cl-dashboard-redesign-page #nav.cl-profile-redesign-head .navbar-header {
  position: static !important;
  display: flex !important;
  align-items: center !important;
  width: auto !important;
  height: 56px !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page #nav.cl-profile-redesign-head .navbar-brand {
  display: inline-flex !important;
  align-items: center !important;
  width: auto !important;
  height: 56px !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page #nav.cl-profile-redesign-head .navbar-brand .logo-svg {
  display: block !important;
  width: auto !important;
  height: 30px !important;
}

body.cl-dashboard-redesign-page #nav.cl-profile-redesign-head .navbar-brand #ptl-logo-text {
  display: none !important;
}

body.cl-dashboard-redesign-page #nav.cl-profile-redesign-head .menu-tab {
  position: absolute !important;
  top: 0 !important;
  left: 50% !important;
  display: flex !important;
  align-items: center !important;
  gap: 48px !important;
  height: 56px !important;
  margin: 0 !important;
  transform: translateX(-50%) !important;
}

body.cl-dashboard-redesign-page #nav.cl-profile-redesign-head .menu-tab a,
body.cl-dashboard-redesign-page #nav.cl-profile-redesign-head .menu-tab a:hover,
body.cl-dashboard-redesign-page #nav.cl-profile-redesign-head .menu-tab a:focus {
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  color: rgba(255, 255, 255, .9) !important;
  background: transparent !important;
  border: 0 !important;
  font-size: 14px !important;
  font-weight: 550 !important;
  line-height: 56px !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page #nav.cl-profile-redesign-head .menu-tab a:hover,
body.cl-dashboard-redesign-page #nav.cl-profile-redesign-head .menu-tab a:focus {
  color: #fff !important;
}

body.cl-dashboard-redesign-page #nav.cl-profile-redesign-head .menu-tab a[href="/notice"],
body.cl-dashboard-redesign-page #nav.cl-profile-redesign-head .menu-tab a[href*="supportcenter.creatorlink.net"] {
  display: none !important;
}

body.cl-dashboard-redesign-page #nav.cl-profile-redesign-head .navbar_right {
  position: static !important;
  display: flex !important;
  align-items: center !important;
  width: auto !important;
  height: 56px !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page #nav.cl-profile-redesign-head .header_user,
body.cl-dashboard-redesign-page #nav.cl-profile-redesign-head .header_user > ul,
body.cl-dashboard-redesign-page #nav.cl-profile-redesign-head .header_user > ul > li {
  display: flex !important;
  align-items: center !important;
  height: 56px !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page #nav.cl-profile-redesign-head .header_user .inner-box {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  height: 36px !important;
  padding: 0 8px !important;
  color: #fff !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 7px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
}

body.cl-dashboard-redesign-page #nav.cl-profile-redesign-head .header_user .inner-box:hover {
  background: rgba(255, 255, 255, .12) !important;
}

body.cl-dashboard-redesign-page #nav.cl-profile-redesign-head .header_user .name-text,
body.cl-dashboard-redesign-page #nav.cl-profile-redesign-head .header_user .caret {
  color: #fff !important;
}

body.cl-dashboard-redesign-page #nav.cl-profile-redesign-head .header_user .dropdown-menu {
  top: 48px !important;
  right: 0 !important;
  left: auto !important;
  min-width: 220px !important;
  padding: 8px !important;
  background: #fff !important;
  border: 1px solid #E5E7EB !important;
  border-radius: 8px !important;
  box-shadow: 0 12px 34px rgba(20, 24, 32, .17) !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page,
body.cl-dashboard-redesign-page .cl-profile-myinfo-page * {
  box-sizing: border-box;
  letter-spacing: 0;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page {
  --green-text: var(--cl-green-text);
  --border: #E5E7EB;
  --text-secondary: #8A8F98;
  --radius-sm: 6px;
  --mi-section-divider: #E5E7EB;
  min-height: calc(100vh - 56px);
  width: auto !important;
  margin-top: 0 !important;
  margin-right: var(--cl-source-app-gutter) !important;
  margin-bottom: 0 !important;
  margin-left: calc(var(--cl-source-app-gutter) + var(--cl-source-sidebar-w)) !important;
  padding: 36px 32px 80px !important;
  background: #F4F5F9 !important;
  color: #222428 !important;
  font-family: inherit !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .mi-install a {
  border-bottom-color: var(--cl-green);
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .dashboard.cl-dashboard-redesign {
  min-height: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page > .mypage-box.container {
  float: none !important;
  width: min(960px, 100%) !important;
  max-width: 960px !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .mypage-title {
  float: none !important;
  display: block !important;
  width: 100% !important;
  margin: 0 0 22px !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .mypage-title .title {
  margin: 0 !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .mypage-title h1 {
  margin: 0 !important;
  color: #222428 !important;
  font-size: 24px !important;
  font-weight: 750 !important;
  line-height: 1.4 !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .mypage-title p {
  margin: 7px 0 0 !important;
  color: #8A8F98 !important;
  font-size: 13.5px !important;
  line-height: 1.6 !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .contentbox {
  float: none !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: #fff !important;
  border: 1px solid #E5E7EB !important;
  border-radius: 14px !important;
  box-shadow: 0 1px 3px rgba(20, 24, 32, .05) !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .profile-box {
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .profile-img-box.mi-sec,
body.cl-dashboard-redesign-page .cl-profile-myinfo-page .profile-info-box.mi-sec {
  position: relative !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 28px 32px !important;
  border-bottom: 0 !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .profile-box > .mi-sec:not(:last-child)::after {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  height: 1px !important;
  background: var(--mi-section-divider) !important;
  transform: scaleY(.5) !important;
  transform-origin: bottom !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .profile-info-box.mi-sec::after {
  content: none !important;
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .profile-action-box {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 26px 32px 28px !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .profile-action-box.is-twofactor-setup-open {
  padding-top: 24px !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info .twofactor-action-box {
  padding-right: 0 !important;
  padding-bottom: 0 !important;
  padding-left: 0 !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page :is(.profile-img-title, .aboutAcc.info-title) {
  display: flex;
  align-items: center;
  width: 100%;
  gap: 5px;
  font-size: 16px;
  font-weight: 700;
  color: var(--text-primary, #222428);
  margin: 0;
  margin-bottom: 22px;
  box-sizing: border-box;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .profile-img-title svg {
  display: block;
  flex: none;
  width: 13px;
  height: 13px;
  margin-left: 0;
  color: #03C75A;
  fill: #03C75A;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .profile-img-wrap.mi-profile {
  display: flex;
  align-items: center;
  gap: 18px;
  width: 100%;
  max-width: 100%;
  margin: 0;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .profileImg-Box,
body.cl-dashboard-redesign-page .cl-profile-myinfo-page .profileImg-Box.profileImg-radius {
  flex: 0 0 66px;
  width: 66px;
  min-width: 66px;
  max-width: 66px;
  height: 66px;
  min-height: 66px;
  max-height: 66px;
  margin: 0;
  position: relative;
  overflow: hidden;
  border-radius: 50%;
  background: #EDEFF3;
  color: #B9BEC7;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .profileImg-Box.profileImg-radius .img-circle {
  flex: none;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  height: 100%;
  min-height: 0;
  max-height: 100%;
  margin: 0;
  border-radius: 50%;
  background: #EDEFF3;
  color: #B9BEC7;
  object-fit: cover;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .profileImg-Box.profileImg-default .profile-upload {
  opacity: 0 !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .profileImg-Box .profile-default-avatar {
  display: none !important;
  position: absolute !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  z-index: 2 !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .profileImg-Box.profileImg-default .profile-default-avatar {
  display: flex !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .profileImg-Box.profileImg-radius .img-circle svg {
  width: 58%;
  height: 58%;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .profileImg-Box .profile-default-avatar svg {
  width: 100% !important;
  height: 100% !important;
  color: var(--cl-text-muted);
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .profileImg-Box .profile-default-avatar-bg {
  color: var(--cl-bg-3);
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .profile-nick {
  flex: 1 1 auto;
  min-width: 0;
  margin: 0;
  overflow-wrap: anywhere;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .profile-nick .mi-name {
  color: var(--cl-green-text);
  font-size: 15px;
  font-weight: 700;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .profile-nick .nick-info {
  margin-top: 5px;
  color: #8A8F98;
  font-size: 12px;
  line-height: 1.5;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .profile-edit {
  flex: 0 0 auto !important;
  margin: 0 0 0 auto !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page :is(.profile-edit > span, .changepwd, .changecert) {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  max-width: 100% !important;
  min-width: 76px !important;
  height: 34px !important;
  margin: 0 !important;
  padding: 0 13px !important;
  box-sizing: border-box !important;
  background: #fff !important;
  border: 1px solid #D9DDE3 !important;
  border-radius: 7px !important;
  color: #555B64 !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 32px !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .profile-edit > .mi-profile-btn {
  width: auto !important;
  max-width: 100% !important;
  min-width: 76px !important;
  height: 34px !important;
  margin-left: auto !important;
  padding: 0 13px !important;
  border: 1px solid var(--border, #D9DDE3) !important;
  border-radius: var(--radius-sm, 7px) !important;
  background: #fff !important;
  color: var(--text-secondary, #8A8F98) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 32px !important;
  cursor: pointer !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page :is(.profile-edit > span, .changepwd, .changecert):hover {
  background: #F1FBF5 !important;
  border-color: #B7E7C9 !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info > .account {
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info > .account > li,
body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info > .account > li:first-child {
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  min-height: 0 !important;
  gap: 18px !important;
  margin: 0 !important;
  padding: 16px 0 !important;
  border-top: 0 !important;
  border-bottom: 1px solid #F2F3F5 !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info > .account > li:last-of-type {
  border-bottom: 0 !important;
  padding-bottom: 0 !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info > .account > li > p {
  display: flex !important;
  align-items: center !important;
  flex: none !important;
  width: 170px !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 !important;
  gap: 5px !important;
  color: var(--text-secondary, #8A8F98) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info > .account > li > span,
body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info > .account > li > .pwd_box {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  min-height: 40px !important;
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  flex-wrap: wrap !important;
  font-size: 14px !important;
  color: var(--text-primary, #222428) !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
  overflow-wrap: anywhere !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info > .account > li:first-child > span {
  color: var(--cl-green-text) !important;
  font-weight: 600 !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info > .account > li.social-login-data > span > a {
  color: var(--cl-green-text) !important;
  font-weight: 600 !important;
  text-decoration: underline !important;
  text-decoration-color: rgba(3, 199, 90, .35) !important;
  text-underline-offset: 2px !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info > .account > li.social-login-data > span > a:hover,
body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info > .account > li.social-login-data > span > a:focus {
  color: var(--cl-green-text) !important;
  text-decoration-color: rgba(2, 179, 81, .55) !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info .pwd_box {
  display: flex !important;
  align-items: center !important;
  gap: 8px 12px !important;
  flex-wrap: wrap !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info .mi-2fa-head {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  width: 100% !important;
  min-height: 40px !important;
  padding-top: 0 !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info > .account > li.twofactor-row {
  align-items: center !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info > .account > li.twofactor-row.is-twofactor-setup-open,
body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info > .account > li.twofactor-row.is-twofactor-status-wrapped {
  align-items: flex-start !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info .twofactor-reset-btn {
  flex: none !important;
  padding: 6px 12px !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-sm) !important;
  background: #fff !important;
  color: var(--text-secondary) !important;
  font-family: var(--cl-source-font) !important;
  font-size: 12.5px !important;
  font-weight: 400 !important;
  line-height: 1.4 !important;
  text-align: center !important;
  vertical-align: middle !important;
  cursor: pointer !important;
  -webkit-transition: background .12s, border-color .12s, color .12s !important;
  -moz-transition: background .12s, border-color .12s, color .12s !important;
  -o-transition: background .12s, border-color .12s, color .12s !important;
  transition: background .12s, border-color .12s, color .12s !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info .changepwd {
  flex: 0 0 auto !important;
  width: auto !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info > .account > li:has(.changecert) > .pwd_box {
  display: flex !important;
  gap: 14px !important;
  width: auto !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info .cert_changenotice {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  flex: 0 1 auto !important;
  order: 2 !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info .cert-verified-icon {
  flex: 0 0 16px !important;
  width: 16px !important;
  height: 16px !important;
  color: var(--cl-green) !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info .changecert {
  flex: 0 0 auto !important;
  width: auto !important;
  order: 1 !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info .changepwd,
body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info .changecert {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
  width: auto !important;
  max-width: 100% !important;
  min-width: 96px !important;
  height: 40px !important;
  margin: 0 !important;
  padding: 0 18px !important;
  box-sizing: border-box !important;
  border: 1px solid var(--border, #D9DDE3) !important;
  border-radius: 8px !important;
  background: #fff !important;
  color: var(--text-primary, #222428) !important;
  font-family: inherit !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  line-height: 38px !important;
  text-align: center !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  cursor: pointer !important;
  -webkit-transition: background .12s, border-color .12s, color .12s !important;
  -moz-transition: background .12s, border-color .12s, color .12s !important;
  -o-transition: background .12s, border-color .12s, color .12s !important;
  transition: background .12s, border-color .12s, color .12s !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info .changepwd:hover,
body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info .changecert:hover,
body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info .twofactor-reset-btn:hover {
  background: #F1FBF5 !important;
  border-color: var(--brand-blue, #03C75A) !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info .mi-2fa-status {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  height: 17px;
  min-width: 0;
  max-width: 100%;
  overflow: visible;
  flex: 0 1 auto;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info .mi-2fa-status .t {
  flex: 1 1 auto;
  min-width: 0;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info .twofactor-row.is-twofactor-status-wrapped .mi-2fa-status {
  height: auto;
  min-height: 17px;
}

@media (max-width: 480px) {
  body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info > .account > li.twofactor-row {
    align-items: flex-start !important;
  }

  body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info .mi-2fa-head {
    display: grid !important;
    grid-template-columns: 36px minmax(0, 1fr) !important;
    grid-template-rows: 34px auto !important;
    align-items: center !important;
    column-gap: 12px !important;
    row-gap: 12px !important;
  }

  body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info .mi-2fa-status {
    height: auto;
    min-height: 17px;
    min-width: 0;
    overflow: visible;
  }

  body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info .twofactor-reset-btn {
    grid-column: 1 / -1 !important;
    justify-self: start !important;
    width: auto !important;
    max-width: 100% !important;
    margin: 0 !important;
  }
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info .twofactor-row.is-twofactor-status-wrapped .mi-2fa-head {
  display: grid !important;
  grid-template-columns: 36px minmax(0, 1fr) !important;
  grid-template-rows: minmax(40px, auto) auto auto !important;
  align-items: center !important;
  column-gap: 12px !important;
  row-gap: 12px !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info .twofactor-row.is-twofactor-status-wrapped .set-switch {
  grid-column: 1 !important;
  grid-row: 1 !important;
  align-self: center !important;
  margin-top: 0 !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info .twofactor-row.is-twofactor-status-wrapped .mi-2fa-status {
  grid-column: 2 !important;
  grid-row: 1 !important;
  align-self: center !important;
  align-items: center !important;
  height: auto !important;
  min-height: 17px !important;
  min-width: 0 !important;
  margin-top: 0 !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info .twofactor-row.is-twofactor-status-wrapped .mi-2fa-head .mi-2fa-lead {
  grid-column: 1 / -1 !important;
  grid-row: 2 !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info .twofactor-row.is-twofactor-status-wrapped .twofactor-reset-btn {
  grid-column: 1 / -1 !important;
  grid-row: 3 !important;
  justify-self: start !important;
  width: auto !important;
  max-width: 100% !important;
  margin-left: 0 !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info .twofactor-row:not(.is-twofactor-setup-open):not(.is-twofactor-status-wrapped) .set-switch,
body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info .twofactor-row:not(.is-twofactor-setup-open):not(.is-twofactor-status-wrapped) .mi-2fa-status {
  align-self: center !important;
  margin-top: 0 !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info .pwd_changenotice {
  display: flex !important;
  align-items: center !important;
  flex: 1 1 0 !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
  gap: 6px !important;
  color: var(--text-secondary, #8A8F98) !important;
  font-size: 12.5px !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info .pwd_changenotice svg {
  flex: none;
  width: 14px;
  height: 14px;
  margin-right: 0;
  color: #EE445F;
  fill: none;
  stroke: currentColor;
  vertical-align: initial;
  transform: none;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info .pwd_box > .pwd_changenotice {
  flex-basis: 220px !important;
  align-items: flex-start !important;
  overflow-wrap: anywhere;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info .pwd_changenotice.twofactor-password-error,
body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info .pwd_changenotice.twofactor-code-error {
  display: none !important;
  align-items: center !important;
  flex: 0 0 100% !important;
  width: 100% !important;
  max-width: 100% !important;
  gap: 5px !important;
  margin-top: 8px !important;
  color: #EE445F !important;
  font-size: 12.5px !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info .pwd_changenotice.twofactor-password-error.is-visible,
body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info .pwd_changenotice.twofactor-code-error.is-visible {
  display: flex !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info .pwd_changenotice.twofactor-code-error .twofactor-code-error-text {
  flex: none !important;
  color: inherit !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info .pwd_changenotice.twofactor-password-error svg,
body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info .pwd_changenotice.twofactor-code-error svg {
  width: 14px !important;
  height: 14px !important;
  flex: none !important;
}

body.cl-dashboard-redesign-page .mypage-wrapper .container.mypage-box .account-box,
body.cl-dashboard-redesign-page .cl-profile-myinfo-page .account-box {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  width: 100% !important;
  max-width: 100% !important;
  gap: 10px !important;
  margin: 0 !important;
  padding: 20px 32px !important;
  box-sizing: border-box !important;
  background: transparent !important;
  border-top: 0 !important;
  color: var(--text-secondary, #8A8F98) !important;
  font-size: 13px !important;
  text-align: right !important;
}

body.cl-dashboard-redesign-page .mypage-wrapper .container.mypage-box .account-box::before,
body.cl-dashboard-redesign-page .cl-profile-myinfo-page .account-box::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  top: 0 !important;
  height: 1px !important;
  background: var(--mi-section-divider) !important;
  transform: scaleY(.5) !important;
  transform-origin: top !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .mypage-wrapper .container.mypage-box .account-box .account,
body.cl-dashboard-redesign-page .cl-profile-myinfo-page .account-box .account {
  width: auto !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .delete-accinfo {
  color: var(--text-secondary, #8A8F98) !important;
  font-size: 13px !important;
}

body.cl-dashboard-redesign-page .cl-profile-myinfo-page .removeAcc-btn,
body.cl-dashboard-redesign-page .cl-profile-myinfo-page .removeAcc-btn:hover,
body.cl-dashboard-redesign-page .cl-profile-myinfo-page .removeAcc-btn:focus {
  margin-left: 12px !important;
  color: #E5484D !important;
  font-weight: 600 !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) > .mobile-detail-popup.m_mypage {
  display: none !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) > footer.default {
  margin: 0 !important;
  background: #fff !important;
  border-top: 1px solid #E5E7EB !important;
}

@media (max-width: 900px) {
  body.cl-dashboard-redesign-page #nav.cl-profile-redesign-head .menu-tab {
    display: none !important;
  }

  body.cl-dashboard-redesign-page .cl-profile-myinfo-page {
    margin-right: 0 !important;
    margin-left: 0 !important;
    padding: 22px 18px 44px !important;
  }
}

@media (max-width: 767px) {
  body.cl-dashboard-redesign-page #nav.cl-profile-redesign-head > .header {
    padding: 0 16px !important;
  }

  body.cl-dashboard-redesign-page #nav.cl-profile-redesign-head .navbar-toggle {
    display: none !important;
  }

  body.cl-dashboard-redesign-page #nav.cl-profile-redesign-head .header_user,
  body.cl-dashboard-redesign-page #nav.cl-profile-redesign-head .header_user > ul,
  body.cl-dashboard-redesign-page #nav.cl-profile-redesign-head .header_user > ul > li {
    display: flex !important;
  }

  body.cl-dashboard-redesign-page .cl-profile-myinfo-page {
    padding: 24px 16px 48px !important;
  }

  body.cl-dashboard-redesign-page .cl-profile-myinfo-page .mypage-title {
    margin-bottom: 18px !important;
  }

  body.cl-dashboard-redesign-page .cl-profile-myinfo-page .mypage-title h1 {
    font-size: 21px !important;
  }

  body.cl-dashboard-redesign-page .cl-profile-myinfo-page .contentbox {
    border-radius: 10px !important;
  }

  body.cl-dashboard-redesign-page .cl-profile-myinfo-page .profile-img-box.mi-sec,
  body.cl-dashboard-redesign-page .cl-profile-myinfo-page .profile-info-box.mi-sec {
    padding: 24px 20px !important;
  }

  body.cl-dashboard-redesign-page .cl-profile-myinfo-page .profile-action-box {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 24px 20px !important;
  }

  body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info .twofactor-action-box {
    padding-right: 0 !important;
    padding-bottom: 0 !important;
    padding-left: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-profile-myinfo-page .profile-img-wrap {
    display: grid !important;
    grid-template-columns: 66px minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 16px !important;
  }

  body.cl-dashboard-redesign-page .cl-profile-myinfo-page .profile-edit {
    margin: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info > .account > li,
  body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info > .account > li:first-child {
    flex-wrap: nowrap !important;
    gap: 10px !important;
    padding: 14px 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info > .account > li > p {
    flex: 0 0 104px !important;
    width: 104px !important;
  }

  body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info > .account > li > span,
  body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info > .account > li > .pwd_box {
    flex: 1 1 auto !important;
    width: auto !important;
  }

  body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info .changepwd,
  body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info .changecert {
    max-width: 100% !important;
  }

  body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info .pwd_box > .pwd_changenotice {
    flex-basis: 100% !important;
  }

  body.cl-dashboard-redesign-page .cl-profile-myinfo-page .account-box {
    padding: 18px 20px !important;
    text-align: left !important;
  }

  body.cl-dashboard-redesign-page .cl-profile-myinfo-page .delete-accinfo {
    display: flex !important;
    flex-direction: column;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    gap: 12px !important;
    text-align: left;
  }

  body.cl-dashboard-redesign-page .cl-profile-myinfo-page .removeAcc-btn {
    flex: 0 0 auto !important;
    margin-left: 0 !important;
  }
}

@media (max-width: 360px) {
  body.cl-dashboard-redesign-page .cl-profile-myinfo-page .profile-img-wrap {
    grid-template-columns: 66px minmax(0, 1fr) !important;
    grid-template-rows: auto auto !important;
    align-items: start !important;
    gap: 8px 16px !important;
  }

  body.cl-dashboard-redesign-page .cl-profile-myinfo-page .profileImg-Box {
    grid-row: 1 / 3 !important;
    align-self: center !important;
  }

  body.cl-dashboard-redesign-page .cl-profile-myinfo-page .profile-edit {
    justify-self: start !important;
  }

  body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info > .account > li,
  body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info > .account > li:first-child {
    flex-wrap: wrap !important;
    gap: 8px !important;
  }

  body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info > .account > li > p {
    flex: 0 0 100% !important;
    width: 100% !important;
    min-height: auto !important;
  }

  body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info > .account > li > span,
  body.cl-dashboard-redesign-page .cl-profile-myinfo-page .aboutAcc-info > .account > li > .pwd_box {
    flex: 0 0 100% !important;
    width: 100% !important;
  }
}

/* Account profile dialogs */
body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) > .modal-backdrop,
body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) > .modal-backdrop.fade.in {
  z-index: 1998 !important;
  background: #141820 !important;
  opacity: .48 !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) > .flat-modal.cl-alert-modal + .modal-backdrop,
body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) > .flat-modal.cl-alert-modal + .modal-backdrop.fade.in {
  z-index: 2000 !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal > .modal-default {
  position: fixed !important;
  inset: 0 !important;
  z-index: 1999 !important;
  width: 100vw !important;
  height: 100vh !important;
  padding: 24px 16px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal.cl-alert-modal > .modal-default {
  z-index: 2001 !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal > .modal-default.in,
body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal > .modal-default.show {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal > .modal-default > .cl-mobile-btn.close {
  display: none !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-dialog {
  position: relative !important;
  inset: auto !important;
  flex: 0 0 auto !important;
  width: min(560px, calc(100vw - 32px)) !important;
  max-width: min(560px, calc(100vw - 32px)) !important;
  min-height: 0 !important;
  max-height: calc(100vh - 48px) !important;
  margin: auto !important;
  padding: 0 !important;
  background: transparent !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-dialog.cl-profileAlert,
body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-dialog.cl-profileConfirm,
body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-dialog.cl-alert,
body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-dialog.cl-nonProfile {
  width: min(420px, calc(100vw - 32px)) !important;
  max-width: min(420px, calc(100vw - 32px)) !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-dialog.cl-removeAccConfirm {
  width: min(600px, calc(100vw - 32px)) !important;
  max-width: min(600px, calc(100vw - 32px)) !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal
  .modal-dialog:is(.cl-removeAcc, .cl-removeAccConfirm) {
  height: auto !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-default.in .modal-dialog,
body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-default.fade .modal-dialog,
body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-default.show .modal-dialog {
  transform: none !important;
}

.flat-modal.cl-profile-myinfo-modal-wrap .modal-default .modal-dialog,
.flat-modal.cl-profile-myinfo-modal-wrap .modal-default.in .modal-dialog,
.flat-modal.cl-profile-myinfo-modal-wrap .modal-default.show .modal-dialog {
  -webkit-transform: none !important;
  -moz-transform: none !important;
  -ms-transform: none !important;
  -o-transform: none !important;
  transform: none !important;
  -webkit-transition: none !important;
  -moz-transition: none !important;
  -o-transition: none !important;
  transition: none !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-content {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  min-height: 0 !important;
  max-height: calc(100vh - 48px) !important;
  margin: 0 !important;
  padding: 36px 40px 30px !important;
  overflow: hidden !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 14px !important;
  box-shadow: 0 24px 64px rgba(20, 24, 32, .28) !important;
  color: var(--cl-text) !important;
  font-family: var(--cl-source-font) !important;
  letter-spacing: 0 !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-body {
  width: 100% !important;
  max-width: none !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 3px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  color: var(--cl-text-sub) !important;
  font-family: inherit !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-title {
  margin: 0 34px 28px !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-family: inherit !important;
  font-size: 22px !important;
  font-weight: 800 !important;
  line-height: 30px !important;
  letter-spacing: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-title:empty {
  display: none !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-content > .close.close-button-dialog {
  position: absolute !important;
  top: 16px !important;
  right: 16px !important;
  z-index: 2 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  appearance: none !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text-muted) !important;
  font-size: 0 !important;
  line-height: 0 !important;
  opacity: 1 !important;
  transition: background-color .12s, color .12s, transform .18s cubic-bezier(.34, 1.56, .64, 1) !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-content > .close.close-button-dialog:hover,
body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-content > .close.close-button-dialog:focus {
  background: #F1F2F5 !important;
  color: var(--cl-text) !important;
  outline: 0 !important;
  transform: rotate(90deg) !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-content > .close.close-button-dialog span,
body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-content > .close.close-button-dialog svg {
  display: block !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-content > .close.close-button-dialog svg {
  width: 11px !important;
  height: 11px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-footer {
  flex: 0 0 auto !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 10px !important;
  width: 100% !important;
  max-width: none !important;
  margin: 28px 0 0 !important;
  padding: 0 3px !important;
  background: transparent !important;
  border: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-footer > .btn {
  float: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 48px !important;
  min-height: 48px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  font-family: inherit !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-shadow: none !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-footer > .ok-button-dialog,
body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-footer > .btn-primary {
  order: 1 !important;
  background: var(--cl-green) !important;
  border: 1px solid var(--cl-green) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-footer > .ok-button-dialog:hover,
body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-footer > .ok-button-dialog:focus,
body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-footer > .btn-primary:hover,
body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-footer > .btn-primary:focus {
  background: var(--cl-green-hover) !important;
  border-color: var(--cl-green-hover) !important;
  color: #fff !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-footer > .btn-default,
body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-footer > .close-button-dialog:not(.ok-button-dialog) {
  order: 2 !important;
  background: transparent !important;
  border: 0 !important;
  color: var(--cl-text-sub) !important;
  font-weight: 500 !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-footer > .btn-default:hover,
body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-footer > .btn-default:focus,
body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-footer > .close-button-dialog:not(.ok-button-dialog):hover,
body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-footer > .close-button-dialog:not(.ok-button-dialog):focus {
  background: var(--cl-green-soft) !important;
  color: var(--cl-green-text) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-profile-modal-message {
  margin: 16px 0 4px !important;
  color: var(--cl-text-sub) !important;
  font-size: 14px !important;
  line-height: 1.7 !important;
  text-align: center !important;
  word-break: keep-all !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-dialog.cl-twofactor-backup {
  width: 92% !important;
  max-width: 560px !important;
  padding: 0 !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-dialog.cl-twofactor-backup .modal-content {
  --border: #E5E7EB;
  --text-primary: #222428;
  --text-secondary: #8A8F98;
  --text-muted: #B4B8BF;
  --brand-blue: #03C75A;
  --brand-blue-hover: #02B351;
  --green-text: var(--cl-green-text);
  position: relative !important;
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 44px var(--twofactor-backup-modal-padding-x, 8%) 34px !important;
  float: none !important;
  overflow: visible !important;
  background: #fff !important;
  border: 0 !important;
  border-radius: 18px !important;
  box-shadow: 0 20px 50px rgba(20, 24, 32, .25) !important;
  box-sizing: border-box !important;
  color: var(--text-primary) !important;
  font-family: var(--cl-source-font) !important;
  letter-spacing: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-dialog.cl-twofactor-backup .modal-content > .close.close-button-dialog {
  position: absolute !important;
  top: 16px !important;
  right: 16px !important;
  width: 30px !important;
  height: 30px !important;
  border: none !important;
  background: none !important;
  padding: 0 !important;
  cursor: pointer !important;
  color: var(--text-secondary) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 8px !important;
  transition: color .15s, background .15s, transform .18s cubic-bezier(.34, 1.56, .64, 1) !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-dialog.cl-twofactor-backup .modal-content > .close.close-button-dialog svg {
  width: 15px !important;
  height: 15px !important;
  display: block !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-dialog.cl-twofactor-backup .modal-content > .close.close-button-dialog:hover,
body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-dialog.cl-twofactor-backup .modal-content > .close.close-button-dialog:focus {
  color: var(--text-primary) !important;
  background: #F1F2F5 !important;
  transform: rotate(90deg) !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-dialog.cl-twofactor-backup .modal-body {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  box-sizing: border-box !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-dialog.cl-twofactor-backup .modal-title {
  display: block !important;
  width: auto !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 0 22px !important;
  padding: 0 !important;
  color: var(--text-primary) !important;
  font-family: inherit !important;
  font-size: 21px !important;
  font-weight: 700 !important;
  font-style: normal !important;
  line-height: normal !important;
  letter-spacing: normal !important;
  text-align: center !important;
  text-shadow: none !important;
  text-transform: none !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-dialog.cl-twofactor-backup .twofactor-backup-code-modal > p:not(.twofactor-backup-footer-notice) {
  width: 100% !important;
  margin: 0 0 26px !important;
  color: var(--text-secondary) !important;
  font-family: inherit !important;
  font-size: 15px !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  word-break: keep-all !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-dialog.cl-twofactor-backup .mb-desc-eg {
  display: inline-block;
  margin-top: 4px;
  color: var(--text-muted);
  font-size: 13px;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-dialog.cl-twofactor-backup .twofactor-backup-code-row {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-dialog.cl-twofactor-backup .twofactor-backup-code-value {
  flex: 1 1 calc(100% - 52px) !important;
  width: calc(100% - 52px) !important;
  min-width: 0 !important;
  max-width: 220px !important;
  height: 44px !important;
  padding: 0 10px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 1px solid var(--border) !important;
  border-radius: 8px !important;
  background: #fff !important;
  box-sizing: border-box !important;
  color: var(--text-primary) !important;
  font-family: inherit !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  letter-spacing: .6px !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-dialog.cl-twofactor-backup .twofactor-backup-code-modal .twofactor-backup-footer-notice {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 20px 0 0 !important;
  color: var(--text-secondary) !important;
  font-family: inherit !important;
  text-align: left !important;
  white-space: normal !important;
  word-break: keep-all !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-dialog.cl-twofactor-backup .mb-warn ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-dialog.cl-twofactor-backup .mb-warn li {
  position: relative;
  padding-left: 11px;
  font-size: 12.5px;
  line-height: 1.7;
  font-weight: 600;
  letter-spacing: 0;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-dialog.cl-twofactor-backup .mb-warn li:before {
  content: '·';
  position: absolute;
  left: 2px;
  top: -.5px;
  color: var(--text-muted);
  font-weight: 600;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-dialog.cl-twofactor-backup .mb-warn li b {
  color: #EE445F;
  font-weight: 700;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-dialog.cl-twofactor-backup .twofactor-backup-action-btn {
  width: 44px !important;
  height: 44px !important;
  min-height: 44px !important;
  flex: 0 0 44px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 1px solid var(--border) !important;
  border-radius: 8px !important;
  background: #fff !important;
  color: var(--text-secondary) !important;
  cursor: pointer !important;
  transition: background .12s, border-color .12s, color .12s !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-dialog.cl-twofactor-backup .twofactor-backup-action-btn svg {
  width: 16px !important;
  height: 16px !important;
  display: block !important;
  fill: none !important;
  stroke: currentColor !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-dialog.cl-twofactor-backup .twofactor-backup-action-btn:hover {
  background: #F1FBF5 !important;
  border-color: var(--brand-blue) !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-dialog.cl-twofactor-backup .modal-footer {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 26px 0 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-sizing: border-box !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-dialog.cl-twofactor-backup .modal-footer :is(.ok-button-dialog, .btn-primary, .close-button-dialog, .cancel-button-dialog, .cancel-btn, .cancel-button, .btn-cancel, .btn-cancel-dialog),
body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-dialog.cl-twofactor-backup .modal-footer :is(.ok-button-dialog, .btn-primary, .close-button-dialog, .cancel-button-dialog, .cancel-btn, .cancel-button, .btn-cancel, .btn-cancel-dialog):hover,
body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-dialog.cl-twofactor-backup .modal-footer :is(.ok-button-dialog, .btn-primary, .close-button-dialog, .cancel-button-dialog, .cancel-btn, .cancel-button, .btn-cancel, .btn-cancel-dialog):focus {
  width: 100% !important;
  max-width: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 48px !important;
  min-height: 48px !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 16px !important;
  background: var(--brand-blue) !important;
  border: none !important;
  border-radius: 9px !important;
  box-shadow: none !important;
  color: #fff !important;
  font-family: inherit !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: normal !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  text-decoration: none !important;
  cursor: pointer !important;
  transition: background .13s !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-dialog.cl-twofactor-backup .modal-footer :is(.ok-button-dialog, .btn-primary, .close-button-dialog, .cancel-button-dialog, .cancel-btn, .cancel-button, .btn-cancel, .btn-cancel-dialog):hover,
body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-dialog.cl-twofactor-backup .modal-footer :is(.ok-button-dialog, .btn-primary, .close-button-dialog, .cancel-button-dialog, .cancel-btn, .cancel-button, .btn-cancel, .btn-cancel-dialog):focus {
  background: var(--brand-blue-hover) !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal :is(.cl-common-form-wrap, .cl-common-form-group) {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-common-control-label {
  position: static !important;
  inset: auto !important;
  order: 1 !important;
  display: block !important;
  width: auto !important;
  height: auto !important;
  margin: 0 0 8px !important;
  padding: 0 !important;
  background: transparent !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 18px !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal :is(.edit-input-name, .change-pwd-input, .removeAcc-email-input, .removeAcc-pwd-input, .d_reason-input) {
  position: static !important;
  order: 2 !important;
  display: block !important;
  width: 100% !important;
  height: 44px !important;
  min-height: 44px !important;
  margin: 0 !important;
  padding: 0 13px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text) !important;
  font-family: inherit !important;
  font-size: 14px !important;
  line-height: 42px !important;
  opacity: 1 !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal :is(.edit-input-name, .change-pwd-input, .removeAcc-email-input, .removeAcc-pwd-input, .d_reason-input):focus {
  border-color: var(--cl-green) !important;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .13) !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-common-form-wrap.readOnly .cl-common-form-group {
  padding: 0 !important;
  background: transparent !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-common-form-wrap.readOnly .edit-input-name {
  display: none !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-common-form-wrap.readOnly .nickValue {
  order: 2 !important;
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  height: 44px !important;
  margin: 0 !important;
  padding: 0 13px !important;
  background: #F4F5F7 !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  color: var(--cl-text-sub) !important;
  font-size: 14px !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal label.error {
  order: 3 !important;
  display: block !important;
  width: 100% !important;
  margin: 7px 0 0 !important;
  padding: 0 !important;
  color: var(--cl-danger) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 18px !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-profileImg .modal-body {
  text-align: center !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-profileImg .profileImg-Box.profile-image-margin {
  float: none !important;
  width: 110px !important;
  min-width: 110px !important;
  max-width: 110px !important;
  height: 110px !important;
  min-height: 110px !important;
  max-height: 110px !important;
  margin: 0 auto 18px !important;
  overflow: hidden !important;
  border-radius: 50% !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-profileImg .profileImg-Box svg {
  display: block !important;
  width: 110px !important;
  height: 110px !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-profileImg .profileImg-modal-avatar {
  color: var(--cl-text-muted) !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-profileImg .profileImg-modal-placeholder {
  display: none;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-profileImg .profileImg-modal-avatar.is-default .profileImg-modal-photo {
  display: none;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-profileImg .profileImg-modal-avatar.is-default .profileImg-modal-placeholder {
  display: block;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-profileImg .profileImg-modal-placeholder-bg {
  color: var(--cl-bg-3);
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-profileImg .fileupl-button.profile-text-box {
  position: relative !important;
  display: inline-flex !important;
  margin: 0 auto !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-profileImg .fileupl-button.profile-text-box label {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: 120px !important;
  height: 38px !important;
  margin: 0 !important;
  padding: 0 15px !important;
  background: #fff !important;
  border: 1px solid var(--cl-green) !important;
  border-radius: 8px !important;
  color: var(--cl-green-text) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 36px !important;
  cursor: pointer !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-profileImg #fileupload-profile {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: -1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  opacity: 0 !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-profileImg .p-text {
  margin: 10px 0 0 !important;
  padding: 0 !important;
  color: var(--cl-text-muted) !important;
  font-size: 12px !important;
  line-height: 18px !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-profileImg .nick_namech {
  float: none !important;
  width: 100% !important;
  margin: 28px 0 0 !important;
  padding-top: 24px !important;
  border-top: 1px solid var(--cl-line) !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-profileImg .mypage-cl-form-wrap {
  float: none !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-profileImg .profileImg_nicknotice {
  clear: both !important;
  display: flex !important;
  gap: 4px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 12px 0 0 !important;
  color: var(--cl-text-muted) !important;
  font-size: 12px !important;
  line-height: 18px !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-changePwd form#fpwd_change > h3 {
  margin: 0 0 24px !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 1.65 !important;
  text-align: center !important;
}

/* Override the legacy mobile full-height password dialog. */
body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-dialog.cl-changePwd,
body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-changePwd .modal-content {
  height: auto !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-changePwd .password-change {
  float: none !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 20px !important;
  width: 100% !important;
  margin: 0 0 6px !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-changePwd .password-change > li,
body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-changePwd .password-change > li:first-child {
  float: none !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-changePwd .fpwd_val_notice {
  float: none !important;
  display: grid !important;
  grid-template-columns: 12px minmax(0, 1fr) !important;
  column-gap: 4px !important;
  row-gap: 2px !important;
  width: 100% !important;
  margin: 0 !important;
  color: var(--cl-text-muted) !important;
  font-size: 12px !important;
  line-height: 18px !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-changePwd .fpwd_val_notice :is(.pwdchange_icon, .pwdchange_txt) {
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  min-width: 0;
  overflow-wrap: anywhere;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-removeAcc #removeForm {
  float: none !important;
  width: 100% !important;
  margin: 0 !important;
  border: 0 !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-removeAcc .removeAcc-notice {
  margin: 0 0 20px !important;
  padding: 16px 18px !important;
  background: #FFF8F8 !important;
  border: 0 !important;
  border-left: 3px solid var(--cl-danger) !important;
  border-radius: 0 8px 8px 0 !important;
  color: var(--cl-text) !important;
  font-size: 13.5px !important;
  line-height: 1.65 !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-removeAcc .modal-body ul {
  float: none !important;
  width: 100% !important;
  margin: 0 0 24px !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-removeAcc .modal-body ul li {
  float: none !important;
  display: flex !important;
  align-items: flex-start !important;
  gap: 8px !important;
  width: 100% !important;
  margin: 0 0 10px !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  line-height: 1.55 !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-removeAcc .modal-body ul li:last-child {
  margin-bottom: 0 !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-removeAcc .removeAcc_num {
  flex: 0 0 18px !important;
  margin: 0 !important;
  color: var(--cl-danger) !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-removeAcc .removeAcc_text {
  float: none !important;
  width: auto !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-removeAcc .removeAcc-inputBox {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 14px !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-removeAcc #removeForm > ul:last-child {
  margin-bottom: 0 !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-removeAcc .modal-footer {
  margin-top: 20px !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-removeAccConfirm .modal-body > ul {
  margin: 0 0 20px !important;
  padding: 16px 18px !important;
  background: #FFF8F8 !important;
  border-left: 3px solid var(--cl-danger) !important;
  border-radius: 0 8px 8px 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  line-height: 1.6 !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-removeAccConfirm .modal-body > ul > li {
  margin: 0 !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-removeAccConfirm .modal-body > ul > li + li {
  margin-top: 6px !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-removeAccConfirm .account-delete {
  margin: 0 !important;
  overflow: visible !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-removeAccConfirm .account-delete > p {
  margin: 0 0 12px !important;
  color: var(--cl-text) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-removeAccConfirm .leaves-list {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 8px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-removeAccConfirm .leaves-list > li,
body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-removeAccConfirm .leaves-list > li > div {
  float: none !important;
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  height: auto !important;
  min-height: 44px !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-removeAccConfirm .leaves-list > li > div {
  position: relative !important;
  padding: 10px 12px 10px 40px !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  transition: background-color .12s, border-color .12s !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-removeAccConfirm .leaves-list > li:hover > div {
  background: var(--cl-green-tint) !important;
  border-color: var(--cl-green-line) !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-removeAccConfirm .leaves-list > li.active > div {
  background: var(--cl-green-soft) !important;
  border-color: var(--cl-green) !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-removeAccConfirm .leaves-list > li svg {
  display: none !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-removeAccConfirm .leaves-list > li > div::before {
  position: absolute !important;
  top: 50% !important;
  left: 14px !important;
  width: 18px !important;
  height: 18px !important;
  border: 2px solid #DBDCDF !important;
  border-radius: 50% !important;
  content: "" !important;
  transform: translateY(-50%) !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-removeAccConfirm .leaves-list > li.active > div::before {
  border-color: var(--cl-green) !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-removeAccConfirm .leaves-list > li.active > div::after {
  position: absolute !important;
  top: 50% !important;
  left: 19px !important;
  width: 8px !important;
  height: 8px !important;
  background: var(--cl-green) !important;
  border-radius: 50% !important;
  content: "" !important;
  transform: translateY(-50%) !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-removeAccConfirm .leaves-list > li h5 {
  position: static !important;
  float: none !important;
  width: 100% !important;
  margin: 0 !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1.45 !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-removeAccConfirm .leaves-list > li.active h5 {
  color: var(--cl-green-text) !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-removeAccConfirm .delete-reason-text {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  margin: 0 !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-removeAccConfirm .delete-reason-text textarea.d_reason-input {
  width: 100% !important;
  min-width: 100% !important;
  max-width: 100% !important;
  height: 104px !important;
  min-height: 104px !important;
  max-height: 180px !important;
  padding: 12px 13px !important;
  line-height: 1.55 !important;
  resize: vertical !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal :is(.cl-removeAcc, .cl-removeAccConfirm) .modal-footer > .ok-button-dialog {
  background: var(--cl-danger) !important;
  border-color: var(--cl-danger) !important;
}

body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal :is(.cl-removeAcc, .cl-removeAccConfirm) .modal-footer > .ok-button-dialog:hover,
body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal :is(.cl-removeAcc, .cl-removeAccConfirm) .modal-footer > .ok-button-dialog:focus {
  background: #D63F44 !important;
  border-color: #D63F44 !important;
}

@media (max-width: 600px) {
  body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal > .modal-default {
    align-items: flex-start !important;
    padding: 16px !important;
  }

  body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-dialog {
    max-height: calc(100vh - 32px) !important;
  }

  body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-content {
    max-height: calc(100vh - 32px) !important;
    padding: 32px 24px 24px !important;
    border-radius: 12px !important;
  }

  body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-title {
    margin-bottom: 22px !important;
    font-size: 20px !important;
    line-height: 28px !important;
  }

  body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-changePwd .modal-content {
    max-height: calc(100dvh - 32px) !important;
    padding: 32px 20px 20px !important;
    border-radius: 14px !important;
  }

  body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-changePwd .modal-title {
    margin-bottom: 16px !important;
    font-weight: 700 !important;
  }

  body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-changePwd form#fpwd_change > h3 {
    margin-bottom: 16px !important;
    text-align: left !important;
    overflow-wrap: anywhere;
  }

  body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-changePwd .password-change {
    gap: 16px !important;
  }

  body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-changePwd .modal-footer {
    margin-top: 20px !important;
  }

  body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-removeAcc .removeAcc-inputBox,
  body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .cl-removeAccConfirm .leaves-list {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 767px) {
  /* 레거시 모바일 모달의 100% 높이가 프로필·계정 삭제창 아래를 비우지 않게 한다. */
  body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-dialog.cl-profileImg,
  body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-dialog.cl-profileImg .modal-content,
  body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-dialog.cl-removeAcc,
  body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-dialog.cl-removeAcc .modal-content,
  body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-dialog.cl-removeAcc #removeForm {
    height: auto !important;
  }

  body.cl-dashboard-redesign-page .flat-modal .modal-default.in .modal-dialog.cl-twofactor-backup,
  body.cl-dashboard-redesign-page .flat-modal .modal-default.show .modal-dialog.cl-twofactor-backup,
  body.cl-dashboard-redesign-page .flat-modal .modal-default.fade .modal-dialog.cl-twofactor-backup {
    position: fixed !important;
    top: 50% !important;
    right: auto !important;
    bottom: auto !important;
    left: 50% !important;
    width: calc(100vw - 32px) !important;
    max-width: 560px !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: calc(100vh - 32px) !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    -webkit-transform: translate(-50%, -50%) !important;
    -moz-transform: translate(-50%, -50%) !important;
    -ms-transform: translate(-50%, -50%) !important;
    -o-transform: translate(-50%, -50%) !important;
    transform: translate(-50%, -50%) !important;
  }
}

@media (max-width: 379px) {
  body.cl-dashboard-redesign-page:has(.cl-profile-myinfo-page) .flat-modal .modal-dialog.cl-twofactor-backup .modal-content {
    --twofactor-backup-modal-padding-x: 20px;
  }
}

/* Partnership and investment inquiries */
body.cl-dashboard-redesign-page:has(.cl-source-contact-page) {
  min-width: 0;
  padding-top: 0;
}
.cl-source-contact-page {
  padding: 48px 24px 72px;
  background: #f4f5f9;
  color: #222428;
}
.cl-source-contact-page .cl-source-contact-shell {
  width: 100%;
  max-width: 800px;
  margin: 0 auto;
}
.cl-source-contact-page .row,
.cl-source-contact-page .contentbox {
  width: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
}
.cl-source-contact-page .contact_top h1 {
  margin: 0 0 16px;
  color: #222428;
  font-size: 28px;
  font-weight: 700;
  line-height: 1.4;
}
.cl-source-contact-page .contact_content,
.cl-source-contact-page .contact_content > li {
  margin: 0;
  padding: 0;
  list-style: none;
}
.cl-source-contact-page .contact_content h2 {
  margin: 0 0 28px;
  color: #8a8f98;
  font-size: 14px;
  line-height: 1.7;
  text-transform: none;
}
.cl-source-contact-page .contact_content .qna-guide-text { margin: 0; }
.cl-source-contact-page .contact_content .qna-guide-go { color: var(--cl-green-text); }
.cl-source-contact-page #fwrite {
  padding: 28px 0 0;
  border-top: 1px solid #dfe3e9;
}
.cl-source-contact-page #write_cont {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
  padding: 0;
  margin: 0 0 24px;
  list-style: none;
}
.cl-source-contact-page #write_cont > li { min-width: 0; margin: 0; }
.cl-source-contact-page .cl-contact-full { grid-column: 1 / -1; }
.cl-source-contact-page label:not(.error) {
  display: block;
  margin: 0 0 8px;
  color: #555b65;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.5;
}
.cl-source-contact-page .contact_content input.ed,
.cl-source-contact-page .contact_content textarea.ed {
  display: block;
  box-sizing: border-box;
  width: 100%;
  height: 44px;
  padding: 11px 14px;
  border: 1px solid #d8dce3;
  border-radius: 6px;
  background: #fff;
  color: #222428;
  font-size: 14px;
  line-height: 20px;
  box-shadow: none;
}
.cl-source-contact-page .contact_content textarea.ed {
  height: 240px;
  min-height: 160px;
  resize: vertical;
}
.cl-source-contact-page .contact_content .ed:focus {
  outline: 0;
  border-color: #03C75A;
  box-shadow: 0 0 0 2px rgba(3, 199, 90, .12);
}
.cl-source-contact-page .contact_content .ed:disabled {
  background: #eef0f4;
  color: #8a8f98;
}
.cl-source-contact-page label.error {
  display: block;
  margin: 6px 0 0;
  color: #e5484d;
  font-size: 12px;
  line-height: 1.5;
}
.cl-source-contact-page .cl-contact-captcha {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 0 0 24px;
}
.cl-source-contact-page .kcaptcha-box {
  flex: 0 0 98px;
  width: 98px;
  height: 42px;
  border: 1px solid #dde1e6;
  border-radius: 8px;
  overflow: hidden;
}
.cl-source-contact-page #write_option { height: 100%; margin: 0; padding: 0; }
.cl-source-contact-page #kcaptcha {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  background: #fff;
}
.cl-source-contact-page .cl-contact-captcha-input { flex: 1; min-width: 0; }
.cl-source-contact-page .contact_content #wr_key {
  height: 42px;
  padding: 11px 13px;
  border-color: #dde1e6;
  border-radius: 8px;
  font-size: 13.5px;
  line-height: 1.45;
}
.cl-source-contact-page #wr_key::placeholder { color: #9aa2ae; }
.cl-source-contact-page .cl-contact-captcha-refresh {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 0;
  margin-top: 8px;
  border: 0;
  background: transparent;
  color: #9aa2ae;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.4;
  text-align: left;
}
.cl-source-contact-page .write_submit {
  margin: 0;
  padding: 24px 0 0;
  border-top: 1px solid #dfe3e9;
}
.cl-source-contact-page .g-button-group { display: flex; justify-content: flex-end; }
.cl-source-contact-page .cl-contact-submit {
  min-width: 140px;
  min-height: 44px;
  padding: 10px 24px;
  border: 1px solid #03C75A;
  border-radius: 6px;
  background: #03C75A;
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  line-height: 22px;
}
.cl-source-contact-page .cl-contact-submit:hover { background: #02a851; }
.cl-source-contact-page .cl-contact-submit:disabled { background: #eef0f4; border-color: #d8dce3; color: #8a8f98; cursor: wait; }
.cl-source-contact-page button:focus-visible { outline: 2px solid #03C75A; outline-offset: 3px; }
@media (max-width: 600px) {
  .cl-source-contact-page { padding: 32px 20px 48px; }
  .cl-source-contact-page .contact_top h1 { font-size: 24px; }
  .cl-source-contact-page #write_cont { grid-template-columns: minmax(0, 1fr); }
  .cl-source-contact-page .cl-contact-submit { width: 100%; }
}
@media (max-width: 620px) {
  .cl-source-contact-page .cl-contact-captcha { display: block; }
  .cl-source-contact-page .kcaptcha-box { margin-bottom: 10px; }
}

/* The standalone login page has no dashboard topbar. */
body.cl-dashboard-redesign-page:has(.cl-source-login-page) {
  padding-top: 0;
  background: #fff !important;
}

/* Borderless login fields contrast with the white page. */
.cl-source-login-page.memberIn #flogin .memberIn_infoInput > li .cl-common-form-wrap {
  border: 0;
  border-radius: 3px;
  background: #f4f5f9;
  box-shadow: none;
}
.cl-source-login-page.memberIn #flogin .memberIn_infoInput > li .cl-common-form-group {
  height: 50px;
  padding: 0;
  border-radius: 3px;
  background-color: #f4f5f9 !important;
}
.cl-source-login-page.memberIn #flogin .memberIn_infoInput .cl-common-form-group input.memberIn_input {
  box-sizing: border-box;
  height: 50px;
  padding: 15px;
  border-radius: 3px;
  color: #222428;
  background-color: #f4f5f9 !important;
}
.cl-source-login-page.memberIn #flogin .memberIn_infoInput .cl-common-form-group input.memberIn_input:focus {
  outline: 0;
  background-color: #eef0f4 !important;
}
.cl-source-login-page.memberIn #flogin .memberIn_infoInput .memberIn_label {
  transition: none;
}
.cl-source-login-page.memberIn #flogin .memberIn_infoInput input:not(:placeholder-shown) ~ .memberIn_label,
.cl-source-login-page.memberIn #flogin .memberIn_infoInput input:-webkit-autofill ~ .memberIn_label {
  opacity: 0;
}

/* Production request management */
body.cl-dashboard-redesign-page:has(#cl-production-list) .cl-template-brandbar-spacer {
  display: none;
}

#cl-production-list.cl-dashboard-redesign {
  position: relative;
  width: 100%;
  max-width: 1440px;
  margin: 0 auto;
  padding: 32px;
  color: var(--cl-text);
  font-family: var(--cl-source-font);
  letter-spacing: 0;
}

#cl-production-list *,
#cl-production-list *::before,
#cl-production-list *::after { box-sizing: border-box; }

#cl-production-list > .dashbottom-container {
  width: 100%; max-width: none; margin: 0; padding: 0; background: transparent;
}

#cl-production-list .cl-production-heading,
#cl-production-list .cl-production-list-toolbar,
#cl-production-list .cl-production-list-actions {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
}

#cl-production-list .cl-production-heading { margin-bottom: 24px; }
#cl-production-list h1 { margin: 0; font-size: 24px; font-weight: 700; line-height: 1.4; letter-spacing: 0; }
#cl-production-list .mng-body { width: 100%; margin: 0; padding: 0; background: transparent; }
#cl-production-list .setting-box {
  padding: 24px; margin: 0 0 28px; background: #fff;
  border: solid var(--cl-border); border-width: 1px 0; border-radius: 0; box-shadow: none;
}
#cl-production-list .setting-sub-box { margin: 0; padding: 0; }
#cl-production-list form[name="search_pdt"] {
  display: grid; grid-template-columns: 80px max-content minmax(280px, 1fr);
  align-items: center; gap: 16px;
}
#cl-production-list .pdt-search-wrap h5 { margin: 0; min-width: 0; font-size: 13px; font-weight: 600; color: var(--cl-text-sub); }
#cl-production-list .pdt-search-wrap .br { display: none; }
#cl-production-list .pdt-period-wrap,
#cl-production-list .pdt-date-wrap,
#cl-production-list .pdt-search-box { float: none; min-width: 0; margin: 0; }
#cl-production-list .pdt-btn-toggle { display: inline-flex; gap: 4px; padding: 3px; background: #f4f5f9; border-radius: 6px; }
#cl-production-list .pdt-btn-toggle > .btn {
  float: none; margin: 0; padding: 0 12px; height: 32px; min-height: 32px;
  border: 0; border-radius: 4px; background: transparent; color: var(--cl-text-sub);
}
#cl-production-list .pdt-btn-toggle > .btn.active { background: #fff; color: var(--cl-green-text); box-shadow: 0 1px 3px #14203214; }
#cl-production-list .pdt-date-wrap { display: flex; align-items: center; }
#cl-production-list .pdt-date-box { float: none !important; width: 142px; height: 38px; border-color: var(--cl-border); border-radius: 6px; }
#cl-production-list .pdt-date-box > input { height: 36px; }
#cl-production-list .pdt-date-box > .pdt-date-str { line-height: 36px; font-size: 13px; color: var(--cl-text); }
#cl-production-list .pdt-date-box > .pdt-svg-icon { line-height: 31px; border: 0; }
#cl-production-list .pdt-date-box:focus-within { border-color: #03C75A; outline: 2px solid #03C75A20; }
#cl-production-list .pdt-search-box { grid-column: 2 / -1; display: flex; align-items: center; gap: 10px; }
#cl-production-list .pdt-search-btn-wrap { float: none !important; margin: 0; padding: 0; border: 0; }
#cl-production-list .form-control {
  height: 38px; min-height: 38px; border: 1px solid var(--cl-border); border-radius: 6px;
  box-shadow: none; background-color: #fff; color: var(--cl-text); font: inherit; font-size: 13px;
}
#cl-production-list select.form-control { padding: 0 28px 0 12px; background-position: right 12px center !important; }
#cl-production-list .pdt-field { flex: 0 0 130px; width: 130px; }
#cl-production-list .pdt-search-box .pdt-stx,
#cl-production-list .pdt-search-box .pdt-status { float: none !important; flex: 1; width: auto; min-width: 0; max-width: 430px; margin: 0; }
#cl-production-list .pdt-search-box .pdt-status { display: none; }
#cl-production-list .pdt-search-box .pdt-status.active { display: block !important; }
#cl-production-list .pdt-search-box .pdt-status.active ~ .pdt-stx { display: none; }
#cl-production-list .btn,
#cl-production-list .pdt-memo-save {
  display: inline-flex; align-items: center; justify-content: center; gap: 7px;
  height: 38px; padding: 0 14px; border: 1px solid var(--cl-border); border-radius: 6px;
  background: #fff; color: var(--cl-text); font-size: 13px; font-weight: 600;
  line-height: 1; letter-spacing: 0; white-space: nowrap; text-decoration: none;
}
#cl-production-list .btn:hover { border-color: #03C75A; color: var(--cl-green-text); }
#cl-production-list .pdt-search-btn,
#cl-production-list .pdt-memo-save { background: #03C75A; border-color: #03C75A; color: #fff; }
#cl-production-list .pdt-search-btn:hover,
#cl-production-list .pdt-memo-save:hover { background: #02a750; color: #fff; }
#cl-production-list button:disabled,
#cl-production-list .btn.disabled { opacity: .45; cursor: default; pointer-events: none; }
#cl-production-list :is(button, a, select, textarea, input):focus-visible { outline: 2px solid #03C75A; outline-offset: 2px; }
#cl-production-list .pdt-list-wrap { padding: 0; background: transparent; }
#cl-production-list .cl-production-list-toolbar { flex-wrap: wrap; margin-bottom: 16px; }
#cl-production-list .pdt-list-caption { margin: 0; padding: 0; font-size: 16px; font-weight: 700; }
#cl-production-list .pdt-list-caption strong { margin-left: 6px; color: var(--cl-green-text); }
#cl-production-list .cl-production-list-actions { justify-content: flex-end; }
#cl-production-list .cl-production-list-actions .input-group-btn { float: none !important; width: auto; margin: 0; }
#cl-production-list .table-container { margin: 0; border: 1px solid var(--cl-border); background: #fff; overflow-x: auto; }
#cl-production-list table { min-width: 740px; width: 100%; table-layout: fixed; }
#cl-production-list table th,
#cl-production-list table td { padding: 14px 16px; border: 0; border-bottom: 1px solid var(--cl-border); font-size: 13px; font-weight: 400; line-height: 22px; }
#cl-production-list table th { background: #f8f9fb; color: var(--cl-text-sub); font-size: 12px; font-weight: 600; height: 44px; }
#cl-production-list table td { color: var(--cl-text); }
#cl-production-list table tr:hover > td { background: #fbfdfc; }
#cl-production-list table .no { width: 64px; color: var(--cl-text-sub); }
#cl-production-list table .source { width: 90px; }
#cl-production-list table .status { width: 164px; }
#cl-production-list table .date { width: 170px; color: var(--cl-text-sub); font-size: 12px; }
#cl-production-list table .empty td { height: 200px; vertical-align: middle; color: var(--cl-text-sub); }
#cl-production-list td.status > button {
  min-height: 30px; width: 100%; padding: 4px 8px; border: 0; border-radius: 4px;
  background: #eef2f7; color: #64748b; font-size: 12px; line-height: 20px; white-space: normal;
}
#cl-production-list td.status > button::after { content: '\f107'; font-family: FontAwesome; margin-left: 6px; }
#cl-production-list td.status > button[data-val="0"] { background: #eaf9f1; color: var(--cl-green-text); }
#cl-production-list td.status > button[data-val="1"] { background: #e9f2ff; color: #2f6bff; }
#cl-production-list td.status > button[data-val="9"] { background: #fdf0ef; color: #d64c68; }
#cl-production-list .pdt_status_change { margin-top: 6px; border-radius: 6px; overflow: hidden; background: #fff; }
#cl-production-list .pdt_status_change li button { width: 100%; border: 0; padding: 5px; background: transparent; color: inherit; font-size: 12px; line-height: 20px; }
#cl-production-list .pdt_status_change li.active { background: #eaf9f1; color: var(--cl-green-text); }
#cl-production-list .cl-production-detail-toggle { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; padding: 3px 0; border: 0; background: transparent; text-align: left; color: var(--cl-text); font-weight: 600; }
#cl-production-list .cl-production-detail-toggle span { overflow-wrap: anywhere; }
#cl-production-list .cl-production-detail-toggle i { flex-shrink: 0; color: var(--cl-text-sub); }
#cl-production-list .cl-production-detail-toggle[aria-expanded="true"] i { transform: rotate(180deg); }
#cl-production-list td.contents > ul { margin: 16px 0 0; padding: 16px 0 0; border-top: 1px solid var(--cl-border); }
#cl-production-list td.contents > ul > li { margin: 0 0 12px; }
#cl-production-list td.contents > ul > li label { min-width: 110px !important; margin: 0 0 6px; color: var(--cl-text-sub); font-size: 12px; font-weight: 500; }
#cl-production-list td.contents .for_label { max-width: 100%; color: var(--cl-text); overflow-wrap: anywhere; }
#cl-production-list td.contents > ul > li.full textarea { min-height: 120px; height: 140px; padding: 12px; border: 1px solid var(--cl-border); border-radius: 6px; resize: vertical; font: inherit; font-size: 13px; line-height: 1.6; }
#cl-production-list td.contents .nav-tabs { display: flex; gap: 20px; margin: 16px 0; border-bottom: 1px solid var(--cl-border); }
#cl-production-list td.contents .nav-tabs > li { margin: 0; }
#cl-production-list td.contents .nav-tabs > li > a { padding: 10px 0; border: 0; border-bottom: 2px solid transparent; background: transparent; color: var(--cl-text-sub); }
#cl-production-list td.contents .nav-tabs > li.active > a { border-bottom-color: #03C75A; color: var(--cl-green-text); }
#cl-production-list td.contents .tab-content { padding: 0; border: 0; background: transparent; }
#cl-production-list td.contents .pdt-history { font: inherit; color: var(--cl-text-sub); white-space: normal; }
#cl-production-list .pdt-pagination ul { display: flex; justify-content: center; gap: 6px; margin: 24px 0 0; }
#cl-production-list .pdt-pagination ul li { margin: 0; }
#cl-production-list .pdt-pagination ul li a { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; padding: 0; border: 1px solid transparent; border-radius: 6px !important; background: transparent; color: var(--cl-text-sub); line-height: 1; }
#cl-production-list .pdt-pagination ul li.active a { border-color: #03C75A; color: var(--cl-green-text); background: #fff; }
#cl-production-list .pdt-pagination ul li.none { display: none; }

@media (max-width: 1000px) {
  #cl-production-list form[name="search_pdt"] { grid-template-columns: 80px minmax(0, 1fr); }
  #cl-production-list .pdt-date-wrap { grid-column: 2; }
  #cl-production-list .pdt-search-box { grid-column: 2; }
}
@media (max-width: 600px) {
  #cl-production-list.cl-dashboard-redesign { padding: 24px 16px 40px; }
  #cl-production-list .cl-production-heading { align-items: flex-start; flex-wrap: wrap; gap: 12px; }
  #cl-production-list h1 { font-size: 22px; }
  #cl-production-list .setting-box { padding: 20px 0; background: transparent; }
  #cl-production-list form[name="search_pdt"] { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  #cl-production-list .pdt-date-wrap,
  #cl-production-list .pdt-search-box { grid-column: 1; }
  #cl-production-list .pdt-date-box { flex: 1; width: 0; }
  #cl-production-list .pdt-search-box { flex-wrap: wrap; }
  #cl-production-list .pdt-search-box .pdt-field { flex: 0 0 110px; width: 110px; }
  #cl-production-list .pdt-search-btn-wrap { width: 100%; }
  #cl-production-list .pdt-search-btn { width: 100%; }
  #cl-production-list .cl-production-list-actions { flex-wrap: wrap; justify-content: flex-start; }
  #cl-production-list .cl-production-list-toolbar { gap: 16px; }
}

/* Account-wide contact messages retain their existing filters and actions. */
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-message-notice-wrap,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-message-notice-wrap * { box-sizing: border-box; }
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-message-notice-wrap {
  position: fixed !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  transform: none !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  z-index: 1000003;
}
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-message-notice-wrap > .modal-default {
  position: fixed !important;
  inset: 0 !important;
  display: flex !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  transform: none !important;
  align-items: center;
  justify-content: center;
  padding: 16px !important;
  overflow-y: auto !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: rgba(0, 0, 0, .45);
}
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-message-notice-wrap + .modal-backdrop { opacity: 0 !important; }
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-message-notice-wrap .modal-dialog.cl-source-message-notice {
  position: relative !important;
  inset: auto !important;
  width: 460px !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  min-width: 0 !important;
  margin: auto !important;
  padding: 0 !important;
  transform: none !important;
}
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-message-notice-wrap .cl-source-message-notice .modal-content {
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 32px 24px 24px !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 14px !important;
  background: #fff;
  box-shadow: 0 20px 50px rgba(20, 24, 32, .24);
  font-family: var(--cl-font);
  letter-spacing: 0;
}
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-message-notice-wrap .cl-source-message-notice .modal-body {
  width: 100% !important;
  max-width: none !important;
  min-height: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text-sub);
  font-size: 14px;
  line-height: 22px;
  text-align: center;
  word-break: keep-all;
  overflow-wrap: anywhere;
}
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-message-notice-wrap .cl-source-message-notice .modal-title {
  margin: 0 24px 16px !important;
  padding: 0 !important;
  color: var(--cl-text);
  font-size: 18px !important;
  font-weight: 700 !important;
  line-height: 26px;
}
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-message-notice-wrap .cl-source-message-notice .modal-footer {
  position: static !important;
  display: flex !important;
  background: transparent !important;
  flex-direction: column;
  justify-content: center;
  flex-wrap: nowrap;
  gap: 14px;
  max-width: none !important;
  width: 100% !important;
  margin: 24px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
}
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-message-notice-wrap .modal-footer::before,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-message-notice-wrap .modal-footer::after,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-message-notice-wrap > .modal-default > .cl-mobile-btn { display: none !important; }
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-message-notice-wrap .cl-source-message-notice .modal-footer .btn {
  flex: 0 0 auto;
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  min-height: 46px;
  height: 46px !important;
  margin: 0 !important;
  padding: 10px 12px !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 8px !important;
  background: #fff !important;
  color: var(--cl-text-sub) !important;
  font-size: 13px !important;
  font-weight: 600;
  line-height: 18px;
  white-space: normal;
}
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-message-notice-wrap .cl-source-message-notice .modal-footer .close-button-dialog:not(.ok-button-dialog) {
  background: transparent !important;
  border-color: transparent !important;
}
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-message-notice-wrap .cl-source-message-notice .modal-footer .close-button-dialog:not(.ok-button-dialog):hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-message-notice-wrap .cl-source-message-notice .modal-footer .close-button-dialog:not(.ok-button-dialog):focus-visible {
  background: #eaf9f1 !important;
  color: var(--cl-green-text) !important;
}
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-message-notice-wrap .cl-source-message-notice .modal-footer .ok-button-dialog {
  flex-grow: 0;
  border-color: var(--cl-green) !important;
  background: var(--cl-green) !important;
  color: #fff !important;
}
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-message-notice-wrap .cl-source-message-notice .modal-footer .btn:hover { background: #f4f5f9 !important; }
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-message-notice-wrap .cl-source-message-notice .modal-footer .ok-button-dialog:is(:hover, :focus-visible) { background: var(--cl-green-hover) !important; }
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-message-notice-wrap .cl-source-message-notice .modal-content > .close {
  position: absolute !important;
  top: 10px !important;
  right: 10px !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 30px !important;
  height: 30px !important;
  padding: 0 !important;
  margin: 0 !important;
  opacity: 1;
  color: var(--cl-text-sub);
}
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-message-notice-wrap .modal-content > .close svg { display: block; width: 12px; height: 12px; fill: currentColor; }
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-message-notice-wrap button:focus-visible { outline: 2px solid var(--cl-green); outline-offset: 2px; }
body.cl-dashboard-redesign-page:has(.cl-source-message-page) { padding-top: 0; }
body.cl-dashboard-redesign-page:has(.cl-source-message-page) .mobile-detail-popup.messagehead { display: none !important; }
body.cl-dashboard-redesign-page:has(.cl-source-message-page):has(.cl-source-sidebar) {
  padding-top: var(--cl-source-topbar-h);
}
body.cl-dashboard-redesign-page:has(.cl-source-message-page) .dashboard.cl-dashboard-redesign {
  min-height: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}
body.cl-dashboard-redesign-page:has(.cl-source-sidebar) .cl-source-message-page {
  width: auto;
  margin-left: calc(var(--cl-source-app-gutter) + var(--cl-source-sidebar-w));
  margin-right: var(--cl-source-app-gutter);
}
@media (max-width: 900px) {
  body.cl-dashboard-redesign-page:has(.cl-source-sidebar) .cl-source-message-page {
    margin-left: 0;
    margin-right: 0;
  }
}
.cl-dashboard-redesign.cl-source-message-page {
  position: relative; width: 100%; height: auto; min-height: calc(100vh - 56px);
  margin: 0; padding: 28px 32px 60px; background: #f4f5f9;
  font-family: var(--cl-source-font); color: #222428;
}
.cl-dashboard-redesign.cl-source-message-page .container.message { width: 950px; max-width: 100%; height: auto; margin: 0; padding: 0; }
.cl-source-message-page .messagetitle { display: block; padding: 0 0 24px; }
.cl-source-message-page .cl-message-breadcrumb { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin: 0 0 20px; color: var(--cl-text); font-size: 20px; font-weight: 700; line-height: 1.35; }
.cl-source-message-page .cl-message-breadcrumb > a { color: inherit; text-decoration: none; }
.cl-source-message-page .cl-message-breadcrumb > a:hover,
.cl-source-message-page .cl-message-breadcrumb > a:focus-visible { color: var(--cl-green-text); }
.cl-source-message-page .cl-message-breadcrumb > span { color: var(--cl-text-muted); font-size: 23px; font-weight: 400; line-height: 1; }
.cl-source-message-page .messagetitle .title h1.mypage-title { margin: 0; color: var(--cl-text-sub); font-size: 20px; line-height: 1.35; font-weight: 700; letter-spacing: 0; }
.cl-source-message-page .messagetitle .title .message-subtitle { margin: -10px 0 0; color: var(--cl-text-sub); font-size: 13.5px; line-height: 1.55; }
.cl-source-message-page .contentbox.message,
.cl-source-message-page .contentbox.message > .row,
.cl-source-message-page .box.aboutMessage { float: none; width: 100%; margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.cl-dashboard-redesign.cl-source-message-page .contentbox.message { margin: 0 0 24px; padding: 22px 24px; background: var(--cl-surface); border: 1px solid var(--cl-border); border-radius: var(--cl-radius-lg); box-shadow: var(--cl-shadow-panel); }
.cl-source-message-page .box.aboutMessage .message-boxTop { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; height: auto; margin: 0 0 18px; }
.cl-source-message-page .box.aboutMessage .message-boxTop .message-select-box { flex: 0 1 180px; min-width: 0; margin: 0; padding: 0; }
.cl-source-message-page .message-select { width: 100%; }
.cl-source-message-page .message-select > a.dropdown-toggle {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  width: 100% !important; min-width: 0 !important; max-width: none !important; height: 35px !important;
  padding: 0 12px; border: 1px solid #e0e3e9; border-radius: 6px;
  background: #fff; color: #222428; font-size: 13px; cursor: pointer;
}
.cl-source-message-page .message-select > a.dropdown-toggle:focus-visible { outline: 2px solid #03C75A; outline-offset: 2px; }
.cl-source-message-page #message-site-select.message-select > a.dropdown-toggle,
.cl-source-message-page #block-select.message-select > a.dropdown-toggle { padding: 0 12px; border: 1px solid #e0e3e9; color: #222428; }
.cl-source-message-page #message-site-select.message-select .dropdown-menu li.active,
.cl-source-message-page #block-select.message-select .dropdown-menu li.active,
.cl-source-message-page #messageSearch-select .dropdown-menu li.active,
.cl-source-message-page #messageCnt-select .dropdown-menu li.active { background: #eaf9f1; color: var(--cl-green-text); }
.cl-source-message-page #message-site-select .site-name,
.cl-source-message-page #block-select .block-name { flex: 1; min-width: 0; max-width: none; font-size: 13px; }
.cl-source-message-page #block-select.message-select .block-name { color: var(--cl-green-text); }
.cl-dashboard-redesign.cl-source-message-page .message-boxTop .message-select:is(#message-site-select, #block-select, #messageSearch-select, #messageCnt-select) > a.dropdown-toggle > .cl-redesign-select-arrow {
  display: block;
  flex: none;
  position: static;
  width: 14px;
  height: 14px;
  margin: 0;
  transform: none;
  fill: none;
  stroke: currentColor;
  color: var(--cl-text-muted);
}
.cl-dashboard-redesign.cl-source-message-page .message-boxTop .message-select-box.disabled #block-select > a.dropdown-toggle > .cl-redesign-select-arrow { color: var(--color-bg-disabled); }
.cl-dashboard-redesign.cl-source-message-page .message-boxTop .message-select:is(#message-site-select, #block-select, #messageSearch-select, #messageCnt-select).open > a.dropdown-toggle > .cl-redesign-select-arrow { transform: rotate(180deg); }
.cl-source-message-page .message-select:is(#message-site-select, #block-select, #messageSearch-select, #messageCnt-select) > .dropdown-menu {
  top: calc(100% + 4px);
  left: 0;
  right: auto;
  width: max-content;
  min-width: 100%;
  max-width: min(280px, calc(100vw - 32px));
  margin: 0;
  padding: 4px;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(20, 24, 32, .14);
}
.cl-source-message-page #block-select.message-select > .dropdown-menu,
.cl-source-message-page #messageCnt-select.message-select > .dropdown-menu {
  left: auto;
  right: 0;
}
.cl-source-message-page .message-select:is(#message-site-select, #block-select, #messageSearch-select, #messageCnt-select) > .dropdown-menu > ul {
  max-height: 280px;
  margin: 0;
  padding: 0;
  overflow-y: auto;
  list-style: none;
}
.cl-source-message-page .message-select:is(#message-site-select, #block-select, #messageSearch-select, #messageCnt-select) > .dropdown-menu li {
  min-height: 34px;
  margin: 0;
  padding: 8px 12px;
  border-radius: var(--cl-radius-sm);
  color: var(--cl-text);
  font-size: 12.5px;
  font-weight: 400;
  line-height: 18px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  cursor: pointer;
}
.cl-source-message-page .message-select:is(#message-site-select, #block-select, #messageSearch-select, #messageCnt-select) > .dropdown-menu li + li { margin-top: 2px; }
.cl-source-message-page .message-select:is(#message-site-select, #block-select, #messageSearch-select, #messageCnt-select) > .dropdown-menu li:hover,
.cl-source-message-page .message-select:is(#message-site-select, #block-select, #messageSearch-select, #messageCnt-select) > .dropdown-menu li.active {
  background: #e4f7ec;
  color: var(--cl-green-text);
}
.cl-source-message-page .message-select:is(#message-site-select, #block-select, #messageSearch-select, #messageCnt-select) > .dropdown-menu li.active { font-weight: 700; }
.cl-source-message-page .box.aboutMessage .message-cntBox { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; float: none !important; width: auto; margin: 0 0 0 auto; padding: 0; }
.cl-source-message-page .box.aboutMessage .message-cntBox .message-search { min-width: 0; margin: 0; padding: 0; border: 0; }
.cl-source-message-page #search_form { display: flex; align-items: center; gap: 8px; margin: 0; }
.cl-source-message-page #messageSearch-select { flex: 0 0 100px; }
.cl-source-message-page .box.aboutMessage .message-cntBox .message-search #messageSearch-input { flex: 1; min-width: 0; width: 200px; height: 35px; margin: 0; border: 1px solid #e0e3e9; border-radius: 6px; background: #fff; }
.cl-source-message-page #messageSearch-input input { border-radius: inherit; background: transparent; font-size: 13px; }
.cl-source-message-page #messageSearch-input:focus-within { border-color: #03C75A; }
.cl-source-message-page .box.aboutMessage .message-cntBox .message-cnt-box { width: auto; margin: 0; padding: 0; border: 0; }
.cl-source-message-page .message-delBox { min-height: 38px; }
.cl-source-message-page .box.aboutMessage .message-cntBox .message-delbtn { min-height: 38px; padding: 9px 12px; border: 1px solid #f1cdd0; border-radius: 6px; background: #fff; color: #e5484d; }
.cl-source-message-page .box.aboutMessage .message-cntBox .message-delbtn svg { fill: currentColor; }
.cl-source-message-page .message-delwrapper { display: none !important; }
.cl-source-message-page .cl-message-table-scroll { width: 100%; overflow-x: auto; background: #fff; border: 1px solid #e5e7eb; border-radius: 8px; }
.cl-source-message-page .message_content { width: 100%; margin: 0; padding: 0; }
.cl-source-message-page .message_content .list-table { display: table; width: 100%; min-width: 900px; border: 0; table-layout: fixed; }
.cl-source-message-page .message_content .list-table colgroup { display: table-column-group; }
.cl-source-message-page .message_content .list-table tbody { display: table-row-group; }
.cl-source-message-page .message_content .list-table tr { display: table-row; height: 52px; padding: 0; border: 0; }
.cl-source-message-page .message_content .list-table tr.title { display: table-row; height: 44px; }
.cl-source-message-page .message_content .list-table th,
.cl-source-message-page .message_content .list-table td {
  display: table-cell; position: static; float: none; width: auto; height: auto; margin: 0 !important;
  padding: 12px; border: 0; border-bottom: 1px solid #eef0f4;
  vertical-align: middle; text-align: left; font-size: 13px; line-height: 20px;
}
.cl-source-message-page .message_content .list-table th { background: #f8f9fb; color: #8a8f98; font-weight: 600; }
.cl-source-message-page .container.mypagepc .message_content .list-table td { position: static; float: none; width: auto; padding: 12px; }
.cl-source-message-page .container.mypagepc .message_content .list-table td.check { width: 44px; padding: 0; }
.cl-source-message-page #message-site-select.message-select .site-name { color: #222428; }
.cl-source-message-page .message_content .list-table .check { width: 44px; padding: 0; text-align: center; }
.cl-source-message-page .message_content col.sitename,
.cl-source-message-page .message_content col.menu,
.cl-source-message-page .message_content col.blockname { width: 130px; }
.cl-source-message-page .message_content col.name { width: 110px; }
.cl-source-message-page .message_content col.datetime { width: 112px; }
.cl-source-message-page .message_content .check .newcheckbox { position: relative; width: 44px; height: 44px; }
.cl-source-message-page .message_content .check .newcheckbox label { position: relative; display: block; width: 44px; height: 44px; margin: 0; }
.cl-source-message-page .message_content .check .newcheckbox svg { left: 14px; top: 14px; transform: none; }
.cl-source-message-page .message_content .list-table span.m_sitename,
.cl-source-message-page .message_content .list-table span.m_menu,
.cl-source-message-page .message_content .list-table span.m_blockname { display: none; }
.cl-source-message-page .message_content .message-group:not(.contact_message):hover { background: #f3fcf7; }
.cl-source-message-page .message_content .message-group.new-message .subject a { color: #222428; font-weight: 600; }
.cl-source-message-page .message_content tr td.subject .newCheck { background: #03C75A; }
.cl-source-message-page .box.aboutMessage .messageLang:not(:empty) {
  display: inline-flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: auto;
  min-width: 28px;
  height: 24px;
  margin-right: 6px;
  padding: 0 8px;
  border-radius: 999px;
  background: var(--cl-green-soft);
  color: var(--cl-green-text);
  font-size: 12px;
  font-weight: 700;
  line-height: 18px;
  vertical-align: middle;
  text-transform: uppercase;
}
.cl-source-message-page .messageLang:empty { display: none; }
.cl-source-message-page .message_content .list-table tr.contact_message td { background: #f8fafb; }
.cl-source-message-page .message_content .list-table tr.contact_message td.subject { padding: 20px 24px 20px 12px; white-space: normal; }
.cl-source-message-page .contact_message_detail { padding: 0; }
.cl-source-message-page .contact_message_detail ul { margin: 0; padding: 0; list-style: none; }
.cl-source-message-page .message_content .contact_message_detail ul li { display: grid; grid-template-columns: 110px minmax(0, 1fr); gap: 16px; margin: 0 0 12px; }
.cl-source-message-page .message_content .contact_message_detail ul li:last-child { margin: 0; }
.cl-source-message-page .message_content .contact_message_detail ul li div.detail-title,
.cl-source-message-page .message_content .contact_message_detail ul li div.detail-content { float: none; width: auto; max-width: none; font-size: 13px; overflow-wrap: anywhere; }
.cl-source-message-page .message_content .contact_message_detail pre { white-space: pre-wrap; overflow-wrap: anywhere; font-family: inherit; font-size: 13px; }
.cl-source-message-page .message_content .paging { margin: 24px 0 0; padding: 0; background: transparent; }
.cl-source-message-page .message_content .paging a,
.cl-source-message-page .message_content .paging strong { border-radius: 4px; }
.cl-source-message-page .message_content .paging strong { color: var(--cl-green-text); border-color: #03C75A; }
.cl-source-message-page .box.aboutMessage.empty .cl-message-table-scroll { display: none; }
.cl-source-message-page .box.aboutMessage.empty .message-empty { padding: 100px 20px; border: 0; border-radius: 0; background: transparent; color: #8a8f98; }
@media (max-width: 1100px) {
  .cl-source-message-page .box.aboutMessage .message-cntBox { width: 100%; margin-left: 0; }
  .cl-source-message-page .box.aboutMessage .message-cntBox .message-search { flex: 1; }
}
@media (max-width: 600px) {
  .cl-dashboard-redesign.cl-source-message-page { padding: 24px 16px 40px; }
  .cl-dashboard-redesign.cl-source-message-page .contentbox.message { padding: 18px 16px; }
  .cl-source-message-page .box.aboutMessage .message-boxTop { gap: 10px; }
  .cl-source-message-page .box.aboutMessage .message-boxTop .message-select-box { flex: 1 1 calc(50% - 5px); }
  .cl-source-message-page .box.aboutMessage .message-cntBox { gap: 10px; }
  .cl-source-message-page .box.aboutMessage .message-cntBox .message-search { flex: 1 1 100%; }
  .cl-source-message-page .box.aboutMessage .message-cntBox .message-cnt-box { margin-left: auto; }
}

/* Mobile source parity: restore page flow and dashboard card composition. */
@media (max-width: 900px) {
  body.cl-dashboard-redesign-page > .mobile-detail-popup {
    display: none !important;
  }

  body.cl-dashboard-redesign-page .dashbottom-wrap > .dashbottom-container > .mobile-title {
    display: none !important;
  }

  body.cl-dashboard-redesign-page > .dashbottom-wrap {
    position: relative !important;
    inset: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: calc(100vh - var(--cl-source-topbar-h)) !important;
    max-height: none !important;
    margin: 0 !important;
    overflow: visible !important;
    transform: none !important;
  }

  body.cl-dashboard-redesign-page :is(
    #cl-shopping-order-page,
    #cl-shopping-order-search-page,
    #cl-shopping-inquiry-page
  ) .dashbottom-wrap {
    position: relative !important;
    inset: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    transform: none !important;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-source-dashboard-head {
    grid-template-columns: minmax(0, 1fr) !important;
    width: 100%;
    min-width: 0;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-source-dashboard-head > *,
  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-source-summary-cards,
  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-source-notice-panel {
    width: 100%;
    min-width: 0;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-source-summary-cards {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-source-sales-panel {
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-source-sales-panel .cl-source-panel-head > h3 {
    flex: none;
    width: auto !important;
    min-width: max-content;
    white-space: nowrap;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-source-period-tabs {
    gap: 12px;
    font-size: 12.5px;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-source-period-tabs > span {
    padding-right: 5px;
    padding-left: 5px;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-source-sales-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    align-items: start;
    row-gap: 18px;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-source-sales-stats > div {
    padding: 0 !important;
    border: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-source-sales-stats > div:first-child {
    grid-column: 1 / -1;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-source-sales-stats strong {
    font-size: 20px;
    line-height: 26px;
    white-space: nowrap;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-source-sales-stats strong.date {
    font-size: 15px;
    line-height: 22px;
    white-space: normal;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .site-space .space-captraffic,
  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-source-gauge-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 20px !important;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .site-space .dashboard-subtitle-wrap {
    display: none !important;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .site-space .space-captraffic {
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .site-space .sitecaptraffic-title {
    display: none !important;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .site-capacity,
  body.cl-dashboard-redesign-page .cl-dashboard-home .site-traffic,
  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-source-gauge-wrap {
    margin-right: auto !important;
    margin-left: auto !important;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-home-kakao-panel {
    top: 0 !important;
    height: auto !important;
    min-height: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .main-kakaotalk-wrap .main-pc-wrap.cl-source-alimtalk-panel.charge-bar-inline {
    height: 79px !important;
    min-height: 79px !important;
    flex-direction: row !important;
    align-items: center !important;
    padding: 20px 16px !important;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .charge-left {
    min-width: 0 !important;
    flex: 1 1 auto !important;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .charge-input {
    width: auto !important;
    min-width: 0 !important;
    flex: 1 1 auto !important;
  }
}

/* 901–992px에서 레거시 용량 카드와 알림톡 배치가 다시 적용되는 구간을 정리한다. */
@media (max-width: 992px) {
  /* Flow 86615275: 레거시 알림 레이아웃이 추가하는 우측 10px 패딩을 제거한다. */
  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-home-notification-panel .inbox {
    padding-right: 0 !important;
  }
}

@media (min-width: 901px) and (max-width: 992px) {
  body.cl-dashboard-redesign-page .cl-dashboard-home .site-space .dashboard-subtitle-wrap,
  body.cl-dashboard-redesign-page .cl-dashboard-home .site-space .sitecaptraffic-title {
    display: none !important;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .site-space .space-captraffic {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 20px !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .site-capacity,
  body.cl-dashboard-redesign-page .cl-dashboard-home .site-traffic,
  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-source-gauge-wrap {
    margin-right: auto !important;
    margin-left: auto !important;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .main-kakaotalk-wrap .main-pc-wrap.cl-source-alimtalk-panel.charge-bar-inline {
    flex-direction: row !important;
  }
}

@media (max-width: 640px) {
  body.cl-dashboard-redesign-page .dashboard-section {
    padding: 18px 15px 52px !important;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-source-summary-cards {
    gap: 6px;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-source-summary-card {
    flex-direction: column;
    justify-content: flex-start;
    gap: 8px;
    min-width: 0;
    padding: 12px 4px;
    text-align: center;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-source-summary-icon {
    width: 28px;
    height: 28px;
    border-radius: var(--r-md, 8px);
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-source-summary-icon svg {
    width: 16px;
    height: 16px;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-source-summary-meta {
    width: 100%;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-source-summary-meta strong {
    font-size: var(--fs-3xl, 20px);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-source-summary-meta em {
    margin-top: 6px;
    font-size: var(--fs-xs, 11px);
    line-height: 1.5;
    white-space: normal;
    overflow-wrap: anywhere;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-home-notification-panel {
    --cl-inbox-row-height: 56px;
    --cl-inbox-row-gap: 8px;
    --cl-inbox-row-padding: 10px 0;
    --cl-inbox-icon-size: 24px;
  }

  /* Bootstrap 행 정렬용 가상 요소가 flex 간격을 차지하지 않게 한다. */
  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-home-notification-panel .inbox .list-item.row::before,
  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-home-notification-panel .inbox .list-item.row::after {
    display: none;
    content: none;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .inbox .nav-tabs > li {
    flex: 1 0 auto;
    width: auto;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .inbox .nav-tabs > li > a {
    padding-right: 3px;
    padding-left: 3px;
  }

  body.cl-dashboard-redesign-page > .dashbottom-wrap {
    padding: 20px 14px 40px !important;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .site-space.cl-home-space-panel {
    height: 192px !important;
    min-height: 192px !important;
    padding: 18px 16px !important;
  }

  body.cl-dashboard-redesign-page :is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table tbody tr.listZero,
  body.cl-dashboard-redesign-page :is(#cl-member-list-page, #cl-member-leavelist-page) .tableListContainer table tbody tr.listZero > td,
  body.cl-dashboard-redesign-page #cl-member-waitlist-page .cl-source-waitlist-table tbody tr.listZero,
  body.cl-dashboard-redesign-page #cl-member-waitlist-page .cl-source-waitlist-table tbody tr.listZero > td,
  body.cl-dashboard-redesign-page #cl-member-blocklist-page .cl-source-blocklist-table tbody tr.listZero,
  body.cl-dashboard-redesign-page #cl-member-blocklist-page .cl-source-blocklist-table tbody tr.listZero > td {
    height: 100px !important;
    min-height: 100px !important;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-search-page .cl-source-order-search-panel {
    min-height: 0;
    padding: 16px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-search-page .section-search-container {
    padding: 4px 14px 16px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-search-page .search-box > ul {
    align-items: stretch;
    flex-direction: column;
    gap: 8px;
    padding: 14px 0;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-search-page .search-box > ul > li:first-child,
  body.cl-dashboard-redesign-page #cl-shopping-order-search-page .search-box > ul > li:not(:first-child) {
    flex: none;
    width: 100%;
    line-height: 20px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-search-page .search-box > ul:first-child .cl-s-productSearch {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    width: 100%;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-search-page .duration {
    width: auto;
    padding: 0 4px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-search-page .duration span {
    white-space: nowrap;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-search-page .change-date-box {
    grid-column: 1 / -1;
    width: 100%;
    margin: 10px 0 0;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-search-page .order-vcal-wrap,
  body.cl-dashboard-redesign-page #cl-shopping-order-search-page .order-vcal-wrap .vperiod {
    width: 100%;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-search-page .cl-source-order-search-naver {
    display: flex;
    justify-content: flex-start;
    margin-top: 12px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-search-page .search-box > ul:nth-child(3) {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-search-page .search-box > ul:nth-child(3) > li:first-child {
    margin-bottom: 0;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-search-page .search-box > ul:nth-child(3) > li:nth-child(2) {
    justify-self: end;
    width: auto;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-search-page .search-box > ul:nth-child(3) > li.status-condition {
    grid-column: 1 / -1;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-search-page .all-checkbox-title {
    width: auto;
    height: auto;
    margin: 0;
  }
}

@media (min-width: 361px) and (max-width: 640px) {
  body.cl-dashboard-redesign-page #cl-member-signup-settings-page .cl-signup-basic-fields {
    gap: 18px;
  }

  body.cl-dashboard-redesign-page #cl-member-signup-settings-page .cl-signup-field {
    display: grid !important;
    grid-template-columns: 126px minmax(0, 1fr);
    align-items: center;
    gap: 24px;
    max-width: 100% !important;
  }

  body.cl-dashboard-redesign-page #cl-member-signup-settings-page .cl-signup-field--description {
    align-items: start;
  }

  body.cl-dashboard-redesign-page #cl-member-signup-settings-page .cl-signup-field-label {
    width: 126px !important;
    margin: 0 !important;
  }

  body.cl-dashboard-redesign-page #cl-member-signup-settings-page .cl-signup-field-control {
    width: 100% !important;
    min-width: 0;
  }

  body.cl-dashboard-redesign-page #cl-member-signup-settings-page :is(.cl-signup-select, .cl-signup-select--activate):not(.cl-signup-select--approval),
  body.cl-dashboard-redesign-page #cl-member-signup-settings-page :is(.cl-signup-select, .cl-signup-select--activate):not(.cl-signup-select--approval) .bootstrap-select,
  body.cl-dashboard-redesign-page #cl-member-signup-settings-page :is(.cl-signup-select, .cl-signup-select--activate):not(.cl-signup-select--approval) .dropdown-toggle {
    width: 100% !important;
    max-width: 100%;
  }

  body.cl-dashboard-redesign-page #cl-member-signup-settings-page .cl-signup-field--captcha {
    grid-template-columns: 126px minmax(0, 1fr);
  }
}

@media (max-width: 360px) {
  body.cl-dashboard-redesign-page #cl-member-signup-settings-page .cl-signup-basic-fields {
    gap: 22px;
  }

  body.cl-dashboard-redesign-page #cl-member-signup-settings-page .cl-signup-field,
  body.cl-dashboard-redesign-page #cl-member-signup-settings-page .cl-signup-field--captcha {
    display: block !important;
    max-width: 100% !important;
  }

  body.cl-dashboard-redesign-page #cl-member-signup-settings-page .cl-signup-field-label,
  body.cl-dashboard-redesign-page #cl-member-signup-settings-page .cl-signup-field--captcha .cl-signup-field-label {
    width: max-content !important;
    margin-bottom: 8px !important;
  }

  body.cl-dashboard-redesign-page #cl-member-signup-settings-page .cl-signup-field-control {
    width: 100% !important;
  }
}

@media (max-width: 360px) {
  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-source-sales-stats strong.date {
    font-size: 13px;
    white-space: nowrap;
  }

  body.cl-dashboard-redesign-page .cl-source-topbar {
    padding-right: 10px;
    padding-left: 10px;
  }

  body.cl-dashboard-redesign-page .cl-source-hamburger {
    width: 26px;
  }

  body.cl-dashboard-redesign-page .cl-source-brand-area {
    gap: 4px;
  }

  body.cl-dashboard-redesign-page .cl-source-logo .logo-svg {
    width: 112px;
    height: auto;
  }

  body.cl-dashboard-redesign-page .cl-source-top-actions {
    gap: 4px;
  }

  body.cl-dashboard-redesign-page .cl-source-user {
    gap: 2px;
    font-size: 12px;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-source-sales-panel .cl-source-panel-head,
  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-source-period-tabs {
    flex-wrap: wrap;
  }
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .form-label,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > #status-product-box .form-label.product-label,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .form-wrap:has(.switch-quantity) .form-label.quantity-label,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .form-wrap.option-toggle .form-label.product-state {
  font-size: 15px !important;
}

/* 상품정보설정 고급설정 모달 타이틀 정렬 보정 */
body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-title {
  height: 42px;
  padding-left: 15px;
  line-height: 42px;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-section[data-type="1"] .options-title {
  margin-top: 26px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-section[data-type="1"] {
  padding-bottom: 15px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal h5.hasChild {
  float: left !important;
  width: 112px !important;
  height: 42px !important;
  margin: 20px 0 -42px 24px !important;
  padding: 0 !important;
  padding-left: 15px !important;
  color: #222428 !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 42px !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal h5.hasChild:has(+ .options-more-section) {
  transform: none !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal h5.hasChild:has(+ .options-text-section) {
  margin-top: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal h5.hasChild:has(+ .options-more-section) {
  margin-top: 27px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal h5.hasChild + .options-state {
  min-height: 42px !important;
  margin-top: 0 !important;
  padding: 0 70px 15px 136px !important;
}

body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal h5.hasChild + .options-state .options-row,
body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal h5.hasChild + .options-state .options-sortable {
  margin-left: 0 !important;
}

@media (max-width: 767px) {
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal h5.hasChild {
    float: none !important;
    width: auto !important;
    height: auto !important;
    margin: 20px 16px 8px !important;
    line-height: 18px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal h5.hasChild + .options-state {
    min-height: 0 !important;
    padding: 0 16px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-modal .options-title {
    height: auto;
    line-height: 18px;
  }
}

/* 로그 상세: 화면 안에 맞는 카드와 본문 스크롤 */
body.cl-dashboard-redesign-page .cl-source-log-detail-wrap,
body.cl-dashboard-redesign-page .cl-source-log-detail-wrap * {
  box-sizing: border-box;
}
body.cl-dashboard-redesign-page .flat-modal.cl-source-log-detail-wrap {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  background: rgba(0, 0, 0, .45) !important;
  z-index: 1000003 !important;
}
body.cl-dashboard-redesign-page .cl-source-log-detail-wrap > .modal-default {
  position: fixed !important;
  inset: 0 !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 24px 16px !important;
  overflow: hidden !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
body.cl-dashboard-redesign-page .cl-source-log-detail-wrap + .modal-backdrop {
  opacity: 0 !important;
  pointer-events: none;
}
body.cl-dashboard-redesign-page .cl-source-log-detail-wrap .cl-mobile-btn.close {
  display: none !important;
}
body.cl-dashboard-redesign-page .cl-source-log-detail-wrap .modal-dialog.cl-source-log-detail-modal {
  position: relative !important;
  width: 560px !important;
  max-width: 100% !important;
  height: auto !important;
  max-height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}
body.cl-dashboard-redesign-page .cl-source-log-detail-wrap .modal-dialog.cl-source-log-detail-wide {
  width: 900px !important;
}
body.cl-dashboard-redesign-page .cl-source-log-detail-wrap .cl-source-log-detail-modal .modal-content {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: auto !important;
  min-height: 0 !important;
  max-height: calc(100vh - 48px);
  max-height: calc(100dvh - 48px);
  padding: 28px 32px !important;
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--cl-border, #E5E7EB);
  border-radius: 14px;
  box-shadow: 0 24px 64px rgba(0, 0, 0, .28);
  color: var(--cl-text, #222428);
}
body.cl-dashboard-redesign-page .cl-source-log-detail-wrap .cl-source-log-detail-modal .modal-body {
  display: flex;
  flex-direction: column;
  min-height: 0;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden;
  text-align: left;
}
body.cl-dashboard-redesign-page .cl-source-log-detail-wrap .cl-source-log-detail-modal .modal-title {
  flex: none;
  margin: 0 36px 24px !important;
  padding: 0 !important;
  color: var(--cl-text, #222428);
  font-size: 20px;
  font-weight: 700;
  line-height: 28px;
  text-align: center !important;
}
body.cl-dashboard-redesign-page .cl-source-log-detail-wrap .cl-source-log-detail-modal .slog-container {
  display: block;
  flex: 0 1 auto;
  min-height: 0;
  height: auto !important;
  max-height: none !important;
  width: 100%;
  margin: 0;
  padding: 0 !important;
  overflow: auto;
  overscroll-behavior: contain;
  font-size: 13px;
  line-height: 1.6;
}
body.cl-dashboard-redesign-page .cl-source-log-detail-wrap .slog-content {
  width: 100%;
  overflow-x: auto;
}
body.cl-dashboard-redesign-page .cl-source-log-detail-wrap .table-padding {
  display: none;
}
body.cl-dashboard-redesign-page .cl-source-log-detail-wrap .slog-caption {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 8px;
  margin: 0 0 16px;
  font-size: 14px;
  font-weight: 600;
}
body.cl-dashboard-redesign-page .cl-source-log-detail-wrap .slog-caption > span {
  color: var(--cl-text-sub, #8A8F98);
  font-size: 12px;
  font-weight: 400;
}
body.cl-dashboard-redesign-page .cl-source-log-detail-wrap .modal-body table.slog-badge-table th,
body.cl-dashboard-redesign-page .cl-source-log-detail-wrap .modal-body table.slog-badge-table td {
  height: auto;
  padding: 12px;
  border-color: #E5E7EB;
  line-height: 20px;
  vertical-align: middle;
  overflow-wrap: anywhere;
}
body.cl-dashboard-redesign-page .cl-source-log-detail-wrap .modal-body table.slog-badge-table th {
  background: #F4F5F9;
  color: #8A8F98;
  font-weight: 600;
}
body.cl-dashboard-redesign-page .cl-source-log-detail-wrap .modal-body table.slog-badge-table.slog-badge-onoff {
  width: 100% !important;
  min-width: 0;
}
body.cl-dashboard-redesign-page .cl-source-log-detail-wrap .modal-body table.slog-badge-table.slog-badge-onoff tr > :first-child {
  width: 50%;
}
body.cl-dashboard-redesign-page .cl-source-log-detail-wrap .modal-body table.slog-badge-table .slog-after {
  color: var(--cl-green-text);
  fill: var(--cl-green);
}
body.cl-dashboard-redesign-page .cl-source-log-detail-wrap .modal-body table.slog-badge-table :is(.cl-slog-change-arrow, .cl-slog-row-arrow) {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  vertical-align: middle;
}
body.cl-dashboard-redesign-page .cl-source-log-detail-wrap .cl-source-log-detail-modal .modal-footer {
  display: flex !important;
  flex: none;
  flex-direction: column;
  width: 100% !important;
  max-width: none !important;
  align-self: stretch;
  margin: 24px 0 0 !important;
  padding: 0 !important;
  border: 0;
  background: transparent !important;
}
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-log-detail-wrap .modal-default .modal-dialog.cl-source-log-detail-modal .modal-footer .btn {
  width: 100% !important;
  max-width: none !important;
  align-self: stretch;
  height: 46px !important;
  padding: 0 16px !important;
  border: 0;
  border-radius: 8px;
  background: #03C75A !important;
  color: #fff !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 46px;
}
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-log-detail-wrap .modal-default .modal-dialog.cl-source-log-detail-modal .modal-footer .btn:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-log-detail-wrap .modal-default .modal-dialog.cl-source-log-detail-modal .modal-footer .btn:focus-visible {
  background: #0E964A !important;
}
body.cl-dashboard-redesign-page .cl-source-log-detail-wrap .modal-content > button.close {
  position: absolute;
  top: 20px;
  right: 22px;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #8A8F98;
  opacity: 1;
  z-index: 1;
  transition: transform .18s cubic-bezier(.34, 1.56, .64, 1), background .12s;
}
body.cl-dashboard-redesign-page .cl-source-log-detail-wrap .modal-content > button.close svg {
  display: block;
  width: 15px;
  height: 15px;
  fill: currentColor;
}
body.cl-dashboard-redesign-page .cl-source-log-detail-wrap .modal-content > button.close:hover,
body.cl-dashboard-redesign-page .cl-source-log-detail-wrap .modal-content > button.close:focus-visible {
  background: #F1F2F5;
  color: #222428;
  transform: rotate(90deg);
}
@media (max-width: 600px) {
  body.cl-dashboard-redesign-page .cl-source-log-detail-wrap .cl-source-log-detail-modal .modal-content {
    padding: 24px 20px !important;
  }
  body.cl-dashboard-redesign-page .cl-source-log-detail-wrap .modal-content > button.close {
    right: 16px;
    top: 18px;
  }
}

/* 대시보드 본인인증 안내 */
body.cl-dashboard-redesign-page .cl-source-identity-wrap,
body.cl-dashboard-redesign-page .cl-source-identity-wrap * {
  box-sizing: border-box;
}
body.cl-dashboard-redesign-page .flat-modal.cl-source-identity-wrap {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  background: rgba(0, 0, 0, .45) !important;
  z-index: 1000003 !important;
}
body.cl-dashboard-redesign-page .cl-source-identity-wrap > .modal-default {
  position: fixed !important;
  inset: 0 !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 24px 16px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: auto !important;
}
body.cl-dashboard-redesign-page .cl-source-identity-wrap + .modal-backdrop {
  opacity: 0 !important;
  pointer-events: none;
}
body.cl-dashboard-redesign-page .cl-source-identity-wrap .cl-mobile-btn.close {
  display: none !important;
}
body.cl-dashboard-redesign-page .cl-source-identity-wrap .modal-dialog.cl-source-identity-modal {
  position: relative !important;
  width: 460px !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}
body.cl-dashboard-redesign-page .cl-source-identity-wrap .cl-source-identity-modal .modal-content {
  width: 100%;
  min-height: 0;
  max-height: calc(100vh - 48px);
  max-height: calc(100dvh - 48px);
  padding: 32px !important;
  overflow: auto;
  border: 1px solid #E5E7EB;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 24px 64px rgba(0, 0, 0, .28);
}
body.cl-dashboard-redesign-page .cl-source-identity-wrap .cl-source-identity-modal .modal-body {
  width: 100%;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: center;
}
body.cl-dashboard-redesign-page .cl-source-identity-wrap .cl-source-identity-modal .modal-title {
  margin: 0 24px 20px !important;
  padding: 0 !important;
  color: #222428;
  font-size: 22px;
  font-weight: 700;
  line-height: 30px;
}
body.cl-dashboard-redesign-page .cl-source-identity-wrap .cl-source-identity-description {
  color: #8A8F98;
  font-size: 14px;
  line-height: 24px;
  word-break: keep-all;
}
body.cl-dashboard-redesign-page .cl-source-identity-wrap .cl-source-identity-modal .modal-footer {
  display: flex !important;
  flex-direction: column;
  width: 100%;
  margin: 24px 0 0 !important;
  padding: 0 !important;
  border: 0;
  background: transparent !important;
  box-shadow: none;
}
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-identity-wrap .modal-default .modal-dialog .modal-footer .btn {
  width: 100% !important;
  max-width: none !important;
  height: 46px !important;
  padding: 0 16px !important;
  border: 0 !important;
  border-radius: 8px;
  background: transparent !important;
  color: #8A8F98 !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  line-height: 46px !important;
}
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-identity-wrap .modal-default .modal-dialog .modal-footer .btn:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-identity-wrap .modal-default .modal-dialog .modal-footer .btn:focus-visible {
  background: #F1F2F5 !important;
  color: #222428 !important;
}
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-identity-wrap .modal-default .modal-dialog .modal-footer .cl-source-identity-start {
  background: var(--cl-green) !important;
  color: #fff !important;
  font-size: 15px !important;
  font-weight: 700 !important;
}
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-identity-wrap .modal-default .modal-dialog .modal-footer .cl-source-identity-start:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-identity-wrap .modal-default .modal-dialog .modal-footer .cl-source-identity-start:focus-visible {
  background: var(--cl-green-hover) !important;
  color: #fff !important;
}
body.cl-dashboard-redesign-page .cl-source-identity-wrap .modal-content > button.close {
  position: absolute;
  top: 18px;
  right: 18px;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #8A8F98;
  opacity: 1;
  z-index: 1;
  transition: transform .18s cubic-bezier(.34, 1.56, .64, 1), background .12s;
}
body.cl-dashboard-redesign-page .cl-source-identity-wrap .modal-content > button.close svg {
  display: block;
  width: 15px;
  height: 15px;
  fill: currentColor;
}
body.cl-dashboard-redesign-page .cl-source-identity-wrap .modal-content > button.close:hover,
body.cl-dashboard-redesign-page .cl-source-identity-wrap .modal-content > button.close:focus-visible {
  background: #F1F2F5;
  color: #222428;
  transform: rotate(90deg);
}
@media (max-width: 600px) {
  body.cl-dashboard-redesign-page .cl-source-identity-wrap .cl-source-identity-modal .modal-content {
    padding: 28px 24px !important;
  }
}

/* 알림 설정 공통 팝업: 발송 메일·앱 비밀번호 도움말·알림톡 템플릿 */
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap,
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap * {
  box-sizing: border-box;
}
body.cl-dashboard-redesign-page .flat-modal.cl-source-settings-dialog-wrap {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  overflow: auto !important;
  background: rgba(0, 0, 0, .45) !important;
  z-index: 1000003 !important;
}
body.cl-dashboard-redesign-page .flat-modal.cl-source-smtp-guide-wrap {
  z-index: 1000005 !important;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap > .modal-default {
  position: relative !important;
  inset: auto !important;
  display: flex !important;
  align-items: flex-start;
  justify-content: center;
  width: 100% !important;
  min-height: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 24px 16px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap + .modal-backdrop {
  opacity: 0 !important;
  pointer-events: none;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .cl-mobile-btn.close {
  display: none !important;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .modal-dialog.cl-source-settings-dialog {
  position: relative !important;
  inset: auto !important;
  flex-shrink: 0;
  width: 560px !important;
  max-width: 100% !important;
  height: auto !important;
  margin: auto 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .modal-dialog.cl-shopping-legal-modal,
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .modal-dialog.cl-delivery-copy-confirm,
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .modal-dialog.cl-delivery-delete-confirm,
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .modal-dialog.cl-naverpay-use-check {
  width: 440px !important;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .cl-source-settings-dialog .modal-content {
  width: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  padding: 32px !important;
  overflow: visible !important;
  border: 1px solid #E5E7EB !important;
  border-radius: 14px !important;
  background: #fff !important;
  box-shadow: 0 24px 64px rgba(0, 0, 0, .28) !important;
  color: #222428;
  font-family: inherit !important;
  font-size: 13px;
  line-height: 1.6;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .cl-source-settings-dialog .modal-body {
  width: 100% !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  font-family: inherit !important;
  text-align: left;
}
/* PG·비회원 구매 변경 확인은 기존 안내 문구의 중앙 정렬을 유지한다. */
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .cl-naverpay-use-check .modal-body {
  text-align: center;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .cl-source-settings-dialog .modal-title {
  height: auto !important;
  margin: 0 24px 20px !important;
  padding: 0 !important;
  color: #222428;
  font-size: 22px;
  font-weight: 700;
  line-height: 30px !important;
  text-align: center;
}
/* 기본설정 제목·설명과 사이트 추가 제한 안내는 내용 높이의 공통 카드로 표시한다. */
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap.cl-dashboard-redesign .modal-dialog.cl-basic-seo-guide-modal,
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap.cl-dashboard-redesign .modal-dialog.cl-marketing-seo-lock-modal {
  width: 440px !important;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .modal-dialog.cl-site-add-limit-modal {
  width: 430px !important;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .cl-basic-seo-guide-modal .modal-content,
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap.cl-dashboard-redesign .cl-marketing-seo-lock-modal .modal-content,
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .cl-site-add-limit-modal .modal-content {
  height: auto !important;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .modal-dialog.cl-basic-seo-guide-modal .modal-content .modal-body,
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap.cl-dashboard-redesign .modal-dialog.cl-marketing-seo-lock-modal .modal-content .modal-body,
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .modal-dialog.cl-site-add-limit-modal .modal-content .modal-body {
  color: var(--cl-text-sub);
  font-size: 14px;
  letter-spacing: 0;
  text-align: center;
  overflow-wrap: break-word;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .modal-dialog.cl-basic-seo-guide-modal .modal-content .modal-body .modal-title,
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap.cl-dashboard-redesign .modal-dialog.cl-marketing-seo-lock-modal .modal-content .modal-body .modal-title,
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .modal-dialog.cl-site-add-limit-modal .modal-content .modal-body .modal-title {
  font-family: inherit;
  font-size: 20px;
  letter-spacing: 0;
}

body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap.cl-dashboard-redesign .modal-dialog.cl-basic-seo-guide-modal .modal-content,
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap.cl-dashboard-redesign .modal-dialog.cl-marketing-seo-lock-modal .modal-content {
  padding: 44px 28px 34px !important;
  border: 0 !important;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap.cl-dashboard-redesign .cl-basic-seo-guide-modal .modal-body .modal-title,
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap.cl-dashboard-redesign .cl-marketing-seo-lock-modal .modal-body .modal-title {
  margin-bottom: 14px !important;
}
body.cl-dashboard-redesign-page .cl-dashboard-redesign .cl-basic-seo-guide-modal .cl-basic-seo-settings-link {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 3px;
  min-height: 44px;
  margin-top: 14px;
  border-radius: var(--r-sm, 6px);
  color: var(--cl-green-text);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.5;
  text-decoration: none;
  text-underline-offset: 3px;
}
body.cl-dashboard-redesign-page .cl-dashboard-redesign .cl-basic-seo-guide-modal .cl-basic-seo-settings-link svg {
  position: relative;
  top: .5px;
  flex: none;
  width: 11px;
  height: 11px;
  transition: transform var(--t-color, .12s) ease;
}
@media (hover: hover) and (pointer: fine) {
  body.cl-dashboard-redesign-page .cl-dashboard-redesign .cl-basic-seo-guide-modal .cl-basic-seo-settings-link:hover {
    text-decoration: underline;
  }
  body.cl-dashboard-redesign-page .cl-dashboard-redesign .cl-basic-seo-guide-modal .cl-basic-seo-settings-link:hover svg {
    transform: translateX(2px);
  }
}
body.cl-dashboard-redesign-page .cl-dashboard-redesign .cl-basic-seo-guide-modal .cl-basic-seo-settings-link:focus-visible {
  outline: 2px solid var(--cl-green);
  outline-offset: 2px;
}
@media (prefers-reduced-motion: reduce) {
  body.cl-dashboard-redesign-page .cl-dashboard-redesign .cl-basic-seo-guide-modal .cl-basic-seo-settings-link svg {
    transition: none;
  }
}

body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .cl-source-settings-dialog .smtp-settings__header {
  height: auto !important;
  margin-bottom: 24px !important;
  color: #8A8F98;
  font-size: 13px;
  text-align: center;
  word-break: keep-all;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .smtp-settings__header p {
  margin: 0;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .smtp-platform-selector,
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .smtp-setting-inputBox {
  width: 100%;
  margin: 0 0 24px !important;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .smtp-platform-btns {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  width: 100%;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .smtp-platform-btn {
  width: 100%;
  height: 86px;
  margin: 0 !important;
  padding: 14px 4px;
  border: 1px solid #E0E3EB;
  border-radius: 8px;
  justify-content: center;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .smtp-platform-btn.active {
  border-color: #03C75A;
  background: #E9F8F0;
  box-shadow: inset 0 0 0 1px #03C75A;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .smtp-platform-btn:hover,
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .smtp-platform-btn:focus-visible {
  border-color: #03C75A;
  outline: 0;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .12);
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .platform-icon img {
  display: block;
  width: 26px;
  height: 26px;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .platform-name {
  color: #696C71;
  font-size: 12px;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .cl-source-settings-dialog .smtp-label {
  height: auto !important;
  margin-bottom: 8px;
  color: #222428 !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 20px;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .smtp-setting-inputBox input,
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .setting-inputBox input,
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .smtp-custom-select .select-styled {
  width: 100%;
  min-width: 0;
  margin: 0 !important;
  height: 40px;
  padding: 9px 12px;
  border: 1px solid #E0E3EB;
  border-radius: 8px;
  background: #fff;
  color: #222428;
  font-size: 13px;
  line-height: 20px;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap input::placeholder {
  color: #AEB4BF;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap input:not(:disabled):hover,
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .smtp-custom-select .select-styled:hover {
  border-color: #BFC6D2;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap input:focus,
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap input:focus:hover,
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .smtp-custom-select .select-styled.active {
  border-color: #03C75A;
  outline: 0;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .12);
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .setting-help-text,
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .smtp-error-message,
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .smtp-ajax-error-message {
  height: auto;
  margin-top: 6px;
  font-size: 12px;
  line-height: 20px;
  overflow-wrap: anywhere;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .setting-help-text {
  color: #8A8F98;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .setting-help-text a,
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .guide-wrap .step p a,
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .smtp-custom-select .select-options li.selected {
  color: var(--cl-green-text);
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .setting-help-text a:hover {
  color: #0E964A;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .smtp-advanced-settings,
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .smtp-notice__header,
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .smtp-notice__content {
  width: 100%;
  max-height: none;
  padding: 16px;
  background: #F8F9FB;
  border-color: #E0E3EB;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .smtp-advanced-settings {
  border: 1px solid #E0E3EB;
  border-radius: 8px;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .advanced-settings-row-2 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .advanced-settings-col-2,
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .advanced-settings-col-3,
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .smtp-custom-select {
  width: 100%;
  min-width: 0;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .smtp-notice__header {
  height: 44px;
  margin-top: 0;
  border-radius: 8px 8px 0 0;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .smtp-notice__content {
  border-radius: 0 0 8px 8px;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .smtp-notice__content--title {
  height: auto;
  font-weight: 600;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .cl-source-settings-dialog .modal-footer {
  position: static !important;
  display: flex !important;
  flex-direction: column;
  gap: 14px;
  width: 100% !important;
  max-width: none !important;
  margin: 24px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .modal-footer::before,
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .modal-footer::after {
  display: none;
}
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-settings-dialog-wrap .modal-default .modal-dialog .modal-footer .btn {
  width: 100% !important;
  max-width: none !important;
  height: 46px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  border: 0 !important;
  border-radius: 8px;
  background: transparent !important;
  color: #8A8F98 !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  line-height: 46px !important;
}
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-settings-dialog-wrap .modal-default .modal-dialog .modal-footer .btn:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-settings-dialog-wrap .modal-default .modal-dialog .modal-footer .btn:focus-visible {
  background: #F1F2F5 !important;
  color: #222428 !important;
}
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-settings-dialog-wrap .modal-default .modal-dialog .modal-footer .ok-button-dialog {
  background: #03C75A !important;
  color: #fff !important;
  font-size: 15px !important;
  font-weight: 700 !important;
}
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-settings-dialog-wrap .modal-default .modal-dialog .modal-footer .ok-button-dialog:not(:disabled):hover,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal.cl-source-settings-dialog-wrap .modal-default .modal-dialog .modal-footer .ok-button-dialog:not(:disabled):focus-visible {
  background: var(--cl-green-hover, #02b351) !important;
  color: #fff !important;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .modal-content > button.close {
  position: absolute !important;
  top: 18px !important;
  right: 18px !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 8px;
  background: transparent;
  color: #8A8F98;
  opacity: 1;
  z-index: 1;
  transition: transform .18s cubic-bezier(.34, 1.56, .64, 1), background .12s;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .modal-content > button.close svg {
  display: block;
  width: 15px !important;
  height: 15px !important;
  fill: currentColor;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .modal-content > button.close:hover,
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .modal-content > button.close:focus-visible {
  background: #F1F2F5;
  color: #222428;
  transform: rotate(90deg);
}
body.cl-dashboard-redesign-page .cl-source-smtp-guide-wrap .guide-top,
body.cl-dashboard-redesign-page .cl-source-smtp-guide-wrap .guide-wrap,
body.cl-dashboard-redesign-page .cl-source-smtp-guide-wrap .guide-wrap .step,
body.cl-dashboard-redesign-page .cl-source-smtp-guide-wrap .guide-wrap .step > div {
  position: static !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}
body.cl-dashboard-redesign-page .cl-source-smtp-guide-wrap .guide-wrap .step > div {
  margin-top: 24px !important;
}
body.cl-dashboard-redesign-page .cl-source-smtp-guide-wrap .guide-wrap .step p {
  margin: 20px 0 12px !important;
  font-family: inherit;
}
body.cl-dashboard-redesign-page .cl-source-smtp-guide-wrap .guide-wrap .step img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
}
body.cl-dashboard-redesign-page .cl-source-smtp-guide-wrap .cl-source-settings-dialog .modal-content > .modal-footer {
  display: none !important;
}
@media (max-width: 600px) {
  body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .cl-source-settings-dialog .modal-content {
    padding: 28px 24px !important;
  }
  body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .smtp-platform-btns {
    gap: 8px;
  }
}
/* 알림 메일: 발송 주소 설정 및 플랫폼별 중첩 가이드. 서버/저장 기능은 기존 SMTP를 재사용한다. */
.cl-dashboard-redesign.cl-source-smtp-wrap:not(.cl-source-smtp-guide-wrap) .modal-dialog.member-smtp-settings-modal .modal-content {
  padding: 44px 34px 34px !important;
  border: 0 !important;
}
.cl-dashboard-redesign.cl-source-smtp-wrap .member-smtp-settings-modal .modal-body .modal-title {
  margin-bottom: 10px !important;
  font-size: 20px;
}
.cl-dashboard-redesign.cl-source-smtp-wrap .member-smtp-settings-modal .smtp-settings__header {
  margin-bottom: 26px !important;
  font-size: 13.5px;
}
.cl-dashboard-redesign.cl-source-smtp-wrap .member-smtp-settings-modal .smtp-platform-selector > .smtp-label {
  display: none;
}
.cl-dashboard-redesign.cl-source-smtp-wrap .member-smtp-settings-modal .smtp-platform-btns {
  gap: 10px;
  margin: 0;
}
.cl-dashboard-redesign.cl-source-smtp-wrap .member-smtp-settings-modal .smtp-platform-selector {
  margin-bottom: 22px !important;
}
.cl-dashboard-redesign.cl-source-smtp-wrap .member-smtp-settings-modal .smtp-platform-btn {
  height: 72px;
  margin: 0;
  padding: 0 6px;
  gap: 7px;
  border: 1px solid var(--cl-border);
  border-radius: 10px;
  background: #fff;
}
.cl-dashboard-redesign.cl-source-smtp-wrap .member-smtp-settings-modal .smtp-platform-btn.active {
  border-color: var(--cl-green);
  background: var(--cl-green-soft);
  box-shadow: inset 0 0 0 1px var(--cl-green-line);
}
.cl-dashboard-redesign.cl-source-smtp-wrap .member-smtp-settings-modal .platform-icon img {
  width: 22px;
  height: 22px;
}
.cl-dashboard-redesign.cl-source-smtp-wrap .member-smtp-settings-modal .platform-name {
  color: var(--cl-text-sub);
  font-size: 13px;
  font-weight: 600;
}
.cl-dashboard-redesign.cl-source-smtp-wrap .member-smtp-settings-modal .smtp-platform-btn.active .platform-name {
  color: var(--cl-green-text);
}
.cl-dashboard-redesign.cl-source-smtp-wrap .member-smtp-settings-modal .smtp-setting-inputBox {
  margin-bottom: 20px !important;
}
.cl-dashboard-redesign.cl-source-smtp-wrap .member-smtp-settings-modal .smtp-guide {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  min-height: 30px;
  color: var(--cl-green-text);
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
}
.cl-dashboard-redesign.cl-source-smtp-wrap .member-smtp-settings-modal .smtp-guide svg {
  width: 11px;
  height: 11px;
}
.cl-dashboard-redesign.cl-source-smtp-wrap .member-smtp-settings-modal .smtp-guide:hover {
  color: var(--cl-green-text);
  text-decoration: underline;
}
.cl-dashboard-redesign.cl-source-smtp-wrap .member-smtp-settings-modal .smtp-notice {
  --cl-source-font: var(--font, 'CreatorlinkSansKR', 'Apple SD Gothic Neo', 'Malgun Gothic', -apple-system, BlinkMacSystemFont, sans-serif);
  overflow: hidden;
  border: 1px solid var(--cl-border);
  border-radius: 10px;
  font-family: var(--cl-source-font);
  font-weight: 400;
  line-height: normal;
}
.cl-dashboard-redesign.cl-source-smtp-wrap .member-smtp-settings-modal .smtp-notice__header {
  height: auto;
  padding: 13px 16px;
  border: 0;
  border-radius: 0;
  background: var(--cl-bg-2, #FAFBFC);
  color: var(--cl-text);
  font-size: 13.5px;
  font-weight: 600;
  line-height: normal;
}
.cl-dashboard-redesign.cl-source-smtp-wrap .member-smtp-settings-modal .smtp-notice__header > span {
  height: auto;
  color: inherit;
  font: inherit;
}
.cl-dashboard-redesign.cl-source-smtp-wrap .member-smtp-settings-modal .smtp-notice__header--btn {
  flex: none;
  width: 14px;
  height: 14px;
  fill: var(--cl-text-muted);
}
.cl-dashboard-redesign.cl-source-smtp-wrap .member-smtp-settings-modal .smtp-notice__content {
  padding: 16px;
  border: 0;
  border-top: 1px solid var(--cl-border);
  border-radius: 0;
  background: var(--cl-surface);
}
.cl-dashboard-redesign.cl-source-smtp-wrap .member-smtp-settings-modal .smtp-notice__content > div {
  margin: 0;
}
.cl-dashboard-redesign.cl-source-smtp-wrap .member-smtp-settings-modal .smtp-notice__content > div + div {
  margin-top: 16px;
}
.cl-dashboard-redesign.cl-source-smtp-wrap .member-smtp-settings-modal .smtp-notice__content > div:has(> .smtp-notice__content--content:empty) {
  display: none;
}
.cl-dashboard-redesign.cl-source-smtp-wrap .member-smtp-settings-modal .smtp-notice__content--title {
  margin-bottom: 5px;
  color: var(--cl-text);
  font-size: 13px;
  font-weight: 600;
  line-height: normal;
}
.cl-dashboard-redesign.cl-source-smtp-wrap .member-smtp-settings-modal .smtp-notice__content--content {
  color: var(--cl-text-sub);
  font-size: 12.5px;
  font-weight: 400;
  line-height: 1.65;
  overflow-wrap: anywhere;
}
.cl-dashboard-redesign.cl-source-smtp-wrap .member-smtp-settings-modal .smtp-custom-select .select-options {
  width: 100%;
  border-color: var(--cl-border);
  border-radius: 8px;
  padding: 4px;
  box-shadow: var(--cl-shadow-drop);
}
.cl-dashboard-redesign.cl-source-smtp-wrap .member-smtp-settings-modal .smtp-custom-select .select-options li {
  border-radius: 6px;
}
.cl-dashboard-redesign.cl-source-smtp-wrap .member-smtp-settings-modal .smtp-custom-select .select-options li:is(:hover, .selected) {
  background: var(--cl-green-soft);
  color: var(--cl-green-text);
}
body.cl-dashboard-redesign-page .flat-modal.cl-dashboard-redesign.cl-source-smtp-guide-wrap {
  z-index: 1000004 !important;
  overflow: hidden !important;
}
body.cl-dashboard-redesign-page .cl-dashboard-redesign.cl-source-smtp-guide-wrap > .modal.modal-default {
  padding: 2.6vh 3vw !important;
  padding-block: 2.6dvh !important;
}
.cl-dashboard-redesign.cl-source-smtp-guide-wrap .modal-dialog.member-smtp-guide-modal.cl-source-settings-dialog {
  width: min(94vw, 1280px) !important;
}
.cl-dashboard-redesign.cl-source-smtp-guide-wrap .modal-dialog.member-smtp-guide-modal .modal-content {
  display: flex;
  flex-direction: column;
  height: 94.8vh !important;
  height: 94.8dvh !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 0 !important;
}
.cl-dashboard-redesign.cl-source-smtp-wrap .modal-dialog .modal-content > button.close {
  top: 16px !important;
  right: 16px !important;
}
/* 뒤에 로드되는 레거시 .modal-body의 inline-block보다 구체적으로 지정해 내부 스크롤 높이를 유지한다. */
.cl-dashboard-redesign.cl-source-smtp-guide-wrap .modal-dialog.member-smtp-guide-modal .modal-content .modal-body {
  display: flex;
  flex: 1;
  flex-direction: column;
  min-height: 0;
}
.cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .guide-top {
  flex: none;
  padding: 0 !important;
  border-bottom: 1px solid var(--cl-border);
  background: #fff;
  z-index: 0 !important;
}
.cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .guide-menu {
  position: sticky;
  top: 0;
  z-index: 1;
  border-bottom: 1px solid var(--cl-line, #EEF0F4);
  background: #fff;
}
.cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .guide-menu ul {
  display: flex;
  justify-content: center;
  gap: 26px;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 16px 24px;
  list-style: none;
}
.cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .guide-menu ul li {
  position: relative;
  left: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 1 168px;
  width: auto;
  min-width: 0;
  height: 70px;
  min-height: 70px;
  margin: 0;
  padding: 3px 8px 0;
  border: 1px solid var(--cl-border);
  border-radius: 12px !important;
  color: var(--cl-text-sub);
  background: #fff;
  cursor: pointer;
  text-align: center;
  transition: border-color .12s, color .12s, box-shadow .12s;
}
.cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .guide-menu ul li:hover:not(.active) {
  border-color: var(--cl-border-hover, #D5D9E0);
  color: var(--cl-text);
}
.cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .guide-menu ul li.active {
  border: 2px solid var(--cl-green);
  color: var(--cl-green-text);
  background: #fff;
  box-shadow: 0 0 0 4px rgba(3, 199, 90, .14);
}
.cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .guide-menu ul li p {
  margin: 0;
  color: inherit;
  font-size: 13px;
  font-weight: 700;
}
.cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .guide-menu .line {
  display: none;
}
.cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .guide-menu li::after {
  content: '';
  position: absolute;
  top: 50%;
  right: -17px;
  width: 7px;
  height: 7px;
  border-top: 2px solid var(--cl-green-line);
  border-right: 2px solid var(--cl-green-line);
  transform: translateY(-50%) rotate(45deg);
}
.cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .guide-menu li:last-child::after {
  display: none;
}
.cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .guide-wrap {
  flex: 1;
  min-height: 0;
  overflow: auto !important;
  overscroll-behavior: contain;
  scroll-behavior: smooth;
  z-index: 0;
}
.cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .guide-wrap .step {
  display: block;
  float: none;
  max-width: 900px !important;
  margin: 0 auto !important;
  padding: 34px 28px 90px !important;
}
.cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .guide-wrap .step > div {
  counter-reset: smtp-guide-row;
  margin: 0 0 34px !important;
  padding: 26px 0 0 !important;
  border-top: 1px solid var(--cl-line, #EEF0F4);
}
.cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .guide-wrap .step > div:first-child {
  padding-top: 6px !important;
  border-top: 0;
}
.cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .guide-wrap .step h3 {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 10px !important;
  color: var(--cl-text) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
}
.cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .smtp-guide-step-number {
  display: inline-flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--cl-green);
  color: #fff;
  font-size: 11px;
}
.cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .smtp-guide-row {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: 22px 0 10px !important;
  color: var(--cl-text);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.85;
  overflow-wrap: anywhere;
}
.cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .smtp-guide-row-text {
  min-width: 0;
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
}
.cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .smtp-guide-row::before {
  counter-increment: smtp-guide-row;
  content: 'STEP ' counter(smtp-guide-row, decimal-leading-zero);
  flex: none;
  padding: 3px 7px;
  border-radius: 4px;
  background: var(--cl-ink-2s, #5C616B);
  color: #fff;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
}
.cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .smtp-guide-note {
  margin: 22px 0 20px;
  padding: 13px 15px;
  border: 1px solid var(--cl-border);
  border-radius: 10px;
  background: var(--cl-bg-2, #FAFBFC);
  color: var(--cl-text-sub);
  font-size: 12px;
  line-height: 1.8;
  overflow-wrap: anywhere;
}
.cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .smtp-guide-list {
  margin: 0 0 20px;
  padding: 0;
  list-style: none;
  color: var(--cl-text-sub);
  font-size: 12px;
  line-height: 1.85;
  overflow-wrap: anywhere;
}
.cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .smtp-guide-list li {
  position: relative;
  margin-bottom: 6px;
  padding-left: 11px;
}
.cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .smtp-guide-list li::before {
  content: '-';
  position: absolute;
  left: 0;
}
.cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .smtp-guide-shot {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: center;
  gap: 20px;
  margin-bottom: 8px;
  padding: 22px;
  border: 1px solid var(--cl-border);
  border-radius: 12px;
  background: var(--cl-bg-3, #F1F2F5);
}
.cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .smtp-guide-shot .img-responsive {
  width: 540px;
  max-width: 100%;
  height: auto;
  margin: 0 !important;
  border: 0;
  border-radius: 6px;
  background: #fff;
  box-shadow: var(--cl-shadow-card, 0 2px 12px rgba(20, 24, 32, .14));
}
.cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .guide-wrap .guide_bold {
  color: var(--cl-text);
  font-weight: 700;
}
.cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .guide-wrap .smtp-guide-row a {
  color: var(--cl-green-text) !important;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.cl-dashboard-redesign.cl-source-smtp-wrap :is(.smtp-guide, .guide-menu li):focus-visible {
  outline: 2px solid var(--cl-green);
  outline-offset: 3px;
}
@media (max-width: 1180px) {
  body.cl-dashboard-redesign-page .cl-dashboard-redesign.cl-source-smtp-guide-wrap > .modal.modal-default {
    padding: 1.8vh 2vw !important;
    padding-block: 1.8dvh !important;
  }
  .cl-dashboard-redesign.cl-source-smtp-guide-wrap .modal-dialog.member-smtp-guide-modal.cl-source-settings-dialog {
    width: 96vw !important;
  }
  .cl-dashboard-redesign.cl-source-smtp-guide-wrap .modal-dialog.member-smtp-guide-modal .modal-content {
    height: 96.4vh !important;
    height: 96.4dvh !important;
  }
  .cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .guide-menu ul {
    padding: 13px 16px;
  }
  .cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .guide-menu ul li.active {
    box-shadow: 0 0 0 3px rgba(3, 199, 90, .14);
  }
  .cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .guide-wrap .step {
    padding: 24px 18px 72px !important;
  }
  .cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .guide-wrap .step > div {
    margin-bottom: 28px !important;
    padding-top: 22px !important;
  }
  .cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .guide-wrap .step > div:first-child {
    padding-top: 6px !important;
  }
  .cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .smtp-guide-shot {
    padding: 16px 12px;
    gap: 14px;
  }
}
@media (max-width: 760px) {
  body.cl-dashboard-redesign-page .cl-dashboard-redesign.cl-source-smtp-guide-wrap > .modal.modal-default {
    padding: 0 !important;
  }
  .cl-dashboard-redesign.cl-source-smtp-guide-wrap .modal-dialog.member-smtp-guide-modal.cl-source-settings-dialog {
    width: 100% !important;
  }
  .cl-dashboard-redesign.cl-source-smtp-guide-wrap .modal-dialog.member-smtp-guide-modal .modal-content {
    height: 100vh !important;
    height: 100dvh !important;
    border-radius: 0 !important;
  }
  .cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .guide-menu ul {
    gap: 16px;
    padding: 11px 12px;
  }
  .cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .guide-menu ul li {
    flex-basis: 108px;
    height: 56px;
    min-height: 56px;
    padding: 3px 4px;
  }
  .cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .guide-menu li::after {
    right: -11px;
    width: 6px;
    height: 6px;
  }
  .cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .guide-menu ul li p {
    font-size: 11px;
  }
  .cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .guide-wrap .step {
    padding: 20px 14px 64px !important;
  }
  .cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .smtp-guide-row {
    align-items: flex-start;
    font-size: 12px;
  }
  .cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .smtp-guide-row::before {
    margin-top: 1px;
  }
  .cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .smtp-guide-shot {
    padding: 14px 10px;
    gap: 12px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .guide-wrap {
    scroll-behavior: auto;
  }
  .cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .guide-menu ul li {
    transition: none;
  }
}
@media (max-width: 640px) {
  .cl-dashboard-redesign.cl-source-smtp-wrap .member-smtp-settings-modal .smtp-platform-btns {
    gap: 8px;
  }
  .cl-dashboard-redesign.cl-source-smtp-wrap .member-smtp-settings-modal .smtp-platform-btn {
    height: 66px;
  }
  .cl-dashboard-redesign.cl-source-smtp-wrap .member-smtp-settings-modal .platform-name {
    font-size: 12px;
    overflow-wrap: anywhere;
  }
  .cl-dashboard-redesign.cl-source-smtp-wrap .member-smtp-settings-modal .advanced-settings-row-2 {
    grid-template-columns: minmax(0, 1fr);
  }
}
@media (pointer: coarse) {
  .cl-dashboard-redesign#notification-mail-home .notification-mail-guide,
  .cl-dashboard-redesign.cl-source-smtp-wrap .member-smtp-settings-modal .smtp-notice__header,
  .cl-dashboard-redesign.cl-source-smtp-wrap .member-smtp-settings-modal .smtp-guide {
    min-height: 44px;
  }
}

/* 알림톡 템플릿 상세보기 */
body.cl-dashboard-redesign-page .cl-source-kakao-template-wrap .modal-dialog.cl-source-settings-dialog {
  width: 900px !important;
}
body.cl-dashboard-redesign-page .cl-source-kakao-template-wrap .important_alert {
  margin: 0 0 24px;
  padding: 14px 16px;
  border: 1px solid #C8EED9;
  border-radius: 8px;
  background: #E9F8F0;
  color: #27834C;
  font-size: 13px;
  line-height: 22px;
  word-break: keep-all;
}
body.cl-dashboard-redesign-page .cl-source-kakao-template-wrap .contents-detail .sub-title {
  width: 100%;
  height: auto;
  margin: 0 0 12px;
  padding: 0;
  border: 0;
  color: #222428;
  font-size: 15px;
  font-weight: 700;
  line-height: 24px;
}
body.cl-dashboard-redesign-page .cl-source-kakao-template-wrap .template-wrap {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  width: 100%;
  height: auto;
  margin: 0 0 28px;
  padding: 0;
  overflow: visible;
}
body.cl-dashboard-redesign-page .cl-source-kakao-template-wrap .template-wrap::before,
body.cl-dashboard-redesign-page .cl-source-kakao-template-wrap .template-wrap::after {
  display: none;
}
body.cl-dashboard-redesign-page .cl-source-kakao-template-wrap .template-wrap > .template-container,
body.cl-dashboard-redesign-page .cl-source-kakao-template-wrap .template-wrap > .template-container:nth-child(2n) {
  float: none;
  display: flex;
  flex-direction: column;
  width: auto;
  min-width: 0;
  margin: 0;
  padding: 16px;
  border: 1px solid #E0E3EB;
  border-radius: 10px;
  background: #F8F9FB;
}
body.cl-dashboard-redesign-page .cl-source-kakao-template-wrap .template-wrap > .template-container > .template-title {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin: 0 0 12px;
  color: #222428;
  font-size: 13px;
  font-weight: 600;
  line-height: 22px;
  overflow-wrap: anywhere;
}
body.cl-dashboard-redesign-page .cl-source-kakao-template-wrap .template-wrap > .template-container > .template-title > span {
  position: static !important;
  float: none !important;
  flex-shrink: 0;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 2px 8px !important;
  border-radius: 5px !important;
  font-size: 11px !important;
  line-height: 18px !important;
}
body.cl-dashboard-redesign-page .cl-source-kakao-template-wrap .template-wrap > .template-container > .template-title > span.success {
  background: #E0F5E9;
  color: var(--cl-green-text);
}
body.cl-dashboard-redesign-page .cl-source-kakao-template-wrap .template-wrap > .template-container > .template-title > span.nope {
  background: #FDEDEE;
  color: #E5484D;
}
body.cl-dashboard-redesign-page .cl-source-kakao-template-wrap .template-wrap > .template-container > .template-title > span.ing {
  background: #FFF4DB;
  color: #A36B00;
}
body.cl-dashboard-redesign-page .cl-source-kakao-template-wrap .template-wrap > .template-container > .template-box {
  width: 100%;
  height: auto;
  min-height: 0;
  max-height: none;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: #696C71;
  font-size: 13px;
  line-height: 22px;
  overflow: visible;
  overflow-wrap: anywhere;
}
body.cl-dashboard-redesign-page .cl-source-kakao-template-wrap .template-wrap:last-child {
  margin-bottom: 0;
}
@media (max-width: 600px) {
  body.cl-dashboard-redesign-page .cl-source-kakao-template-wrap .template-wrap {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* 전자결제 서비스 안내·신청서 */
body.cl-dashboard-redesign-page .flat-modal.cl-source-pg-wrap {
  z-index: var(--cl-pg-modal-z, 1000003) !important;
}
body.cl-dashboard-redesign-page .cl-source-pg-wrap .modal-dialog.pg-modal,
body.cl-dashboard-redesign-page .cl-source-pg-wrap .modal-dialog.pg-apply-clmodal {
  width: 800px !important;
}
body.cl-dashboard-redesign-page .cl-source-pg-wrap .modal-title {
  font-size: 22px !important;
  font-weight: 700 !important;
}
body.cl-dashboard-redesign-page .cl-source-pg-wrap .sign-logo-title {
  width: auto;
  max-width: 180px;
  max-height: 42px;
  margin: 0 auto;
}
body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-wrap,
body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-body {
  float: none !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}
body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  float: none !important;
  width: 100% !important;
  margin: 0 0 28px !important;
  padding: 16px !important;
  border: 1px solid #E0E3EB;
  border-radius: 10px;
  background: #F8F9FB;
}
body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-header::before,
body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-header::after {
  display: none;
}
body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-header > div {
  float: none !important;
  width: auto !important;
  min-width: 0;
}
body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-header .img-wrap {
  padding: 0 !important;
}
body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-header img {
  width: auto !important;
  max-width: 180px !important;
  height: auto !important;
  max-height: 46px;
  padding: 0 !important;
}
body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-header p {
  margin: 0 !important;
  padding: 0 !important;
  font-size: 12px !important;
  line-height: 22px;
}
body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-header :is(.tel, .tel_02) {
  font-size: 18px !important;
  letter-spacing: 0 !important;
}
body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-title,
body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-apply-form .title-box {
  margin: 24px 0 0 !important;
  padding: 0 0 12px !important;
  border-bottom: 1px solid #E0E3EB !important;
  color: #222428 !important;
  font-size: 16px !important;
  font-weight: 700;
  line-height: 24px;
}
body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-content {
  margin: 0 !important;
  padding: 16px 0 0 !important;
}
body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-content dl {
  display: grid;
  grid-template-columns: 145px minmax(0, 1fr);
  gap: 12px 20px;
  float: none !important;
  width: 100% !important;
  margin: 0 0 18px !important;
  overflow: visible !important;
}
body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-content :is(dt, dd) {
  float: none !important;
  width: auto !important;
  max-width: none !important;
  min-width: 0;
  margin: 0 !important;
  font-size: 13px !important;
  line-height: 22px !important;
  overflow-wrap: anywhere;
}
body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-content dt {
  color: #222428 !important;
  font-weight: 600 !important;
}
body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-content p {
  font-size: 13px !important;
  line-height: 22px !important;
}
body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-modal-detailbtn {
  width: auto !important;
  max-width: none !important;
  height: auto !important;
  margin: 4px 0 4px 8px !important;
  padding: 4px 10px !important;
  border: 1px solid #C8EED9;
  border-radius: 6px !important;
  background: #E9F8F0 !important;
  color: var(--cl-green-text) !important;
  font-size: 12px !important;
  line-height: 20px !important;
}
body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-modal-detailbtn:hover {
  background: #D8F1E3 !important;
}
body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-content-detailWrap {
  grid-column: 1 / -1;
  box-sizing: border-box;
  left: auto !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 8px 0 !important;
  padding: 20px !important;
  border: 0 !important;
  border-radius: 8px;
  background: #F8F9FB !important;
  overflow: hidden !important;
  transform: none !important;
}
body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-content-detailWrap :is(img, table) {
  box-sizing: border-box;
  max-width: 100% !important;
  height: auto !important;
}
body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-content-detailWrap img {
  display: block;
  margin-right: auto !important;
  margin-left: auto !important;
}
body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-content-detailWrap :is(p, ul) {
  width: auto !important;
  max-width: 100% !important;
  margin: 16px 0 !important;
  font-size: 13px !important;
  line-height: 22px !important;
}
body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-apply-form :is(.company-info-box, .account-info-box, .manager-info-box) {
  gap: 16px;
  margin: 20px 0 28px !important;
}
body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-apply-form :is(.company-info-box, .account-info-box, .manager-info-box) > div {
  gap: 12px 20px;
  min-width: 0;
}
body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-apply-form :is(.company-info-box, .account-info-box, .manager-info-box) > div > div {
  min-width: 0;
  font-size: 13px !important;
}
body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-apply-form input:not([type="checkbox"]):not([type="radio"]),
body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-apply-form select {
  min-width: 0 !important;
  max-width: 100%;
  height: 40px !important;
  margin-bottom: 0;
  padding: 9px 12px;
  border: 1px solid #E0E3EB;
  border-radius: 8px;
  color: #222428;
  font-size: 13px;
}
body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-apply-form :is(input, select):focus {
  border-color: #03C75A;
  outline: 0;
  box-shadow: 0 0 0 3px rgba(3,199,90,.12);
}
body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-apply-form select + .caret {
  margin-top: 19px;
}
body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-apply-form hr {
  display: none;
}
body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-apply-form .postNo-row button {
  height: 40px;
  border: 1px solid #E0E3EB;
  border-radius: 8px;
  background: #F8F9FB;
  color: #222428;
}
body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-apply-form .term-txt {
  max-height: 200px;
  border-color: #E0E3EB;
  border-radius: 8px;
  background: #F8F9FB;
  font-size: 13px;
  line-height: 22px;
}
body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-apply-form .etc-pay-method-info {
  margin-bottom: 28px;
  font-size: 12px;
}
body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-apply-form .term-box input:checked + svg {
  fill: #03C75A;
}
body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-apply-form .pay-method-box > div input:checked + label {
  border-color: #03C75A;
  background: #E9F8F0;
  color: var(--cl-green-text);
}
@media (max-width: 767px) {
  body.cl-dashboard-redesign-page .cl-source-pg-wrap .cl-source-settings-dialog .modal-title {
    margin: 0 40px 20px 0 !important;
    text-align: left !important;
  }
  body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-body > .pg-title {
    box-sizing: border-box;
    width: 100% !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
    text-align: left !important;
  }
  body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-modal .pg-body > .pg-content dt {
    padding: 0 !important;
  }
  body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-content.pg-step dt {
    white-space: normal;
    word-break: keep-all;
    overflow-wrap: normal;
  }
}
@media (max-width: 600px) {
  body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }
  body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-content dl {
    grid-template-columns: minmax(0, 1fr);
    gap: 6px;
  }
  body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-modal .pg-body > .pg-content dd,
  body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-modal .pg-body > .pg-step p,
  body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-modal .pg-body > .pg-content .mobileWidth {
    padding-right: 0 !important;
    padding-left: 0 !important;
  }
  body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-apply-form :is(.company-info-box, .account-info-box, .manager-info-box) > div {
    flex-direction: column;
    gap: 6px;
  }
  body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-apply-form :is(.company-info-box, .account-info-box, .manager-info-box) > div > div:first-child {
    flex-basis: auto;
  }
  body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-apply-form :is(.phone-row, .coNo-row, .postNo-row) {
    gap: 6px !important;
  }
  body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-apply-form .pay-method-box {
    flex-wrap: wrap;
  }
  body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-apply-form .pay-method-box > div {
    flex-basis: 45%;
  }
}
body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-apply-form input:is([type="radio"], [type="checkbox"]) {
  accent-color: #03C75A;
}
body.cl-dashboard-redesign-page .cl-source-pg-process-wrap .modal-dialog.cl-source-settings-dialog {
  width: 300px !important;
}
body.cl-dashboard-redesign-page .cl-source-pg-process-wrap .cl-source-settings-dialog .modal-content {
  height: 112px !important;
  padding: 24px !important;
}
body.cl-dashboard-redesign-page .cl-source-pg-process-wrap .nicepay-processing {
  position: static;
  transform: none;
  text-align: center;
}
body.cl-dashboard-redesign-page .cl-source-pg-process-wrap .nicepay-processing > div {
  width: 30px;
  height: 30px;
}
body.cl-dashboard-redesign-page .cl-source-pg-process-wrap .nicepay-processing > div::after {
  border-color: #E5E7EB;
  border-top-color: #03C75A;
}
body.cl-dashboard-redesign-page .cl-source-pg-process-wrap .nicepay-processing p {
  margin: 12px 0 0;
  color: #222428;
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
}
body.cl-dashboard-redesign-page .cl-source-pg-process-wrap > .modal-default {
  padding-right: 8px !important;
  padding-left: 8px !important;
}
body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-body > .pg-title:first-child,
body.cl-dashboard-redesign-page .cl-source-pg-wrap .pg-apply-form form > .title-box:first-child {
  margin-top: 0 !important;
}

/* 요금제 구매·변경: 기존 결제수단 안내 (독립 요금제 화면에서도 적용) */
.flat-modal.cl-common-modal.cl-dashboard-redesign.cl-source-plan-payment-notice-wrap {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  overflow: auto !important;
  background: rgba(0, 0, 0, .45) !important;
  z-index: 1000003 !important;
}
.cl-dashboard-redesign.cl-source-plan-payment-notice-wrap,
.cl-dashboard-redesign.cl-source-plan-payment-notice-wrap * { box-sizing: border-box; }
.cl-dashboard-redesign.cl-source-plan-payment-notice-wrap + .modal-backdrop { opacity: 0 !important; pointer-events: none; }
.cl-dashboard-redesign.cl-source-plan-payment-notice-wrap > .modal-default {
  position: relative !important;
  inset: auto !important;
  display: flex !important;
  width: 100% !important;
  min-height: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 24px 16px !important;
  overflow: visible !important;
  background: transparent !important;
}
.cl-dashboard-redesign.cl-source-plan-payment-notice-wrap .modal-dialog.cl-source-plan-payment-notice {
  position: relative !important;
  inset: auto !important;
  width: 440px !important;
  max-width: 100% !important;
  height: auto !important;
  margin: auto !important;
  padding: 0 !important;
  transform: none !important;
}
.cl-dashboard-redesign.cl-source-plan-payment-notice-wrap .cl-source-plan-payment-notice .modal-content {
  width: 100% !important;
  min-height: 0 !important;
  padding: 32px !important;
  border: 1px solid #E5E7EB !important;
  border-radius: 14px !important;
  background: #fff !important;
  box-shadow: 0 24px 64px rgba(0, 0, 0, .28) !important;
  font-family: 'CreatorlinkSansKR', 'Apple SD Gothic Neo', 'Malgun Gothic', sans-serif !important;
}
.cl-dashboard-redesign.cl-source-plan-payment-notice-wrap .cl-source-plan-payment-notice .modal-body {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #8A8F98;
  font-size: 14px;
  line-height: 24px;
  text-align: center;
  word-break: keep-all;
  overflow-wrap: anywhere;
}
.cl-dashboard-redesign.cl-source-plan-payment-notice-wrap .cl-source-plan-payment-notice .modal-title {
  margin: 0 24px 20px !important;
  padding: 0 !important;
  color: #222428;
  font-size: 22px !important;
  font-weight: 700;
  line-height: 30px !important;
  text-align: center;
}
.cl-dashboard-redesign.cl-source-plan-payment-notice-wrap .cl-source-plan-payment-notice .modal-footer {
  position: static !important;
  display: flex !important;
  width: 100% !important;
  max-width: none !important;
  margin: 24px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
}
.cl-dashboard-redesign.cl-source-plan-payment-notice-wrap .modal-footer::before,
.cl-dashboard-redesign.cl-source-plan-payment-notice-wrap .modal-footer::after,
.cl-dashboard-redesign.cl-source-plan-payment-notice-wrap .cl-mobile-btn.close { display: none !important; }
.flat-modal.cl-common-modal.cl-dashboard-redesign.cl-source-plan-payment-notice-wrap .cl-source-plan-payment-notice .modal-footer .btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: none !important;
  height: 46px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: #03C75A !important;
  color: #fff !important;
  font-size: 15px !important;
  font-weight: 700;
}
.flat-modal.cl-common-modal.cl-dashboard-redesign.cl-source-plan-payment-notice-wrap .cl-source-plan-payment-notice .modal-footer .btn:hover,
.flat-modal.cl-common-modal.cl-dashboard-redesign.cl-source-plan-payment-notice-wrap .cl-source-plan-payment-notice .modal-footer .btn:focus-visible { background: #0E964A !important; }
.cl-dashboard-redesign.cl-source-plan-payment-notice-wrap .cl-source-plan-payment-notice .modal-content > .close {
  position: absolute !important;
  top: 20px !important;
  right: 22px !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 8px;
  background: transparent !important;
  color: #B4B8BF !important;
  opacity: 1 !important;
  transition: transform .18s, background .12s;
}
.cl-dashboard-redesign.cl-source-plan-payment-notice-wrap .modal-content > .close::before,
.cl-dashboard-redesign.cl-source-plan-payment-notice-wrap .modal-content > .close::after { display: none !important; }
.cl-dashboard-redesign.cl-source-plan-payment-notice-wrap .modal-content > .close svg { display: block; width: 15px !important; height: 15px !important; fill: currentColor; }
.cl-dashboard-redesign.cl-source-plan-payment-notice-wrap .cl-source-plan-payment-notice .modal-content > .close:hover,
.cl-dashboard-redesign.cl-source-plan-payment-notice-wrap .cl-source-plan-payment-notice .modal-content > .close:focus-visible {
  background: #F1F2F5 !important;
  color: #222428 !important;
  transform: rotate(90deg);
}
.cl-dashboard-redesign.cl-source-plan-payment-notice-wrap button:focus-visible { outline: 2px solid #03C75A !important; outline-offset: 2px; }
@media (max-width: 600px) {
  .cl-dashboard-redesign.cl-source-plan-payment-notice-wrap .cl-source-plan-payment-notice .modal-content { padding: 28px 24px !important; }
}

/* 모든 대시보드 토스트는 사이드바·모달 위치와 무관하게 화면 정중앙에 표시한다. */
#toast.cl-dashboard-redesign.cl-toast {
  position: fixed !important;
  top: 50% !important;
  right: auto !important;
  bottom: auto !important;
  left: 50% !important;
  z-index: 2147483647 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 9px !important;
  box-sizing: border-box;
  width: max-content !important;
  min-width: 0 !important;
  max-width: calc(100vw - 32px) !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 12px 20px !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: #03C75A !important;
  color: #fff !important;
  box-shadow: 0 14px 40px rgba(3, 199, 90, .42) !important;
  font-family: 'CreatorlinkSansKR', 'Apple SD Gothic Neo', 'Malgun Gothic', sans-serif;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 18px !important;
  text-align: center;
  white-space: normal !important;
  word-break: keep-all;
  overflow-wrap: anywhere;
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, -50%) !important;
  transition: none !important;
}
#toast.cl-dashboard-redesign.cl-toast.show {
  opacity: 1;
  transform: translate(-50%, -50%) !important;
}
#toast.cl-dashboard-redesign.cl-toast:is(.is-pending, .is-warning) {
  background: #222428 !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .22) !important;
  font-size: 13px !important;
  line-height: 16px !important;
}
#toast.cl-dashboard-redesign.cl-toast.is-warning,
#toast.cl-dashboard-redesign.cl-toast.is-warning.show {
  transform: translate(-50%, -50%) !important;
  transition: opacity .2s ease !important;
}
#toast.cl-dashboard-redesign.cl-toast > svg {
  display: block;
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
  color: #fff;
}
#toast.cl-dashboard-redesign.cl-toast:is(.is-pending, .is-warning) > svg {
  flex-basis: 16px;
  width: 16px;
  height: 16px;
}
#toast.cl-dashboard-redesign.cl-toast > .cl-toast-message { min-width: 0; }
#toast.cl-dashboard-redesign.cl-toast.is-dismissible { pointer-events: auto; cursor: pointer; }
@media (prefers-reduced-motion: reduce) {
  #toast.cl-dashboard-redesign.cl-toast,
  #toast.cl-dashboard-redesign.cl-toast.is-warning { transition: none !important; }
}

/* 갤러리 링크 도움말은 모달의 스크롤 영역 밖에서 표시한다. */
body.cl-dashboard-redesign-page > .popover.cl-source-help-popover.cl-gallery-link-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) {
  z-index: 1000004 !important;
}

body.cl-dashboard-redesign-page > .popover.cl-source-help-popover.cl-gallery-link-popover .popover-content {
  max-height: calc(100vh - 52px);
  overflow-y: auto;
}

/* 모바일 본문 도구: 기간은 균등 분할, 셀렉트와 실행 버튼은 왼쪽 정렬. */
@media (max-width: 768px) {
  body.cl-dashboard-redesign-page :is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .duration-box + .date-box {
    margin-top: 8px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-point-list-page .point-reg-box,
  body.cl-dashboard-redesign-page :is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .duration-box,
  body.cl-dashboard-redesign-page #cl-shopping-statistics-page .statistics-top .date-box .statistics-period-options,
  body.cl-dashboard-redesign-page #cl-shopping-order-search-page .search-box > ul:first-child .cl-s-productSearch,
  body.cl-dashboard-redesign-page #cl-log-page .slog-period-wrap > .btn-group {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    margin-right: 0;
  }

  body.cl-dashboard-redesign-page #cl-shopping-point-list-page .point-reg,
  body.cl-dashboard-redesign-page :is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .duration-box .duration,
  body.cl-dashboard-redesign-page #cl-shopping-statistics-page .statistics-top .date-box .statistics-period-options .duration,
  body.cl-dashboard-redesign-page #cl-shopping-order-search-page .cl-s-productSearch > .duration,
  body.cl-dashboard-redesign-page #cl-log-page .slog-period-wrap .slog-period,
  body.cl-dashboard-redesign-page #cl-log-page .slog-btn-toggle.oi-presets > .oi-preset {
    width: auto;
    min-width: 0 !important;
    margin: 0;
    padding-right: 4px !important;
    padding-left: 4px !important;
    white-space: nowrap;
    word-break: keep-all;
    text-align: center;
  }

  body.cl-dashboard-redesign-page #cl-log-page .slog-period-wrap {
    width: 100%;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-source-sales-panel .cl-source-panel-head {
    flex-wrap: wrap;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-source-period-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    width: 100%;
    min-width: 0;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-source-period-tabs > span {
    flex: 1 0 auto;
    min-width: max-content;
    text-align: center;
    white-space: nowrap;
  }

  body.cl-dashboard-redesign-page .cl-dashboard-home .cl-source-period-tabs .cl-source-sales-calendar-wrap {
    flex: 0 0 30px;
    margin-left: auto;
  }

  body.cl-dashboard-redesign-page :is(
    .cl-source-notice-write-actions, .cl-source-form-view-actions,
    .cl-source-social-save, .cl-source-points-save.pt-outsave,
    .cl-source-product-actions, .cl-source-product-bulk-actions,
    .cl-source-member-actions, .cl-source-member-toolbar, .cl-source-leave-selection-actions,
    .cl-source-statistics-detail-actions, .cl-source-statistics-detail-util,
    .cl-source-inquiry-toolbar, .cl-source-inquiry-toolbar-right,
    .cl-production-list-toolbar, .cl-production-list-actions,
    .cl-source-points-result-head, .cl-source-coupon-result-head
  ),
  body.cl-dashboard-redesign-page :is(#cl-member-list-page, #cl-member-leavelist-page) :is(.btn-wrap, .mng-selectboxlist),
  body.cl-dashboard-redesign-page #cl-member-leavelist-page .mng-bottom-btn-wrap,
  body.cl-dashboard-redesign-page :is(#cl-shopping-point-list-page, #cl-shopping-point-member-page) .point-select-options,
  body.cl-dashboard-redesign-page :is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) :is(.search-btn-area, .coupon-btn-area, .filter-box, .checkbox-condition-box-container),
  body.cl-dashboard-redesign-page #cl-shopping-order-search-page .btn-section,
  body.cl-dashboard-redesign-page #cl-shopping-statistics-page .util-row .util-right,
  body.cl-dashboard-redesign-page #cl-marketing-page :is(.seo-save, .adv-save, .adv-toolbar) {
    justify-content: flex-start !important;
    flex-wrap: wrap;
    gap: 8px;
    margin-left: 0 !important;
    text-align: left;
  }

  body.cl-dashboard-redesign-page :is(#cl-member-list-page, #cl-member-leavelist-page) .mng-sortWrap {
    margin-left: 0;
  }

  body.cl-dashboard-redesign-page :is(#cl-shopping-point-list-page, #cl-shopping-coupon-history-page) :is(.cl-source-points-result-title, .search-result-box) {
    flex: 0 0 100%;
  }

  body.cl-dashboard-redesign-page :is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .filter-box .select-box,
  body.cl-dashboard-redesign-page #cl-shopping-coupon-setting-page .checkbox-condition-box,
  body.cl-dashboard-redesign-page .cl-source-product-actions > button,
  body.cl-dashboard-redesign-page .cl-source-product-bulk-actions > button {
    flex: none;
    width: auto;
    white-space: nowrap;
  }

  body.cl-dashboard-redesign-page #cl-shopping-coupon-setting-page .coupon-btn-area {
    margin-top: 16px !important;
    padding-bottom: 0 !important;
  }

  /* 검색·초기화, 삭제·추가, 저장·취소는 결정 영역의 너비를 나눠 사용한다. */
  body.cl-dashboard-redesign-page :is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .search-btn-area > button,
  body.cl-dashboard-redesign-page #cl-shopping-coupon-setting-page .coupon-btn-area > button,
  body.cl-dashboard-redesign-page #cl-shopping-order-search-page .btn-section > button,
  body.cl-dashboard-redesign-page #cl-shopping-point-setting-page .cl-source-points-save.pt-outsave .setting-button,
  body.cl-dashboard-redesign-page #cl-member-social-login-page .cl-source-social-save .setting-button,
  body.cl-dashboard-redesign-page #cl-notice-write-page .cl-source-notice-write-actions > .cl-source-notice-write-btn,
  body.cl-dashboard-redesign-page #cl-marketing-page :is(.seo-save, .adv-save) > button {
    flex: 1 1 0;
    width: auto !important;
    min-width: 0;
    white-space: nowrap;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-search-page .btn-section > button {
    padding-inline: 16px;
  }

  body.cl-dashboard-redesign-page #cl-member-social-login-page .cl-source-social-save .setting-button {
    max-width: none;
  }

  body.cl-dashboard-redesign-page #cl-marketing-page .marketing-seo-save-status {
    flex-basis: 100%;
  }

  body.cl-dashboard-redesign-page #cl-marketing-page .marketing-seo-save-status:empty {
    display: none;
  }
}

/* 쿠폰 모바일: 검색 폼, 결과, 페이지 이동을 문서 순서대로 배치한다. */
@media (max-width: 768px) {
  body.cl-dashboard-redesign-page :is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .table-container > table {
    margin-bottom: 0;
  }

  body.cl-dashboard-redesign-page #cl-shopping-coupon-setting-page .coupon-setting-box form {
    margin-bottom: 0;
  }

  body.cl-dashboard-redesign-page :is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .table-container {
    margin-bottom: 0;
    padding-top: 0;
  }

  body.cl-dashboard-redesign-page :is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .top-area {
    row-gap: 0;
    padding: 0 16px !important;
  }

  body.cl-dashboard-redesign-page #cl-shopping-coupon-setting-page .coupon-setting-info-box:not(.cl-source-coupon-usage) {
    padding: 16px !important;
  }

  body.cl-dashboard-redesign-page #cl-shopping-coupon-setting-page .coupon-setting-info-box:not(.cl-source-coupon-usage)::after {
    right: 16px;
    left: 16px;
  }

  body.cl-dashboard-redesign-page :is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .top-area > div {
    padding: 16px 0 !important;
  }

  body.cl-dashboard-redesign-page #cl-shopping-coupon-history-page .duration-cond {
    margin-bottom: 8px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-coupon-history-page .duration-cond .disp-date-type {
    display: none;
  }

  body.cl-dashboard-redesign-page #cl-shopping-coupon-history-page .top-area .checkbox-container ul {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px 12px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-coupon-history-page .top-area .checkbox-container li.separator {
    display: none;
  }

  body.cl-dashboard-redesign-page #cl-shopping-coupon-history-page .top-area .checkbox-container .newcheckbox label {
    min-height: 28px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-coupon-history-page .search-btn-area {
    margin: 16px 0 24px !important;
  }

  body.cl-dashboard-redesign-page #cl-shopping-coupon-setting-page .coupon-setting-box > .search-btn-area {
    padding: 0 16px 16px !important;
    margin-bottom: 24px !important;
  }

  body.cl-dashboard-redesign-page :is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .paging {
    position: static;
    inset: auto;
    flex-wrap: wrap;
    height: auto;
    min-height: 0;
    margin: 16px 0 0 !important;
    padding: 0 !important;
  }

  body.cl-dashboard-redesign-page :is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .paging:empty {
    display: none;
    margin: 0 !important;
  }

  body.cl-dashboard-redesign-page #cl-shopping-coupon-manage-page .coupon-manage-list .top-area {
    gap: 12px;
    margin-bottom: 16px !important;
  }

  body.cl-dashboard-redesign-page #cl-shopping-coupon-manage-page .coupon-manage-list .top-area > .btn-publish {
    width: 100%;
  }

  body.cl-dashboard-redesign-page :is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .date-box .date-input-box {
    min-width: 0;
  }
}

/* 회원 쿠폰 관리의 모바일 도구는 검색을 우선하고, 공간이 부족하면 필터만 다음 줄에 둔다. */
@media (max-width: 768px) {
  body.cl-dashboard-redesign-page #cl-shopping-coupon-manage-page .coupon-manage-list .top-area {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    column-gap: 8px !important;
    row-gap: 12px !important;
  }

  body.cl-dashboard-redesign-page #cl-shopping-coupon-manage-page .coupon-manage-list .top-area > .btn-publish {
    flex: 0 0 92px;
    width: 92px !important;
    min-width: 92px !important;
    margin: 0 !important;
    padding: 0 12px !important;
  }

  body.cl-dashboard-redesign-page #cl-shopping-coupon-manage-page .coupon-manage-list .top-area > .keyword-box {
    display: flex !important;
    flex: 1 1 260px;
    width: auto !important;
    max-width: none;
    min-width: 0;
    margin: 0 !important;
  }

  body.cl-dashboard-redesign-page #cl-shopping-coupon-manage-page .coupon-manage-list .top-area > .keyword-box > div,
  body.cl-dashboard-redesign-page #cl-shopping-coupon-manage-page .coupon-manage-list .top-area > .keyword-box input {
    min-width: 0;
  }

  body.cl-dashboard-redesign-page #cl-shopping-coupon-manage-page .coupon-manage-list .top-area > .filter-box {
    display: flex !important;
    flex: 0 0 auto;
    width: auto !important;
    margin: 0 0 0 auto !important;
  }

  body.cl-dashboard-redesign-page #cl-shopping-coupon-manage-page .coupon-manage-list .top-area > .filter-box > .select-box {
    flex: 0 0 auto;
    width: auto !important;
  }

  body.cl-dashboard-redesign-page #cl-shopping-coupon-manage-page .cl-coupon-result-select--sort,
  body.cl-dashboard-redesign-page #cl-shopping-coupon-manage-page .cl-coupon-result-select--sort .cl-redesign-select-trigger,
  body.cl-dashboard-redesign-page #cl-shopping-coupon-manage-page .cl-coupon-result-select--sort .cl-redesign-select-menu {
    width: 112px !important;
    min-width: 112px !important;
  }

  body.cl-dashboard-redesign-page #cl-shopping-coupon-manage-page .cl-coupon-result-select--limit,
  body.cl-dashboard-redesign-page #cl-shopping-coupon-manage-page .cl-coupon-result-select--limit .cl-redesign-select-trigger,
  body.cl-dashboard-redesign-page #cl-shopping-coupon-manage-page .cl-coupon-result-select--limit .cl-redesign-select-menu {
    width: 72px !important;
    min-width: 72px !important;
  }
}

@media (max-width: 640px) {
  body.cl-dashboard-redesign-page #cl-shopping-coupon-manage-page .coupon-manage-list .top-area > .filter-box {
    flex-basis: 100%;
    justify-content: flex-start !important;
    margin-left: 0 !important;
  }
}

/* 쿠폰 추가·수정 및 발급·회수 팝업의 모바일 폼. */
@media (max-width: 768px) {
  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal:has(.modal-dialog.cl-cmmodal:is(.coupon-add-modal, .coupon-manage-modal)) {
    height: 100dvh !important;
    padding: 12px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal:is(.coupon-add-modal, .coupon-manage-modal) {
    max-width: calc(100vw - 24px) !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal:is(.coupon-add-modal, .coupon-manage-modal) .modal-content {
    padding: 52px 20px 20px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .item-row {
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
    padding: 16px 0 !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .item-title {
    flex: none !important;
    width: 100% !important;
    padding-top: 0 !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-add-modal #coupon_add_frm .item-row > :not(.item-title) {
    align-self: stretch;
    flex: none;
    width: 100%;
    max-width: 100%;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default > .modal-dialog.cl-cmmodal.coupon-info-design-modal #coupon_add_frm .coupon-kind-box {
    align-items: flex-start !important;
    justify-content: flex-start !important;
    text-align: left !important;
  }
}

/* 쿠폰 추가 위에 표시하는 상품·갤러리 선택 팝업. */
#coupon-use-group-modal.cl-dashboard-redesign {
    position: fixed;
    inset: 0;
    width: 100vw;
    max-width: none;
    margin: 0;
    transform: none;
    z-index: 1000002;
    height: 100vh;
    height: 100dvh;
    padding: 24px 16px;
    overflow-y: auto;
    background: rgba(0, 0, 0, .45);
    color: var(--cl-text);
    border: 0;
    border-radius: 0;
}

#coupon-use-group-modal.cl-dashboard-redesign,
#coupon-use-group-modal.cl-dashboard-redesign * {
    box-sizing: border-box;
}

#coupon-use-group-modal.cl-dashboard-redesign .modal-content {
    position: relative;
    min-height: 0;
    width: min(1280px, 100%);
    margin: 0 auto;
    padding: 32px 34px 28px;
    background: var(--cl-surface);
    border-radius: 14px;
    box-shadow: 0 24px 64px rgba(20, 24, 32, .28);
}

#coupon-use-group-modal.cl-dashboard-redesign .modal-header {
    position: static;
    flex: none;
    min-height: 0;
    padding: 0 30px 24px;
    border-bottom: 1px solid var(--cl-border);
}

#coupon-use-group-modal.cl-dashboard-redesign .modal-title {
    margin: 0;
    text-align: center;
    font-size: 20px;
    font-weight: 700;
    line-height: 26px;
}

#coupon-use-group-modal.cl-dashboard-redesign .modal-header > .btn-close {
    display: inline-flex;
}

#coupon-use-group-modal.cl-dashboard-redesign .modal-body {
    display: block;
    max-width: none;
    margin: 0;
    padding: 0;
}

#coupon-use-group-modal.cl-dashboard-redesign .modal-body > div {
    display: grid;
    grid-template-columns: minmax(240px, 1fr) minmax(0, 2fr);
    gap: 28px;
    min-width: 0;
    margin: 0;
}

#coupon-use-group-modal.cl-dashboard-redesign .modal-body :is(.left-area, .right-area) {
    min-width: 0;
    max-height: none;
    width: 100%;
    padding: 0;
    overflow: visible;
}

#coupon-use-group-modal.cl-dashboard-redesign .modal-body :is(.left-area, .right-area) > .title {
    padding: 24px 0 16px;
    font-size: 15px;
    font-weight: 700;
    line-height: 20px;
    color: var(--cl-text);
}

#coupon-use-group-modal.cl-dashboard-redesign .modal-body .left-area .conditions .condition {
    flex-direction: column;
    gap: 8px;
}

#coupon-use-group-modal.cl-dashboard-redesign .modal-body .left-area .conditions .condition :is(.select-category, .search-product-name) {
    width: 100%;
    min-height: 44px;
    border: 1px solid var(--cl-border);
    border-radius: 8px;
    color: var(--cl-text);
    font-size: 13px;
}

#coupon-use-group-modal.cl-dashboard-redesign .modal-body .left-area .conditions .condition .select-category {
    display: flex;
    align-items: center;
    padding: 0 36px 0 12px;
}

#coupon-use-group-modal.cl-dashboard-redesign .modal-body .left-area .conditions .condition .category-area {
    top: calc(100% + 4px);
    width: 100%;
    min-width: 0;
    border: 1px solid var(--cl-border);
    border-radius: 8px;
    box-shadow: var(--cl-shadow-drop);
}

#coupon-use-group-modal.cl-dashboard-redesign .modal-body .left-area .conditions .condition .category-area .category-list {
    max-height: 260px;
}

#coupon-use-group-modal.cl-dashboard-redesign .modal-body .left-area .conditions .condition .category-area .category-item {
    padding: 10px 24px;
    color: var(--cl-text);
    font-size: 13px;
}

#coupon-use-group-modal.cl-dashboard-redesign .newcheckboxSvg {
    position: relative;
    display: inline-block;
    flex: none;
    width: 16px;
    height: 16px;
}

#coupon-use-group-modal.cl-dashboard-redesign .newcheckboxSvg > svg {
    display: none;
}

#coupon-use-group-modal.cl-dashboard-redesign .newcheckboxSvg::before {
    content: "";
    position: absolute;
    inset: 0;
    border: 1.5px solid #c9cdd4;
    border-radius: 4px;
    background: var(--cl-surface);
}

#coupon-use-group-modal.cl-dashboard-redesign .newcheckboxSvg:has(input:checked)::before {
    border-color: var(--cl-green);
    background: var(--cl-green);
}

#coupon-use-group-modal.cl-dashboard-redesign .newcheckboxSvg:has(input:checked)::after {
    content: "";
    position: absolute;
    top: 3px;
    left: 5px;
    width: 4px;
    height: 8px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

#coupon-use-group-modal.cl-dashboard-redesign .modal-body .left-area .condition-list {
    margin-top: 16px;
    background: var(--cl-page-bg);
    border-radius: 8px;
}

#coupon-use-group-modal.cl-dashboard-redesign .modal-body .left-area .condition-list.active {
    border-color: var(--cl-green);
}

#coupon-use-group-modal.cl-dashboard-redesign .modal-body .left-area .condition-list .item {
    border-color: var(--cl-border);
    border-radius: 6px;
    color: var(--cl-text);
    font-size: 13px;
}

#coupon-use-group-modal.cl-dashboard-redesign .modal-body .left-area .condition-list .item svg {
    fill: var(--cl-text-sub);
}

#coupon-use-group-modal.cl-dashboard-redesign .btn-add-condition {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 44px;
    margin: 0;
    border: 1px solid var(--cl-border);
    border-radius: 8px;
    color: var(--cl-text);
    background: var(--cl-surface);
    font-size: 13px;
}

#coupon-use-group-modal.cl-dashboard-redesign .btn-add-condition:is(:hover, :focus) {
    border-color: var(--cl-green);
    color: var(--cl-green-text);
}

#coupon-use-group-modal.cl-dashboard-redesign .modal-body .right-area .content + .content {
    height: auto;
    margin-top: 16px;
}

#coupon-use-group-modal.cl-dashboard-redesign .modal-body .right-area .product-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
    gap: 12px;
    min-height: 100px;
    max-height: 340px;
    padding: 12px;
    border: 1px solid var(--cl-border);
    border-radius: 8px;
    background: var(--cl-bg-2);
}

#coupon-use-group-modal.cl-dashboard-redesign .modal-body .right-area .product-list .no-list {
    grid-column: 1 / -1;
    min-height: 80px;
    color: var(--cl-text-sub);
    font-size: 13px;
}

#coupon-use-group-modal.cl-dashboard-redesign .modal-body .right-area .product-list .product {
    min-width: 0;
    border: 1px solid var(--cl-border);
    border-radius: 6px;
    overflow: hidden;
    background: var(--cl-surface);
}

#coupon-use-group-modal.cl-dashboard-redesign .modal-body .right-area .product-list .product.selected {
    border-color: var(--cl-green);
    box-shadow: inset 0 0 0 1px var(--cl-green-line);
}

#coupon-use-group-modal.cl-dashboard-redesign .modal-body .right-area .product-list.selected-list {
    height: auto;
    min-height: 100px;
    max-height: 200px;
    max-width: 100%;
    overflow: auto;
}

#coupon-use-group-modal.cl-dashboard-redesign .modal-body .right-area .product-list .product .discount-rate {
    color: var(--cl-green-text);
}

#coupon-use-group-modal.cl-dashboard-redesign .modal-footer {
    display: flex;
    flex-direction: column;
    gap: 14px;
    margin: 24px 0 0;
    padding: 0;
    border: 0;
}

#coupon-use-group-modal.cl-dashboard-redesign .modal-footer::before,
#coupon-use-group-modal.cl-dashboard-redesign .modal-footer::after {
    display: none;
}

#coupon-use-group-modal.cl-dashboard-redesign .modal-footer button {
    width: 100%;
    min-height: 46px;
    margin: 0;
    padding: 0 16px;
    border: 0;
    border-radius: 8px;
    background: var(--cl-green);
    color: #fff;
    font-size: 15px;
    font-weight: 700;
}

#coupon-use-group-modal.cl-dashboard-redesign .modal-footer .btn-ok:is(:hover, :focus-visible) {
    background: var(--cl-green-hover);
}

#coupon-use-group-modal.cl-dashboard-redesign .modal-footer .btn-close {
    background: transparent;
    color: var(--cl-text-sub);
    font-size: 13.5px;
    font-weight: 600;
}

#coupon-use-group-modal.cl-dashboard-redesign .modal-footer .btn-close:is(:hover, :focus-visible) {
    background: var(--cl-green-soft);
    color: var(--cl-green-text);
}

@media (max-width: 768px) {
  #coupon-use-group-modal.cl-dashboard-redesign {
    padding: 12px;
  }

  #coupon-use-group-modal.cl-dashboard-redesign .modal-content {
    padding: 32px 20px 20px;
  }

  #coupon-use-group-modal.cl-dashboard-redesign .modal-body > div {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
  }

  body.cl-dashboard-redesign-page :is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) :is(.keyword-box, .cl-redesign-select-trigger, .duration-box, .duration-box .duration, .date-box .date-input-box, .checkbox-condition-box, .checkbox-condition-box .checkbox-title, .search-btn-area > button, .coupon-btn-area > button, .btn-publish) {
    height: 40px !important;
  }

  body.cl-dashboard-redesign-page :is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page, #cl-shopping-coupon-manage-page) .keyword-box input {
    height: 38px !important;
    line-height: 38px !important;
  }

  body.cl-dashboard-redesign-page :is(#cl-shopping-coupon-setting-page, #cl-shopping-coupon-history-page) .cl-source-date-trigger {
    height: 100% !important;
  }
}

/* 모바일 회원 쿠폰 목록은 회원 요약과 펼칠 수 있는 쿠폰 내역으로 표시한다. */
body.cl-dashboard-redesign-page #cl-shopping-coupon-manage-page :is(.cl-coupon-details-toggle, .cl-coupon-mobile-empty) {
  display: none;
}

@media (max-width: 768px) {
  body.cl-dashboard-redesign-page #cl-shopping-coupon-manage-page .coupon-list > table.table {
    display: block;
    min-width: 0;
    width: 100%;
  }

  body.cl-dashboard-redesign-page #cl-shopping-coupon-manage-page .coupon-list > table.table > colgroup {
    display: none;
  }

  body.cl-dashboard-redesign-page #cl-shopping-coupon-manage-page .coupon-list > table.table > thead,
  body.cl-dashboard-redesign-page #cl-shopping-coupon-manage-page .cl-coupon-member-group {
    display: block;
    width: 100%;
  }

  body.cl-dashboard-redesign-page #cl-shopping-coupon-manage-page .coupon-list table.table thead tr,
  body.cl-dashboard-redesign-page #cl-shopping-coupon-manage-page .cl-coupon-member-row {
    display: grid;
    grid-template-columns: 32px minmax(0, 1fr) 64px;
    width: 100%;
    align-items: start;
  }

  body.cl-dashboard-redesign-page #cl-shopping-coupon-manage-page .coupon-list table.table thead th:nth-child(n + 4) {
    display: none;
  }

  body.cl-dashboard-redesign-page #cl-shopping-coupon-manage-page .coupon-list table.table thead th {
    padding: 12px 6px !important;
    text-align: left;
  }

  body.cl-dashboard-redesign-page #cl-shopping-coupon-manage-page table.table .cl-coupon-member-group td {
    display: block;
    width: auto;
    min-width: 0;
    padding: 12px 6px !important;
    border-bottom: 0 !important;
    white-space: normal;
    overflow-wrap: anywhere;
    text-align: left;
  }

  body.cl-dashboard-redesign-page #cl-shopping-coupon-manage-page .cl-coupon-member-row > .check-td {
    grid-column: 1;
    grid-row: 1;
  }

  body.cl-dashboard-redesign-page #cl-shopping-coupon-manage-page .cl-coupon-member-row > .cl-coupon-member-email {
    grid-column: 2;
    grid-row: 1;
  }

  body.cl-dashboard-redesign-page #cl-shopping-coupon-manage-page .cl-coupon-member-row > .name-td {
    grid-column: 3;
    grid-row: 1;
  }

  body.cl-dashboard-redesign-page #cl-shopping-coupon-manage-page .cl-coupon-details-toggle {
    display: flex;
    align-items: center;
    gap: 4px;
    min-height: 32px;
    margin: 4px 0 0;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--cl-green-text);
    font: inherit;
    cursor: pointer;
  }

  body.cl-dashboard-redesign-page #cl-shopping-coupon-manage-page .cl-coupon-details-toggle svg {
    width: 14px;
    height: 14px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-coupon-manage-page .cl-coupon-details-toggle[aria-expanded="true"] svg {
    transform: rotate(180deg);
  }

  body.cl-dashboard-redesign-page #cl-shopping-coupon-manage-page .cl-coupon-details-toggle:focus-visible {
    outline: 2px solid var(--cl-green);
    outline-offset: 2px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-coupon-manage-page .cl-coupon-mobile-empty {
    display: block;
    margin-top: 4px;
    color: var(--cl-text-muted);
    font-size: 12px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-coupon-manage-page table.table .cl-coupon-member-group:not(.is-expanded) :is(.cl-coupon-member-phone, .cl-coupon-detail-cell, .cl-coupon-member-action, .cl-coupon-detail-row) {
    display: none;
  }

  body.cl-dashboard-redesign-page #cl-shopping-coupon-manage-page .cl-coupon-member-group.is-expanded .cl-coupon-detail-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    border-top: 1px solid var(--cl-border);
  }

  body.cl-dashboard-redesign-page #cl-shopping-coupon-manage-page table.table .cl-coupon-member-group :is(.cl-coupon-member-phone, .cl-coupon-detail-cell, .cl-coupon-member-action) {
    grid-column: 1 / -1;
    padding: 8px 12px !important;
  }

  body.cl-dashboard-redesign-page #cl-shopping-coupon-manage-page .cl-coupon-member-group [data-label]::before {
    content: attr(data-label);
    display: block;
    margin-bottom: 4px;
    color: var(--cl-text-sub);
    font-size: 12px;
  }
}

/* 카카오 채널 연동: 공통 설정 모달과 같은 폼 및 버튼 폭을 사용한다. */
body.cl-dashboard-redesign-page .cl-source-kakao-connect-wrap .cl-source-settings-dialog .modal-content {
  height: auto !important;
}
body.cl-dashboard-redesign-page .cl-source-kakao-connect-wrap .cl-source-settings-dialog .modal-title {
  font-size: 16px !important;
  font-weight: 700 !important;
}
body.cl-dashboard-redesign-page .cl-source-kakao-connect-wrap .plus-friends-connect-modal {
  display: flow-root;
  float: none !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}
body.cl-dashboard-redesign-page .cl-source-kakao-connect-wrap .plus-friends-field {
  display: flow-root;
  clear: both;
  width: 100%;
  margin-bottom: 20px;
}
body.cl-dashboard-redesign-page .cl-source-kakao-connect-wrap .plus-friends-category-field {
  display: flex;
  flex-direction: column;
  margin-bottom: 0;
}
body.cl-dashboard-redesign-page .cl-source-kakao-connect-wrap .plus-friends-field label {
  margin-bottom: 8px;
  font-size: 13px;
  font-weight: 600;
  line-height: 20px;
}
body.cl-dashboard-redesign-page .cl-source-kakao-connect-wrap .plus-friends-field-head {
  gap: 8px;
  flex-wrap: wrap;
}
body.cl-dashboard-redesign-page .cl-source-kakao-connect-wrap .plus-friends-guide-link {
  margin-bottom: 8px;
  color: var(--cl-green-text);
  font-size: 12px;
}
body.cl-dashboard-redesign-page .cl-source-kakao-connect-wrap .plus-friends-input,
body.cl-dashboard-redesign-page .cl-source-kakao-connect-wrap #plus_friends_token {
  width: 100% !important;
  min-width: 0;
  height: 40px !important;
  margin: 0 !important;
  padding: 0 12px !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 6px;
  background: #fff;
  color: var(--cl-text);
  font-size: 14px;
  line-height: 38px;
}
body.cl-dashboard-redesign-page .cl-source-kakao-connect-wrap input::placeholder {
  color: var(--cl-text-muted);
  font-size: 13px;
}
body.cl-dashboard-redesign-page .cl-source-kakao-connect-wrap .plus-friends-phone-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
}
body.cl-dashboard-redesign-page .cl-source-kakao-connect-wrap .authentication {
  width: auto !important;
  height: 40px !important;
  padding: 0 12px;
  border: 0;
  border-radius: 8px;
  background: var(--cl-green);
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  line-height: 40px;
  white-space: nowrap;
}
body.cl-dashboard-redesign-page .cl-source-kakao-connect-wrap .authentication:not(:disabled):hover {
  background: var(--cl-green-hover);
}
body.cl-dashboard-redesign-page .cl-source-kakao-connect-wrap .authentication:disabled {
  background: var(--cl-page-bg);
  color: var(--cl-text-muted);
}
body.cl-dashboard-redesign-page .cl-source-kakao-connect-wrap .plus-friends-token-row {
  float: none;
  clear: both;
  width: 100%;
  margin: 0 0 20px;
  padding: 0;
  border: 0;
  background: transparent;
}
body.cl-dashboard-redesign-page .cl-source-kakao-connect-wrap .plus-friends-token-row .cl-common-form-group {
  display: flex;
  flex-direction: column-reverse;
  float: none;
  width: 100%;
  height: auto;
  padding: 0;
  border: 0;
  background: transparent;
}
body.cl-dashboard-redesign-page .cl-source-kakao-connect-wrap .plus-friends-token-row .plus-friends-label {
  position: static;
  margin: 0 0 8px;
  padding: 0;
  color: var(--cl-text);
  font-size: 13px;
  font-weight: 600;
  line-height: 20px;
  transform: none;
}
body.cl-dashboard-redesign-page .cl-source-kakao-connect-wrap .setting-email-kaTalkPlus.common-selectbox,
body.cl-dashboard-redesign-page .cl-source-kakao-connect-wrap .setting-email-kaTalkPlus .bootstrap-select,
body.cl-dashboard-redesign-page .cl-source-kakao-connect-wrap .setting-email-kaTalkPlus .bootstrap-select > .btn {
  width: 100% !important;
  height: 44px !important;
  max-width: none;
}
body.cl-dashboard-redesign-page .cl-source-kakao-connect-wrap .setting-email-kaTalkPlus .bootstrap-select > .btn {
  padding: 0 32px 0 12px;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
  font-size: 14px;
  line-height: 42px;
}
body.cl-dashboard-redesign-page .cl-source-kakao-connect-wrap .setting-email-kaTalkPlus > svg {
  top: 20px;
}
body.cl-dashboard-redesign-page .cl-source-kakao-connect-wrap input:focus,
body.cl-dashboard-redesign-page .cl-source-kakao-connect-wrap .bootstrap-select.open > .dropdown-toggle {
  outline: 0 !important;
  border-color: var(--cl-green) !important;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .13) !important;
}
body.cl-dashboard-redesign-page .cl-source-kakao-connect-wrap .bootstrap-select > .dropdown-menu {
  padding: 4px;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
  box-shadow: 0 14px 40px rgba(20, 24, 32, .2);
}
body.cl-dashboard-redesign-page .cl-source-kakao-connect-wrap .bootstrap-select .dropdown-menu.inner {
  position: static;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}
@media (max-width: 768px) {
  body.cl-dashboard-redesign-page .cl-source-kakao-connect-wrap .cl-source-settings-dialog .modal-content {
    padding: 24px 20px !important;
  }
}

/* 상품정보: 좁은 데스크톱에서도 본문 좌우 여백을 유지한다. */
@media (min-width: 901px) and (max-width: 1172px) {
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .product-wrap {
    width: calc(100% - 32px) !important;
  }
}

/* 상품정보: 2열 구성을 유지하는 최소 데스크톱 폭에서 옵션 버튼이 본문을 넘지 않게 한다. */
@media (min-width: 901px) and (max-width: 1023px) {
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .form-wrap.option-toggle .option-state-box {
    --cl-product-option-gap: 6px;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .sales-option-section > .sales-option-section-body > .form-wrap.option-toggle .option-state-box > .newcheckbox {
    --cl-product-option-min-width: 80px;
    --cl-product-option-padding: 0 8px;
    --cl-product-option-font-size: 13px;
    min-width: 0;
  }
}

/* 상품정보: 태블릿 폭에서는 가격과 기간 설정을 데스크톱과 같은 라벨 열로 정렬한다. */
@media (min-width: 768px) and (max-width: 900px) {
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 > .form-group {
    align-items: center;
    flex-direction: row;
    gap: 0;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .form-label {
    flex: 0 0 132px;
    width: 132px !important;
    margin: 0 20px 0 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box {
    grid-template-columns: 132px minmax(0, 1fr) !important;
    column-gap: 20px !important;
    row-gap: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box > .title {
    width: 132px !important;
    min-width: 132px !important;
    min-height: 40px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #etc-calendar .etc-calendar-box:not(.etc-setting) > .etc-content {
    max-width: none !important;
  }
}

/* 상품정보: 데스크톱의 라벨 열·고정 여백을 모바일에서는 한 열로 배치한다. */
@media (max-width: 767px) {
  body.cl-dashboard-redesign-page .cl-source-product-add-modal #status-product-box {
    --cl-product-status-item-display: block;
    --cl-product-status-item-flex: 1 1 0;
    --cl-product-status-label-width: 100%;
    --cl-product-status-label-height: 40px;
    --cl-product-status-label-margin: 0 0 0 -1px;
    --cl-product-status-label-padding: 0 4px;
    --cl-product-status-label-border: 1px solid #dbdcdf;
    --cl-product-status-label-size: clamp(11px, 3.35vw, 13px);
    --cl-product-status-check-gap: 3px;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal #status-product-box > .product-padding-box > .form-group > .product-state-box > div + div::before {
    content: none;
    display: none;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal {
    --cl-product-type-size: var(--fs-lg, 14px);
    --cl-product-type-divider-gap: 6px;
    --cl-product-type-check-gap: 4px;
    --cl-product-touch-size: 44px;
    --cl-product-toggle-top: 6px;
    --cl-product-toggle-right: 8px;
    --cl-product-header-display: flex;
    --cl-product-header-padding: 8px 12px;
    --cl-product-title-padding: 0;
    --cl-product-actions-padding: 0;
    --cl-product-action-padding: 0 8px;
    --cl-product-action-display: inline-flex;
    --cl-product-title-size: var(--fs-2xl, 16px);
    --cl-product-title-weight: 700;
    --cl-product-title-align: left;
    --cl-product-actions-position: static;
    --cl-product-actions-display: flex;
    --cl-product-action-margin: 0;
    --cl-product-action-size: var(--fs-sm, 12px);
    --cl-product-action-height: 44px;
    --cl-product-action-radius: var(--r-md, 8px);
    --cl-product-page-padding: 80px 12px 32px;
    --cl-product-page-align: left;
    --cl-product-caption-align: left;
    --cl-product-caption-size: var(--fs-sm, 12px);
    --cl-product-section-padding: 0 16px;
    --cl-product-field-direction: row;
    --cl-product-discount-margin: 0;
    --cl-product-discount-input-width: 96px;
    --cl-product-category-columns: minmax(0, 1fr) 36px;
    --cl-product-category-field-column: 1 / -1;
    --cl-product-category-field-width: 100%;
    --cl-product-delivery-action-margin: 32px;
    --cl-product-label-width: 100%;
    --cl-product-label-margin: 0 0 8px;
    --cl-product-field-width: 100%;
    --cl-product-field-margin: 0;
    --cl-product-field-indent: 0px;
    --cl-product-row-wrap: wrap;
    --cl-product-review-column: 1 / -1;
    --cl-product-review-margin: 8px 0 0 16px;
    --cl-product-notice-columns: minmax(0, 1fr);
    --cl-product-notice-label-gap: 8px;
    --cl-product-notice-control-width: 100%;
    --cl-product-notice-control-column: 1;
    --cl-product-option-padding: 0;
    --cl-product-option-title-position: static;
    --cl-product-option-reset-width: 531px;
    --cl-product-notice-inset: 0px;
    font-family: var(--cl-font);
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-header-wrap {
    align-items: center;
    justify-content: space-between;
    gap: 8px;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-title {
    flex: 1 1 auto;
    min-width: 0;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-button {
    flex: none;
    align-items: center;
    gap: 4px;
    white-space: nowrap;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-caption br {
    display: none;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap {
    text-align: left;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap :is(.form-group, .form-wrap, .product-state-box, .npay-button-box, .mng-prd-box, .etc-content, .sale-calendar-box, .sale-content, .setting-etc-radio) {
    flex-wrap: wrap;
    min-width: 0;
    max-width: 100%;
    row-gap: 8px;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal #sale-calendar .sale-setting:not(.term-setting) .sale-content {
    --cl-product-sale-date-width: 100%;
    --cl-product-sale-date-gap: 8px;
    flex-direction: column;
    width: 100%;
    min-width: 0;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal #sale-calendar .sale-setting:not(.term-setting) .setting-text + div:not(.setting-text) {
    display: none;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .form-group.edit-option-title {
    flex-wrap: nowrap;
    white-space: nowrap;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap :is(input:not([type="checkbox"]):not([type="radio"]), textarea, select, .prod-input, .product-seo-summary, .setting-text) {
    max-width: 100%;
    box-sizing: border-box;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-header {
    padding-right: 16px;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-header > #state-product-box:not(.prod-info) .product-state-box {
    flex-wrap: nowrap;
    white-space: nowrap;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap :is(.unit-pricing-box, .category-wrap:not(.height-auto), .form-wrap:has(> .input-switch), .npay-button-box, .mng-prd-box, .prod-info-notice > .prod-info-box, .page-options:has(> .input-switch)) {
    --cl-product-label-width: auto;
    --cl-product-label-margin: 0;
    --cl-product-toggle-group-flex: 1 1 auto;
    --cl-product-toggle-group-width: 0px;
    --cl-product-toggle-columns: minmax(0, 1fr) 36px;
    --cl-product-toggle-row-width: 100%;
    --cl-product-toggle-margin: 0 0 0 auto;
    --cl-product-toggle-transform: none;
    --cl-product-row-wrap: nowrap;
    flex-wrap: nowrap;
    align-items: center;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .form-wrap:has(.switch-quantity) {
    --cl-product-quantity-display: grid;
    grid-template-columns: 80px minmax(0, 1fr) 36px;
    row-gap: 8px;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .form-wrap:has(.switch-quantity) .quantity-label {
    grid-column: 1 / 3;
    grid-row: 1;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .form-wrap:has(.switch-quantity) > .input-switch {
    grid-column: 3;
    grid-row: 1;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .form-wrap:has(.switch-quantity) #prod-quantity {
    grid-column: 1;
    grid-row: 2;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .form-wrap:has(.switch-quantity) .prod-quantity-unit {
    grid-column: 2;
    grid-row: 2;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap :is(.npay-button-box, .mng-prd-box) {
    width: 100%;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .unit-pricing-box {
    width: 100%;
    justify-content: space-between;
    flex-wrap: nowrap;
    gap: 12px;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing .unit-pricing-box > .form-group {
    flex: 1 1 auto;
    min-width: 0;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.unit-pricing {
    --cl-unit-pricing-indent: 0px;
    --cl-unit-pricing-width: 100%;
    --cl-unit-pricing-input-width: 96px;
    --cl-unit-pricing-select-width: 64px;
    --cl-unit-pricing-bundle-width: 56px;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .unit-pricing-toggle input {
    flex: none;
    text-align: right;
    font-variant-numeric: tabular-nums;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .unit-pricing-toggle .grid > div:last-child {
    flex-wrap: wrap;
    overflow-wrap: anywhere;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .input-switch {
    flex: 0 0 36px;
    width: 36px;
    margin-left: auto;
    align-self: center;
    justify-self: end;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .input-switch > label {
    width: 36px;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .form-label br {
    display: none;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .prod-item-price1 .form-label:empty {
    display: none;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 75px;
    column-gap: 8px;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 > .form-group:first-child {
    width: 100%;
    min-width: 0;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .check-sale {
    align-self: end;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .grade-sale {
    grid-column: 1 / -1;
    justify-self: end;
    min-height: 44px;
    height: 44px;
    margin: 4px 0 0;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 > .form-group.discount-append:not(.hide) {
    grid-column: 1 / -1;
    flex-wrap: nowrap;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 > .error-msg {
    grid-column: 1 / -1;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap > .basic-info-section > .basic-info-section-body > .form-wrap.prod-item-price1 .prod-discount-summary {
    flex: 0 0 auto;
    margin-left: 8px;
    font-size: var(--fs-md, 13px);
    white-space: nowrap;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .option-state-box {
    --cl-product-option-display: grid;
    --cl-product-option-gap: 6px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .option-state-box > .newcheckbox {
    --cl-product-option-width: 100%;
    --cl-product-option-min-width: 0;
    --cl-product-option-height: 36px;
    --cl-product-option-padding: 0 4px;
    --cl-product-option-font-size: var(--fs-md, 13px);
    min-width: 0;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .option-state-box > .options-config {
    grid-column: 3;
    width: 100%;
    justify-self: end;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .product-upload {
    grid-template-columns: minmax(0, 1fr) !important;
    column-gap: 0 !important;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .product-upload > .title {
    display: none !important;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap #product-state .product-upload > .download-contents {
    grid-column: 1 !important;
    justify-self: start !important;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .prod-option-list > li > div {
    max-width: 100%;
    flex-wrap: wrap;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-info-modal .container {
    padding: 16px;
    text-align: left;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-info-modal .container h3 {
    margin: 16px 0;
    font-size: var(--fs-2xl, 16px);
    font-weight: 700;
    text-align: left;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-info-modal .container .options-info-list {
    margin-top: 24px;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-info-modal .container .options-info-wrap {
    position: static;
    height: auto;
    overflow: visible;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-info-modal .container .options-info-wrap .step {
    padding: 0;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-info-modal .container .options-info-wrap .footer-close {
    width: 100%;
    margin: 24px 0 0;
    border-radius: var(--r-md, 8px);
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .options-info-modal .container .options-info-modal-close {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    padding: 0;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-button > li {
    align-items: center;
    justify-content: center;
    min-height: 44px;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .prod-option {
    --cl-option-title-min: var(--cl-option-mobile-title-w, 0px);
    --cl-option-responsive-row-w: var(--cl-option-mobile-row-w, 531px);
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-x: contain;
  }

  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-image-wrap > .prod-item-image {
    max-height: 200px;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-image-wrap > .prod-item-thumb > li {
    max-width: 64px;
    aspect-ratio: 1;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .prod-option:not([data-option_mode="text"]) > :is(.option-head, .prod-option-list) {
    min-width: max(420px, var(--cl-option-mobile-row-w, 420px));
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-option-tab:not(.advanced-mode) .prod-option-title:has(> .owidth),
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-option-tab:not(.advanced-mode) .edit-option-title:has(> .owidth) {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: 12px;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-option-tab:not(.advanced-mode) :is(.prod-option-title, .edit-option-title) > .owidth {
    flex: 0 0 auto;
    width: auto;
    margin: 0;
    white-space: nowrap;
  }
  body.cl-dashboard-redesign-page .cl-source-product-add-modal .prod-detail-wrap .check-sale .checkbox label {
    white-space: nowrap;
  }
}

/* 통계 상품 필터: 닫기와 전체 선택의 터치 영역을 분리한다. */
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .shopping-statistics-filter-modal .modal-content {
  display: flex;
  flex-direction: column;
  height: auto !important;
  max-height: calc(100vh - 48px) !important;
  max-height: calc(100dvh - 48px) !important;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .shopping-statistics-filter-modal .modal-body {
  flex: 1 1 auto;
  min-height: 0;
  height: auto;
  overflow-y: auto !important;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .shopping-statistics-filter-modal .modal-title {
  display: block;
  flex: none;
  font-size: 16px;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .shopping-statistics-filter-modal .filter-modal-top {
  flex: none;
  padding: 0 0 8px;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .shopping-statistics-filter-modal .chk-product {
  float: none;
  margin: 0;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .shopping-statistics-filter-modal .chk-product label {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  margin: 0;
  cursor: pointer;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .shopping-statistics-filter-modal .select-list {
  flex: none;
  padding: 0 0 12px;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .shopping-statistics-filter-modal .select-item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0 6px 6px 0;
  padding: 4px 8px;
  border-radius: 4px;
  background: var(--cl-page-bg);
  font-size: 12px;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .shopping-statistics-filter-modal .filter-item-box {
  flex: none;
  max-height: none;
  overflow: visible;
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .shopping-statistics-filter-modal input:checked + svg {
  fill: var(--cl-green);
}
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .shopping-statistics-filter-modal .modal-footer,
body.cl-dashboard-redesign-page .cl-source-settings-dialog-wrap .shopping-statistics-filter-modal .modal-footer .btn {
  flex: none;
}

/* v2 회원 리스트: 600px 이하에서 원본 행을 카드로 표시한다. */
body.cl-dashboard-redesign-page #cl-member-list-page .cl-member-card-toggle,
body.cl-dashboard-redesign-page #cl-member-list-page .cl-member-card-level {
  display: none;
}
@media (max-width: 600px) {
  body.cl-dashboard-redesign-page #cl-member-list-page .mng-settings.memberlist {
    width: 100% !important;
    padding: 18px 16px;
  }
  body.cl-dashboard-redesign-page #cl-member-list-page .cl-source-member-toolbar {
    align-items: center;
    justify-content: space-between;
  }
  body.cl-dashboard-redesign-page #cl-member-list-page .mng-title {
    flex: 0 0 auto;
    width: auto;
  }
  body.cl-dashboard-redesign-page #cl-member-list-page .mng-search-box {
    flex: 0 1 230px;
    width: 230px;
    margin-left: auto;
  }
  body.cl-dashboard-redesign-page #cl-member-list-page .mng-subMenu-list {
    flex: 0 1 auto;
    width: auto;
    max-width: 100%;
    margin-left: auto;
  }
  body.cl-dashboard-redesign-page #cl-member-list-page .table-wrap,
  body.cl-dashboard-redesign-page #cl-member-list-page .tableListContainer {
    width: 100%;
    height: auto;
    min-height: 0;
    overflow: visible;
  }
  body.cl-dashboard-redesign-page #cl-member-list-page .tableListContainer table {
    display: block;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    border: 0;
  }
  body.cl-dashboard-redesign-page #cl-member-list-page .memberlist-table > thead,
  body.cl-dashboard-redesign-page #cl-member-list-page .memberlist-table > colgroup {
    display: none;
  }
  body.cl-dashboard-redesign-page #cl-member-list-page .memberlist-table > tbody {
    display: block;
  }
  body.cl-dashboard-redesign-page #cl-member-list-page .memberlist-table > tbody > tr[data-uno] {
    position: relative;
    display: grid;
    grid-template-columns: 16px minmax(0, max-content) auto minmax(40px, 1fr);
    align-items: center;
    column-gap: 9px;
    margin-bottom: 8px;
    padding: 0 12px;
    border: 1px solid var(--cl-border);
    border-radius: 10px;
    background: var(--cl-surface);
  }
  body.cl-dashboard-redesign-page #cl-member-list-page .memberlist-table > tbody > tr[data-uno] > td {
    position: static;
    width: auto !important;
    min-width: 0 !important;
    max-width: none;
    height: auto;
    margin: 0;
    padding: 11px 0;
    border: 0;
    box-shadow: none;
    text-align: left;
    background: transparent !important;
  }
  body.cl-dashboard-redesign-page #cl-member-list-page .memberlist-table > tbody > tr[data-uno] > td.no {
    position: relative;
    grid-area: 1 / 1;
  }
  body.cl-dashboard-redesign-page #cl-member-list-page .tableListContainer table tbody td.newcheckbox label {
    height: 44px;
    min-height: 44px;
  }
  body.cl-dashboard-redesign-page #cl-member-list-page .memberlist-table td.id {
    grid-area: 1 / 2;
    font-size: 14px;
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: pointer;
  }
  body.cl-dashboard-redesign-page #cl-member-list-page .memberlist-table td.level { grid-area: 1 / 3; cursor: pointer; }
  body.cl-dashboard-redesign-page #cl-member-list-page .memberlist-table td.level select { display: none; }
  body.cl-dashboard-redesign-page #cl-member-list-page .memberlist-table td.level .bootstrap-select.cl-member-level-select .filter-option::before {
    content: "Lv.";
    flex: none;
  }
  body.cl-dashboard-redesign-page #cl-member-list-page .memberlist-table td.level .bootstrap-select.cl-member-level-select > .dropdown-toggle {
    padding-right: 20px;
    padding-left: 8px;
  }
  body.cl-dashboard-redesign-page #cl-member-list-page .memberlist-table td.level .bootstrap-select.cl-member-level-select .filter-option-inner {
    flex: 1 1 auto;
    width: auto;
    min-width: 0;
  }
  body.cl-dashboard-redesign-page #cl-member-list-page .memberlist-table td.level .admin_level {
    display: inline-block;
    min-width: 0;
    min-height: 0;
    padding: 2px 7px;
    border-radius: 4px;
    background: #F1F2F5;
    color: var(--cl-text-sub);
    font-size: 11px;
    font-weight: 600;
    line-height: 16px;
    white-space: nowrap;
  }
  body.cl-dashboard-redesign-page #cl-member-list-page .memberlist-table td.level .admin_level:not(.hand) {
    cursor: default;
  }
  body.cl-dashboard-redesign-page #cl-member-list-page .memberlist-table > tbody > tr > td.email {
    grid-area: 1 / 4;
    padding-right: 22px;
    color: var(--cl-text-sub);
    font-size: 12px;
    text-align: right;
    cursor: pointer;
  }
  body.cl-dashboard-redesign-page #cl-member-list-page .cl-member-card-email {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  body.cl-dashboard-redesign-page #cl-member-list-page .cl-member-card-toggle {
    position: absolute;
    top: 0;
    right: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    padding: 0;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: var(--cl-text-muted);
  }
  body.cl-dashboard-redesign-page #cl-member-list-page .cl-member-card-toggle svg { width: 15px; height: 15px; }
  body.cl-dashboard-redesign-page #cl-member-list-page .cl-member-card-toggle[aria-expanded="true"] svg { transform: rotate(180deg); }
  body.cl-dashboard-redesign-page #cl-member-list-page .cl-member-card-toggle:focus-visible { outline: 2px solid var(--cl-green); }
  body.cl-dashboard-redesign-page #cl-member-list-page .memberlist-table > tbody > tr > td.cl-member-card-detail { display: none; }
  body.cl-dashboard-redesign-page #cl-member-list-page .memberlist-table > tbody > tr.cl-member-card-open > td.cl-member-card-detail {
    display: flex;
    grid-column: 1 / -1;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 8px 0;
    border-top: 1px solid var(--cl-line);
    font-size: 12px;
    white-space: normal !important;
  }
  body.cl-dashboard-redesign-page #cl-member-list-page .cl-member-card-detail::before {
    content: attr(data-label);
    flex: none;
    color: var(--cl-text-muted);
  }
  body.cl-dashboard-redesign-page #cl-member-list-page .cl-member-card-value {
    min-width: 0;
    text-align: right;
    overflow-wrap: anywhere;
  }
  body.cl-dashboard-redesign-page #cl-member-list-page .memberlist-table > tbody > tr.cl-member-card-open {
    padding-bottom: 12px;
  }
  body.cl-dashboard-redesign-page #cl-member-list-page .memberlist-table .listZero,
  body.cl-dashboard-redesign-page #cl-member-list-page .memberlist-table .listZero td {
    display: block;
    width: 100%;
    min-width: 0;
  }
}

/* Flow 86614401: 341~600px 회원 카드의 레벨 열을 회원 아이디 길이와 무관하게 정렬한다. */
@media (min-width: 341px) and (max-width: 600px) {
  body.cl-dashboard-redesign-page #cl-member-list-page .memberlist-table > tbody > tr[data-uno] > td.level {
    display: flex !important;
    align-items: center;
    gap: 4px;
    overflow: visible;
  }
}

@media (min-width: 378px) and (max-width: 600px) {
  body.cl-dashboard-redesign-page #cl-member-list-page .memberlist-table > tbody > tr[data-uno] {
    grid-template-columns: 16px minmax(0, 157px) 90px minmax(40px, 1fr);
  }
}

@media (min-width: 341px) and (max-width: 377px) {
  body.cl-dashboard-redesign-page #cl-member-list-page .memberlist-table > tbody > tr[data-uno] {
    grid-template-columns: 16px minmax(0, 157px) 54px minmax(22px, 1fr);
  }
}

/* 템플릿 카테고리: 리디자인 브랜드 컬러 상태 */
body.cl-redesign-scroll-page .template-cate-list {
  --template-category-green: #03c75a;
  --template-category-green-text: var(--cl-green-text);
  --template-category-green-tint: #f6fdf9;
}

body.cl-redesign-scroll-page .template-cate-list .catebox .cate:hover,
body.cl-redesign-scroll-page .template-cate-list .catebox .cate:focus {
  border-color: var(--template-category-green);
  background-color: var(--template-category-green-tint);
  color: var(--cl-green-text);
}

body.cl-redesign-scroll-page .template-cate-list .catebox .cate.active {
  border-color: var(--template-category-green);
  background-color: var(--cl-surface);
  color: var(--cl-green-text);
}

/* 탈퇴 리스트: 좁은 화면에서도 정렬·표시 수·항목 필터를 한 줄에 유지한다. */
@media (max-width: 640px) {
  body.cl-dashboard-redesign-page #cl-member-leavelist-page .mng-search-box {
    max-width: none;
  }

  body.cl-dashboard-redesign-page #cl-member-leavelist-page .mng-subMenu-list {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: 8px;
    width: 100%;
  }

  body.cl-dashboard-redesign-page #cl-member-leavelist-page .mng-selectboxlist {
    display: flex;
    flex: 0 1 auto;
    flex-basis: auto;
    flex-wrap: nowrap;
    gap: 8px;
    width: auto;
    min-width: 0;
  }

  body.cl-dashboard-redesign-page #cl-member-leavelist-page .mng-selectboxlist .input-group-btn {
    flex: 1 1 0;
    min-width: 0;
  }

  body.cl-dashboard-redesign-page #cl-member-leavelist-page .mng-sortWrap {
    position: relative;
    flex: none;
    margin-left: 0;
  }

  body.cl-dashboard-redesign-page #cl-member-leavelist-page .mng-sortlistWrap {
    right: 0;
    left: auto;
  }
}

@media (max-width: 360px) {
  body.cl-dashboard-redesign-page #cl-member-leavelist-page .mng-selectboxlist {
    flex: 1 1 auto;
  }

  body.cl-dashboard-redesign-page #cl-member-leavelist-page .mng-selectboxlist select,
  body.cl-dashboard-redesign-page #cl-member-leavelist-page #sfl_sort,
  body.cl-dashboard-redesign-page #cl-member-leavelist-page #sfl_view,
  body.cl-dashboard-redesign-page #cl-member-leavelist-page .mng-selectboxlist .bootstrap-select.cl-member-toolbar-select > .dropdown-toggle {
    width: 100%;
    min-width: 0;
    padding-right: 22px;
    padding-left: 8px;
    background-position: right 7px center;
    background-size: 12px;
    font-size: 12.5px;
  }

  body.cl-dashboard-redesign-page #cl-member-leavelist-page .mng-sortBtn {
    gap: 4px;
    min-width: 88px;
    padding-right: 8px;
    padding-left: 8px;
    font-size: 12.5px;
  }

}

/* Flow 86304780: 알림 > 문자 알림 / 카카오 알림톡 세부 보정 */
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-sms-row-sender .notification-sms-help {
  font-size: 12px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-sign-pad {
  position: relative !important;
  width: 100% !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-sign-canvas {
  height: 160px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-sign-placeholder {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  z-index: 1 !important;
  width: calc(100% - 32px) !important;
  color: var(--cl-text-muted) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  text-align: center !important;
  pointer-events: none !important;
  transform: translate(-50%, -50%) !important;
  transition: opacity .12s ease !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.cl-source-sms-register-modal .sms-number-sign-placeholder.is-hidden {
  opacity: 0 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-link.template-button {
  gap: 7px !important;
  height: 40px !important;
  padding: 0 12px !important;
  border: 1px solid var(--cl-green) !important;
  border-radius: 8px !important;
  background: #fff !important;
  color: var(--cl-green-text) !important;
  transition: background-color .12s ease, border-color .12s ease !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-link.template-button:hover,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-link.template-button:focus {
  border-color: var(--cl-green) !important;
  background: var(--cl-green-tint) !important;
  color: var(--cl-green-text) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-link.template-button .notification-kakao-template-icon {
  flex: 0 0 16px !important;
  width: 16px !important;
  height: 16px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-link.template-button .notification-kakao-template-count {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 24px !important;
  height: 22px !important;
  padding: 0 6px !important;
  border-radius: var(--r-full, 999px) !important;
  background: var(--cl-green) !important;
  color: #fff !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  font-variant-numeric: tabular-nums;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-link.template-button .notification-kakao-template-chevron {
  flex: 0 0 10px !important;
  width: 10px !important;
  height: 10px !important;
  fill: currentColor !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-receiver-control.notification-kakao-channel-locked {
  opacity: 1 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-receiver-control.notification-kakao-channel-locked .notification-kakao-input-wrap,
body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-receiver-control .notification-kakao-input-wrap:has(.notification-kakao-input:disabled) {
  border-color: var(--cl-border) !important;
  background: var(--cl-page-bg) !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-receiver-control .notification-kakao-input:disabled {
  color: var(--cl-text-muted) !important;
  cursor: default !important;
  opacity: 1 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-receiver-control .notification-kakao-input:disabled::placeholder {
  color: var(--cl-text-muted) !important;
  opacity: 1 !important;
}

body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-receiver-control .notification-kakao-btn:disabled {
  background: var(--cl-line) !important;
  color: var(--cl-text-muted) !important;
  opacity: 1 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal {
  --cl-source-notification-guide-content-width: 808px;
  width: 1288px !important;
  max-width: calc(100vw - 64px) !important;
  height: min(820px, calc(100vh - 46px)) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .guide-top,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .guide-top {
  display: grid !important;
  grid-template-columns: max-content minmax(0, 1fr) !important;
  align-items: center !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .guide-top .guidetitle,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .guide-top .guidetitle {
  grid-column: 1 !important;
  grid-row: 1 !important;
  margin: 0 10px 0 24px !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 56px !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-summary,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-summary {
  grid-column: 2 !important;
  grid-row: 1 !important;
  margin: 0 56px 0 0 !important;
  overflow: hidden !important;
  color: var(--cl-text-muted) !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 56px !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .guide-menu,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .guide-menu {
  grid-column: 1 / -1 !important;
  grid-row: 2 !important;
  border-top: 1px solid var(--cl-border) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .guide-menu ul,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .guide-menu ul {
  grid-template-columns: repeat(3, 150px) !important;
  justify-content: center !important;
  gap: 30px !important;
  min-height: 104px !important;
  padding: 16px 0 !important;
  border-bottom: 1px solid var(--cl-border) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .guide-menu li,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .guide-menu li {
  gap: 4px !important;
  width: 150px !important;
  height: 70px !important;
  padding: 0 14px !important;
  border: 1px solid var(--cl-border) !important;
  border-radius: 12px !important;
  color: var(--cl-text-sub) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .guide-menu li.active,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .guide-menu li.active {
  border: 2px solid var(--cl-green) !important;
  background: var(--cl-surface) !important;
  box-shadow: 0 0 0 4px rgba(3, 199, 90, .14) !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .guide-menu li p,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .guide-menu li p {
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1.5 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .guide-menu li.active p,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .guide-menu li.active p {
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .guide-menu li::before,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .guide-menu li::before {
  content: none !important;
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-tab-number,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-tab-number {
  display: inline !important;
  margin-right: 4px !important;
  font: inherit !important;
  line-height: inherit !important;
  vertical-align: baseline !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .guide-menu li::after,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .guide-menu li::after,
body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .guide-menu li.active::after,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .guide-menu li.active::after {
  content: "" !important;
  position: absolute !important;
  top: 50% !important;
  right: -19px !important;
  bottom: auto !important;
  left: auto !important;
  width: 7px !important;
  height: 7px !important;
  border-top: 1px solid var(--cl-green-line) !important;
  border-right: 1px solid var(--cl-green-line) !important;
  background: transparent !important;
  transform: translateY(-50%) rotate(45deg) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .guide-menu li:last-child::after,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .guide-menu li:last-child::after {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-wrap .step,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-wrap .step {
  padding: 38px 30px 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-step h3,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-step h3 {
  display: flex !important;
  align-items: center !important;
  gap: 9px !important;
  margin-bottom: 10px !important;
  font-size: 18px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-step-number,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-step-number {
  display: inline-flex !important;
  flex: 0 0 22px !important;
  align-items: center !important;
  justify-content: center !important;
  width: 22px !important;
  height: 22px !important;
  margin: 0 !important;
  border-radius: var(--r-full, 999px) !important;
  background: var(--cl-green) !important;
  color: #fff !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-step p.sms-number-guide-lead,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-step p.sms-number-guide-lead {
  margin: 0 0 22px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--cl-text-sub) !important;
  font-size: 12px !important;
  line-height: 20px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-step p.sms-number-guide-lead b,
body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-step p.sms-number-guide-lead b {
  color: var(--cl-text) !important;
  font-weight: 700 !important;
}

@media (max-width: 768px) {
  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row.notification-kakao-channel-control,
  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row.notification-kakao-receiver-control {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 80px !important;
    align-items: start !important;
    flex-direction: initial !important;
    gap: 8px !important;
  }

  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row.notification-kakao-channel-control > .notification-kakao-input,
  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row.notification-kakao-receiver-control > .notification-kakao-input-wrap {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row.notification-kakao-channel-control > .notification-kakao-btn,
  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .notification-kakao-control-row.notification-kakao-receiver-control > .notification-kakao-btn {
    grid-column: 2 !important;
    grid-row: 1 !important;
    width: 80px !important;
    min-width: 80px !important;
    max-width: 80px !important;
  }

  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .settingBtnSaveWrap .setting-button,
  body.cl-dashboard-redesign-page .shopping-dashboard.setting-email:not(.setting-email-legacy) .settingBtnSaveWrap .kakao-btn-bottom {
    width: auto !important;
    min-width: 92px !important;
    max-width: none !important;
  }
}

@media (max-width: 640px) {
  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal,
  body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal {
    --cl-source-notification-guide-content-width: 100%;
    width: 100% !important;
    max-width: none !important;
    height: calc(100dvh - 24px) !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .guide-top,
  body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .guide-top {
    grid-template-columns: 1fr !important;
    padding-top: 14px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .guide-top .guidetitle,
  body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .guide-top .guidetitle {
    grid-column: 1 !important;
    grid-row: 1 !important;
    margin: 0 44px !important;
    font-size: 18px !important;
    line-height: 28px !important;
    text-align: center !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-summary,
  body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .sms-number-guide-summary {
    grid-column: 1 !important;
    grid-row: 2 !important;
    margin: 4px 20px 14px !important;
    line-height: 18px !important;
    text-align: center !important;
    white-space: normal !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .guide-menu,
  body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .guide-menu {
    grid-row: 3 !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .guide-menu ul,
  body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .guide-menu ul {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 16px !important;
    min-height: 76px !important;
    padding: 10px 16px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .guide-menu li,
  body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .guide-menu li {
    width: auto !important;
    height: 54px !important;
    padding: 0 6px !important;
  }

  body.cl-dashboard-redesign-page :is(.flat-modal.cl-common-modal:has(.modal-dialog.sms-number-guide-modal), .flat-modal.cl-source-sms-number-guide-root) .modal-dialog.sms-number-guide-modal .guide-menu li p {
    font-size: 11px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .guide-menu li::after,
  body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .guide-menu li::after,
  body.cl-dashboard-redesign-page .flat-modal.cl-common-modal .modal-default .modal-dialog.sms-number-guide-modal .guide-menu li.active::after,
  body.cl-dashboard-redesign-page .flat-modal.cl-source-sms-number-guide-root .modal-default .modal-dialog.sms-number-guide-modal .guide-menu li.active::after {
    right: -12px !important;
  }
}

/* 쇼핑 주문 목록: 헤더는 가로 구분선만 유지한다. */
body.cl-dashboard-redesign-page #cl-shopping-order-page .head-div .list-table > thead > tr > th {
  border-right: 0 !important;
  border-left: 0 !important;
  box-shadow: none !important;
}

/* 모바일 쇼핑: 주문은 상품 요약을 우선하고, 문의·후기는 가로 표 대신 카드로 표시한다. */
@media (max-width: 768px) {
  body.cl-dashboard-redesign-page :is(#cl-shopping-order-page, #cl-shopping-inquiry-page) {
    margin-right: 0 !important;
    margin-left: 0 !important;
    padding: 20px 14px 40px !important;
  }

  body.cl-dashboard-redesign-page :is(
    #cl-shopping-order-page .cl-source-order-head,
    #cl-shopping-inquiry-page .cl-source-inquiry-head
  ) {
    margin-bottom: 20px !important;
  }

  body.cl-dashboard-redesign-page :is(
    #cl-shopping-order-page .cl-source-order-breadcrumb,
    #cl-shopping-inquiry-page .cl-source-inquiry-breadcrumb
  ) {
    gap: 6px;
    font-size: 18px;
  }

  body.cl-dashboard-redesign-page :is(
    #cl-shopping-order-page .cl-source-order-desc,
    #cl-shopping-inquiry-page .cl-source-inquiry-desc
  ) {
    margin-top: 8px;
    font-size: 12.5px;
    line-height: 1.55;
  }

  body.cl-dashboard-redesign-page :is(
    #cl-shopping-order-page .cl-source-order-panel,
    #cl-shopping-inquiry-page .cl-source-inquiry-panel
  ) {
    min-height: 0;
    padding: 0 14px 20px;
    border-radius: 10px;
  }

  /* 주문: 대분류 탭과 네이버페이 갱신을 한 줄에 배치한다. */
  body.cl-dashboard-redesign-page #cl-shopping-order-page #section-top-menu .new-nav-container {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: flex-end;
    align-content: flex-end;
    height: 44px;
    gap: 0;
    padding: 0;
    border-bottom: 1px solid var(--cl-border);
    box-sizing: border-box;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page #section-top-menu .sub-navbar {
    grid-column: 1;
    grid-row: 1;
    align-items: flex-end;
    order: initial;
    width: auto;
    height: 44px;
    min-width: 0;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page #section-top-menu .sub-navbar li {
    display: flex;
    align-items: flex-end;
    height: 100%;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page .cl-source-order-top-right {
    grid-column: 2;
    grid-row: 1;
    justify-self: end;
    margin-left: 0;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page #section-top-menu .sub-navbar a {
    box-sizing: border-box;
    height: 44px;
    min-height: 0;
    margin-bottom: 0;
    padding: 0 14px;
    font-size: 14px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page .cl-source-order-top-right .btn-naverpay-sync {
    display: inline-flex !important;
    height: 32px;
    min-height: 32px;
    padding: 0 10px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page :is(.submenu_navWrap, .submenu_nav, .submenu_nav ul, .submenu_nav li, .submenu_nav .sub-menu) {
    height: 44px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page .submenu_nav {
    gap: 16px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page .submenu_nav ul {
    gap: 20px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page .submenu_nav .sub-menu {
    padding: 0;
    font-size: 13px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page .submenu_nav li.search {
    min-width: 44px;
    height: 44px;
    font-size: 13px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page .btn-util-section {
    display: block;
    margin: 14px 0 12px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page .btn-batch-group:not(:empty):not(.is-empty) {
    display: flex;
    margin-bottom: 8px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page .btn-option-group {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    width: 100%;
    padding: 0 0 2px;
    overflow: visible;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page :is(
    .btn-batch-proc, .download-option, .tracking-option,
    .state-option, .list-limit-option, .common-selectbox
  ) {
    flex: none;
    min-height: 40px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page :is(
    .common-selectbox select,
    .common-selectbox > .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn),
    .common-selectbox > .bootstrap-select .btn.btn-default
  ) {
    height: 38px !important;
    min-height: 38px !important;
    line-height: 38px !important;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page .cl-source-order-table-scroll {
    width: 100%;
    margin: 0;
    max-width: 100%;
    border-top: 1px solid var(--cl-border);
    border-bottom: 1px solid var(--cl-border);
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page .order-list-area:not(.empty-list) {
    --cl-order-left-width: 368px !important;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page .order-list-area:not(.empty-list) .cl-source-order-group-col {
    width: 128px !important;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page .order-list-area:not(.empty-list) .cl-source-order-id-cell {
    min-width: 0;
    white-space: normal;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page .order-list-area:not(.empty-list) .cl-source-order-id-value {
    display: block;
    max-width: 100%;
    overflow-wrap: anywhere;
    word-break: break-all;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page .order-list-area:not(.empty-list) .right-div {
    flex-basis: 880px;
    width: 880px;
    min-width: 880px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page .body-div .list-table tbody tr,
  body.cl-dashboard-redesign-page #cl-shopping-order-page .body-div .list-table td {
    height: 72px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page .order-mobile-status {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-top: 5px;
    color: var(--cl-text-sub);
    font-size: 11.5px;
    font-weight: 500;
    line-height: 16px;
    white-space: nowrap;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page .order-mobile-status .f-right {
    float: none !important;
    margin-left: auto;
    color: var(--cl-text);
    font-variant-numeric: tabular-nums;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page .cl-source-order-scroll-hint {
    margin: 0 0 8px;
    padding-left: 2px;
  }

  /* 문의·후기: 상단 메뉴와 갱신 버튼은 첫 행, 문의·후기 탭은 둘째 행에 유지한다. */
  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page #section-top-menu .new-nav-container {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center;
    padding-top: 4px;
    overflow: visible;
  }

  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page #section-top-menu .new-nav-container > .sub-navbar:first-child {
    grid-column: 1;
    grid-row: 1;
    justify-self: stretch;
    width: auto;
    margin: 0 !important;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }

  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page #section-top-menu .new-nav-container > .sub-navbar:first-child::-webkit-scrollbar {
    display: none;
  }

  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page #section-top-menu .sub-navbar a {
    min-height: 44px;
    padding: 0 14px;
    font-size: 14px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page .submenu_nav.qnaReview {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: center;
    gap: 8px;
    padding-top: 0;
    overflow: visible;
  }

  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page .submenu_nav.qnaReview ul {
    min-width: 0;
    gap: 20px;
    overflow-x: auto;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }

  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page .submenu_nav.qnaReview ul::-webkit-scrollbar {
    display: none;
  }

  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page .submenu_nav.qnaReview .sub-menu {
    min-height: 44px;
    padding: 0;
    font-size: 13px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page .cl-source-inquiry-top-right {
    margin-left: 0;
  }

  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page #section-top-menu .new-nav-container > .cl-source-inquiry-top-right {
    grid-column: 2;
    grid-row: 1;
    justify-self: end;
  }

  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page .cl-source-inquiry-top-right .btn-naverpay-sync {
    min-height: 40px;
    padding: 0 10px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page .cl-source-inquiry-toolbar {
    justify-content: flex-start;
    margin: 14px 0 12px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page .cl-source-inquiry-toolbar-right {
    width: 100%;
  }

  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page .answer-filter.cl-source-inquiry-filter,
  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page .cl-source-inquiry-filter .cl-redesign-select,
  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page .cl-source-inquiry-filter .cl-redesign-select-trigger {
    width: 140px;
    height: 40px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page .qna-container {
    min-height: 0;
    overflow: visible;
  }

  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page :is(.qna-header, .review-header) {
    display: none;
  }

  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page :is(.qna-parent-box, .review-parent-box) {
    display: grid;
    gap: 10px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page :is(.qna-box, .review-box) {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-rows: auto auto auto;
    gap: 6px 12px;
    min-width: 0;
    min-height: 0;
    padding: 14px !important;
    background: #fff;
    border: 1px solid var(--cl-border);
    border-radius: 10px;
    box-shadow: var(--shadow-flat, 0 1px 3px rgba(20, 24, 32, .05));
  }

  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page :is(.qna-box, .review-box):hover {
    background: #fff;
  }

  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page :is(.qna-box, .review-box) > .qnaR-contentsBox {
    width: auto !important;
    min-width: 0;
    padding: 0;
    text-align: left;
  }

  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page :is(.qna-box, .review-box) > .qnaRdate {
    grid-column: 2;
    grid-row: 1;
    align-self: center;
    color: var(--cl-text-muted);
    font-size: 11.5px;
    text-align: right;
    white-space: nowrap;
  }

  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page .qna-box > .qnaRreply,
  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page .review-box > .re_star {
    grid-column: 1;
    grid-row: 1;
    align-self: center;
  }

  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page .qna-box > .qnaRreply {
    justify-self: start;
    width: max-content !important;
  }

  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page :is(.qna-box, .review-box) > .qna {
    grid-column: 1 / -1;
    grid-row: 2;
    padding: 2px 0;
  }

  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page :is(.qna-box, .review-box) > :is(.qna-name, .review-name) {
    grid-column: 1 / -1;
    grid-row: 3;
    display: flex;
    align-items: center;
    gap: 6px;
    color: var(--cl-text-sub);
    font-size: 12px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page :is(.qna-box, .review-box) > :is(.qna-name, .review-name)::before {
    content: "작성자";
    color: var(--cl-text-muted);
    font-size: 11px;
    font-weight: 500;
  }

  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page :is(.qna-box .qna-title, .review-order-name) {
    display: block;
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
    overflow-wrap: anywhere;
  }

  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page .qnaRreply {
    width: max-content !important;
    padding: 4px 8px !important;
    border-radius: 999px;
    background: var(--cl-green-soft);
    color: var(--cl-green-text);
    font-size: 11px;
    font-weight: 700;
    line-height: 16px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page .qnaRreply.no_answer {
    background: var(--cl-bg-3, #f1f2f5);
    color: var(--cl-text-sub);
  }

  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page .qnaRreply:not(.qna_Replied):not(.no_answer) {
    background: #FBF2E6;
  }

  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page .qnaR-contents {
    min-width: 0;
    max-width: 100%;
    margin-top: -10px;
    padding: 16px 14px;
    border: 1px solid var(--cl-border);
    border-top: 0;
    border-radius: 0 0 10px 10px;
    overflow-wrap: anywhere;
  }

  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page .qnaR-contents :is(.qna-title-box, .product-data, .qna-privacy, .answer-content) {
    padding: 12px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page .qnaR-contents :is(.qna-btn-box, .mypage-button) {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page .qnaR-contents :is(.qna-btn-box, .mypage-button) :is(button, .btn) {
    width: 100%;
    min-height: 44px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page .search-section {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    margin-top: 18px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page .search-section .cl-source-inquiry-search-select {
    grid-column: 1 / -1;
    width: 100%;
  }

  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page .search-section .cl-source-inquiry-search-select .cl-redesign-select-trigger,
  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page .search-section .search-input,
  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page .search-section .search-btn {
    width: 100%;
    height: 40px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page .search-section .search-btn {
    min-width: 72px;
    padding: 0 16px;
  }
}

@media (max-width: 480px) {
  body.cl-dashboard-redesign-page :is(#cl-shopping-order-page, #cl-shopping-inquiry-page) #section-top-menu .new-nav-container {
    grid-template-columns: minmax(0, 1fr);
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page .cl-source-order-top-right {
    display: none;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page .btn-option-group:has(> .cl-source-order-naverpay-mobile-slot) {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page .btn-option-group:has(> .cl-source-order-naverpay-mobile-slot) .state-option {
    grid-column: 1 / -1;
    justify-self: start;
  }

  body.cl-dashboard-redesign-page #cl-shopping-order-page .btn-util-section .cl-source-order-naverpay-mobile-slot {
    display: flex !important;
    flex: 0 0 auto;
    align-items: center;
    justify-content: flex-end;
    width: auto;
    min-height: 40px;
    margin-left: auto;
  }

  body.cl-dashboard-redesign-page :is(
    #cl-shopping-order-page .btn-util-section .cl-source-order-naverpay-mobile-slot,
    #cl-shopping-inquiry-page .cl-source-inquiry-toolbar-right .cl-source-inquiry-top-right
  ) .btn-naverpay-sync {
    display: inline-flex !important;
    width: auto;
    min-width: 128px;
    padding: 0 10px;
    color: var(--cl-text-sub) !important;
    font-size: 13px;
  }

  body.cl-dashboard-redesign-page :is(
    #cl-shopping-order-page,
    #cl-shopping-order-search-page,
    #cl-shopping-statistics-page,
    #cl-shopping-inquiry-page
  ) .btn-naverpay-sync {
    height: 40px;
    min-height: 40px;
  }

  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page .cl-source-inquiry-toolbar-right {
    min-width: 0;
    flex-wrap: nowrap;
  }

  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page .cl-source-inquiry-toolbar-right > .answer-filter {
    flex: 0 1 140px;
    width: auto;
    min-width: 0;
  }

  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page .cl-source-inquiry-toolbar-right .answer-filter :is(.cl-redesign-select, .cl-redesign-select-trigger) {
    width: 100%;
    min-width: 0;
  }

  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page .cl-source-inquiry-toolbar-right .cl-source-inquiry-top-right {
    margin-left: auto;
  }

  body.cl-dashboard-redesign-page #cl-shopping-inquiry-page :is(.qna-box, .review-box) {
    padding: 13px 12px !important;
  }
}

/* 소셜 로그인과 메일 연동 가이드는 네이버 로그인 가이드의 헤더를 공유한다. */
body.cl-dashboard-redesign-page .cl-source-social-guide-v2-modal .guide-top,
.cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .guide-top {
  display: grid !important;
  grid-template-columns: fit-content(100%) minmax(0, 1fr) !important;
  align-items: center !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-v2-modal .guide-top .guidetitle,
.cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .guide-top h3.modal-title {
  grid-column: 1 !important;
  grid-row: 1 !important;
  justify-self: start !important;
  width: max-content !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 58px !important;
  margin: 0 10px 0 24px !important;
  padding: 0 !important;
  border: 0 !important;
  font-size: 16px !important;
  font-weight: 800 !important;
  line-height: 58px !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-v2-modal .cl-source-social-guide-summary,
.cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .smtp-guide-summary {
  grid-column: 2 !important;
  grid-row: 1 !important;
  justify-self: start !important;
  min-width: 0 !important;
  margin: 0 58px 0 0 !important;
  overflow: hidden !important;
  color: var(--cl-text-muted) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 58px !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-v2-modal .guide-top .guide-menu {
  grid-column: 1 / -1 !important;
  grid-row: 2 !important;
  border-top: 1px solid var(--cl-bg-3, #f1f2f5) !important;
}

/* 외부연동 앱 가이드는 시안의 kg-head와 같은 58px 제목 행을 사용한다. */
body.cl-dashboard-redesign-page .cl-source-external-guide-modal .guide-top {
  display: block !important;
}

body.cl-dashboard-redesign-page .cl-source-external-guide-modal .cl-source-external-guide-head {
  display: flex !important;
  flex: none !important;
  align-items: center !important;
  gap: 14px !important;
  width: 100% !important;
  height: 58px !important;
  padding: 0 58px 0 24px !important;
  border-bottom: 1px solid #edeff2 !important;
}

body.cl-dashboard-redesign-page .cl-source-external-guide-modal .guide-top .cl-source-external-guide-head .modal-title.guidetitle {
  display: block !important;
  flex: none !important;
  width: auto !important;
  max-width: none !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  color: var(--cl-text) !important;
  font-size: 16px !important;
  font-weight: 800 !important;
  line-height: 1.4 !important;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-external-guide-modal .cl-source-external-guide-head .cl-source-social-guide-summary {
  flex: 0 1 auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
  color: var(--cl-text-muted) !important;
  font-size: 12.5px !important;
  font-weight: 400 !important;
  line-height: 1.4 !important;
  text-align: left !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.cl-dashboard-redesign-page .cl-source-external-guide-modal .guide-top .guide-menu {
  border-top: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-external-guide-modal .guide-top .guide-menu ul {
  gap: 0 !important;
}

body.cl-dashboard-redesign-page .cl-source-external-guide-modal .guide-top .guide-menu ul li {
  flex: 0 0 168px !important;
  width: 168px !important;
  height: 70px !important;
  border-radius: 12px !important;
}

body.cl-dashboard-redesign-page .cl-source-external-guide-modal .guide-top .guide-menu ul li::after,
body.cl-dashboard-redesign-page .cl-source-external-guide-modal .guide-top .guide-menu ul li.active::after {
  content: none !important;
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-external-guide-modal .cl-source-external-guide-arrow {
  display: flex !important;
  flex: 0 0 26px !important;
  align-items: center !important;
  justify-content: center !important;
  width: 26px !important;
  color: #7FD9A6 !important;
}

body.cl-dashboard-redesign-page .cl-source-external-guide-modal .cl-source-external-guide-arrow svg {
  width: 13px !important;
  height: 13px !important;
}

body.cl-dashboard-redesign-page .cl-source-external-guide-modal .guide-top .guide-menu ul li.active,
body.cl-dashboard-redesign-page .cl-source-external-guide-modal .guide-top .guide-menu ul li.active p {
  color: #03C75A !important;
}

body.cl-dashboard-redesign-page .cl-source-external-guide-modal .guide-wrap .step {
  width: 900px !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-v2-modal.cl-source-external-guide-modal .guide-wrap .step h3 {
  font-size: 18px !important;
}

body.cl-dashboard-redesign-page .cl-source-external-guide-modal .guide-wrap .step > [id^="step"] > h3::before {
  font-size: 11.5px !important;
  line-height: normal !important;
}

body.cl-dashboard-redesign-page .cl-source-external-naver-guide-modal .kg-stepline,
body.cl-dashboard-redesign-page .cl-source-external-kakao-guide-modal .kg-stepline {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: 22px 0 10px;
  color: var(--cl-text, #222428);
  font-size: 13px;
  font-weight: 700;
}

body.cl-dashboard-redesign-page .cl-source-external-naver-guide-modal .kg-stepline > span,
body.cl-dashboard-redesign-page .cl-source-external-kakao-guide-modal .kg-stepline > span {
  flex: 1 1 auto;
  min-width: 0;
  font-weight: 700;
  text-align: left;
}

body.cl-dashboard-redesign-page .cl-source-external-naver-guide-modal .kg-stepline b,
body.cl-dashboard-redesign-page .cl-source-external-kakao-guide-modal .kg-stepline b {
  font-weight: 700;
}

body.cl-dashboard-redesign-page .cl-source-external-naver-guide-modal .kg-stepline em,
body.cl-dashboard-redesign-page .cl-source-external-kakao-guide-modal .kg-stepline em {
  flex: 0 0 auto;
  padding: 3px 7px;
  border-radius: 5px;
  background: #5B626C;
  color: #fff;
  font-size: 11px;
  font-style: normal;
  font-weight: 800;
  letter-spacing: 0;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page .cl-source-external-naver-guide-modal .kg-stepline a.kg-lk,
body.cl-dashboard-redesign-page .cl-source-external-kakao-guide-modal .kg-stepline a.kg-lk {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  color: #2F6BFF;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
  transition: color .12s;
}

body.cl-dashboard-redesign-page .cl-source-external-naver-guide-modal .kg-shot,
body.cl-dashboard-redesign-page .cl-source-external-kakao-guide-modal .kg-shot {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: center;
  gap: 20px;
  margin-bottom: 8px;
  padding: 22px;
  border: 1px solid #E7E9ED;
  border-radius: 12px;
  background: #F2F4F6;
}

body.cl-dashboard-redesign-page .cl-source-external-naver-guide-modal .nvg-img,
body.cl-dashboard-redesign-page .cl-source-external-kakao-guide-modal .nvg-img {
  width: 420px;
  max-width: 100%;
  height: auto;
  display: block;
  border-radius: 6px;
  box-shadow: 0 2px 12px rgba(20, 24, 32, .14);
  background: #fff;
}

body.cl-dashboard-redesign-page .cl-source-external-naver-guide-modal .guide-wrap .step > section.kg-sec,
body.cl-dashboard-redesign-page .cl-source-external-kakao-guide-modal .guide-wrap .step > section.kg-sec {
  padding-top: 26px !important;
  padding-bottom: 34px !important;
  border-top: 1px solid #F1F3F5;
}

body.cl-dashboard-redesign-page .cl-source-external-naver-guide-modal .guide-wrap .step > section.kg-sec:first-child,
body.cl-dashboard-redesign-page .cl-source-external-kakao-guide-modal .guide-wrap .step > section.kg-sec:first-child {
  padding-top: 6px !important;
  border-top: 0;
}

body.cl-dashboard-redesign-page .cl-source-external-naver-guide-modal .kg-sec h4,
body.cl-dashboard-redesign-page .cl-source-external-kakao-guide-modal .kg-sec h4 {
  display: flex;
  align-items: center;
  margin: 0 0 10px;
  color: var(--text-primary, #222428);
  font-size: 18px;
  font-weight: 800;
}

body.cl-dashboard-redesign-page .cl-source-external-naver-guide-modal .kg-sec-no,
body.cl-dashboard-redesign-page .cl-source-external-kakao-guide-modal .kg-sec-no {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  margin-right: 8px;
  border-radius: 50%;
  background: var(--brand-blue, #03C75A);
  color: #fff;
  font-size: 11.5px;
  font-weight: 800;
}

body.cl-dashboard-redesign-page .cl-source-external-naver-guide-modal .kg-ul,
body.cl-dashboard-redesign-page .cl-source-external-kakao-guide-modal .kg-ul {
  list-style: none;
  margin: 0 0 20px;
  padding: 0;
  text-align: left !important;
}

body.cl-dashboard-redesign-page .cl-source-external-naver-guide-modal .kg-ul li,
body.cl-dashboard-redesign-page .cl-source-external-kakao-guide-modal .kg-ul li {
  margin: 0 0 6px;
  padding-left: 11px;
  color: var(--text-secondary, #8A8F98);
  font-size: 12.5px;
  line-height: 1.85;
  text-align: left !important;
  text-indent: -11px;
}

body.cl-dashboard-redesign-page .cl-source-external-naver-guide-modal .kg-ul li {
  word-break: normal;
  overflow-wrap: anywhere;
}

body.cl-dashboard-redesign-page .cl-source-external-naver-guide-modal .kg-ul li:last-child,
body.cl-dashboard-redesign-page .cl-source-external-kakao-guide-modal .kg-ul li:last-child {
  margin-bottom: 0;
}

body.cl-dashboard-redesign-page .cl-source-external-guide-modal .cl-source-social-guide-shot > img {
  width: 540px !important;
}

@media (max-width: 1180px) {
  body.cl-dashboard-redesign-page .cl-source-external-guide-modal .cl-source-external-guide-head {
    height: 54px !important;
    padding: 9px 58px 9px 18px !important;
    gap: 8px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-external-guide-modal .guide-top .cl-source-external-guide-head .modal-title.guidetitle {
    margin: 0 !important;
    line-height: 1.35 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-external-guide-modal .cl-source-external-guide-head .cl-source-social-guide-summary {
    display: none !important;
  }
}

@media (max-width: 760px) {
  body.cl-dashboard-redesign-page .cl-source-external-guide-modal .cl-source-external-guide-head {
    height: 50px !important;
    padding: 8px 52px 8px 14px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-external-guide-modal .guide-top .guide-menu ul li {
    flex-basis: 108px !important;
    width: 108px !important;
    height: 56px !important;
    padding: 0 6px !important;
    font-size: 11px !important;
    line-height: 1.4 !important;
  }
}

body.cl-dashboard-redesign-page .cl-source-social-guide-v2-modal .guide-menu ul,
body.cl-dashboard-redesign-page .cl-source-naverpay-guide-modal .guide-menu ul,
body.cl-dashboard-redesign-page .cl-source-social-guide-compact-steps .guide-menu ul {
  gap: 30px !important;
  min-height: 104px !important;
  padding: 16px 24px !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-v2-modal .guide-menu ul li,
body.cl-dashboard-redesign-page .cl-source-naverpay-guide-modal .guide-menu ul li,
body.cl-dashboard-redesign-page .cl-source-social-guide-compact-steps .guide-menu ul li {
  flex: 0 0 150px !important;
  width: 150px !important;
  height: 70px !important;
  padding: 3px 8px 0 !important;
  border-radius: 14px !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-v2-modal .guide-menu ul li::after,
body.cl-dashboard-redesign-page .cl-source-social-guide-v2-modal .guide-menu ul li.active::after,
body.cl-dashboard-redesign-page .cl-source-naverpay-guide-modal .guide-menu ul li::after,
body.cl-dashboard-redesign-page .cl-source-naverpay-guide-modal .guide-menu ul li.active::after,
body.cl-dashboard-redesign-page .cl-source-social-guide-compact-steps .guide-menu ul li::after,
body.cl-dashboard-redesign-page .cl-source-social-guide-compact-steps .guide-menu ul li.active::after {
  content: "" !important;
  position: absolute !important;
  top: 50% !important;
  right: -19px !important;
  bottom: auto !important;
  left: auto !important;
  display: block !important;
  width: 7px !important;
  height: 7px !important;
  border-top: 2px solid var(--cl-green) !important;
  border-right: 2px solid var(--cl-green) !important;
  background: transparent !important;
  transform: translateY(-50%) rotate(45deg) !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-v2-modal .guide-menu ul li:last-child::after,
body.cl-dashboard-redesign-page .cl-source-naverpay-guide-modal .guide-menu ul li:last-child::after,
body.cl-dashboard-redesign-page .cl-source-social-guide-compact-steps .guide-menu ul li:last-child::after {
  display: none !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-v2-modal .guide-menu ul li p,
body.cl-dashboard-redesign-page .cl-source-social-guide-v2-modal .guide-menu ul li.active p,
body.cl-dashboard-redesign-page .cl-source-social-guide-compact-steps .guide-menu ul li p,
body.cl-dashboard-redesign-page .cl-source-social-guide-compact-steps .guide-menu ul li.active p {
  font-size: 13px !important;
  line-height: 1.5 !important;
}

body.cl-dashboard-redesign-page :is(.cl-source-social-guide-kakao-modal, .cl-source-kakaosync-guide-modal) .guide-wrap .step > [id^="step"] {
  max-width: 764px !important;
}

body.cl-dashboard-redesign-page .cl-source-kakaosync-guide-modal .devide-line {
  width: min(764px, 100%) !important;
}

@media (max-width: 640px) {
  body.cl-dashboard-redesign-page .cl-source-external-naver-guide-modal .kg-stepline,
  body.cl-dashboard-redesign-page .cl-source-external-kakao-guide-modal .kg-stepline {
    align-items: flex-start;
  }

  body.cl-dashboard-redesign-page .cl-source-social-guide-v2-modal .guide-menu ul,
  body.cl-dashboard-redesign-page .cl-source-naverpay-guide-modal .guide-menu ul,
  body.cl-dashboard-redesign-page .cl-source-social-guide-compact-steps .guide-menu ul {
    justify-content: center !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-social-guide-v2-modal .guide-menu ul li,
  body.cl-dashboard-redesign-page .cl-source-naverpay-guide-modal .guide-menu ul li,
  body.cl-dashboard-redesign-page .cl-source-social-guide-compact-steps .guide-menu ul li {
    flex: 0 1 150px !important;
    width: 150px !important;
    min-width: 0 !important;
  }
}

body.cl-dashboard-redesign-page .cl-source-social-guide-v2-modal .guide-wrap .step {
  box-sizing: border-box !important;
  width: 820px !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: 34px 28px 90px !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-v2-modal .guide-wrap .step > [id^="step"] {
  display: flow-root !important;
  width: 100% !important;
  max-width: none !important;
  padding: 0 0 34px !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-v2-modal .guide-wrap .step > [id^="step"] + [id^="step"] {
  padding-top: 26px !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-v2-modal .guide-wrap .step h3 {
  clear: both !important;
  float: none !important;
  margin-bottom: 10px !important;
  font-size: 20px !important;
  font-weight: 800 !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guide-wrap .step .cl-source-social-guide-shot {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
  width: 100% !important;
  margin: 0 0 8px !important;
  padding: 20px !important;
  background: #f2f4f6 !important;
  border: 1px solid #e7e9ed !important;
  border-radius: 14px !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guide-wrap .step .cl-source-social-guide-shot > img {
  display: block !important;
  max-width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 6px !important;
  background: #fff !important;
  box-shadow: 0 2px 12px rgba(20, 24, 32, .14) !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-naver-modal .cl-source-social-guide-shot > img {
  width: 420px !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-google-modal .cl-source-social-guide-shot > img {
  width: 540px !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-v2-modal .cl-source-social-guide-shot + p,
body.cl-dashboard-redesign-page .cl-source-social-guide-v2-modal .cl-source-social-guide-shot + .socialLoginSmallStep {
  margin: 10px 0 28px !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-v2-modal .guide-wrap .step p,
body.cl-dashboard-redesign-page .cl-source-social-guide-v2-modal .guide-wrap .step #step2 p {
  float: none !important;
  width: auto !important;
  color: var(--cl-text-muted) !important;
  font-size: 13.5px !important;
  line-height: 1.85 !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-v2-modal .guide-wrap .step p b,
body.cl-dashboard-redesign-page .cl-source-social-guide-v2-modal .guide-wrap .step p .guide_bold {
  color: var(--cl-text) !important;
  font-weight: 700 !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-v2-modal .socialLoginSmallStep {
  margin: 0 0 20px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  font-size: 13px !important;
  line-height: 1.85 !important;
  list-style: none !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-v2-modal .socialLoginSmallStep li {
  display: flex !important;
  float: none !important;
  align-items: flex-start !important;
  gap: 3px !important;
  margin: 0 0 6px !important;
  padding: 0 !important;
  color: var(--cl-text-muted) !important;
  line-height: 1.85 !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-v2-modal .socialLoginSmallStep .guide_important {
  flex: none !important;
  color: var(--cl-text-muted) !important;
}

body.cl-dashboard-redesign-page .cl-source-social-guide-v2-modal .socialLoginSmallStep .guidelistBox {
  min-width: 0 !important;
  color: inherit !important;
}

@media (max-width: 1180px) {
  body.cl-dashboard-redesign-page .cl-source-social-guide-v2-modal .cl-source-social-guide-summary,
  .cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .smtp-guide-summary {
    display: none !important;
  }

  body.cl-dashboard-redesign-page .cl-source-social-guide-v2-modal .guide-top,
  .cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .guide-top {
    grid-template-columns: 1fr !important;
  }

  body.cl-dashboard-redesign-page .cl-source-social-guide-v2-modal .guide-top .guidetitle,
  .cl-dashboard-redesign.cl-source-smtp-guide-wrap .member-smtp-guide-modal .guide-top h3.modal-title {
    margin-left: 18px !important;
    font-size: 15px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-social-guide-v2-modal .guide-top .guide-menu {
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scrollbar-width: none !important;
  }

  body.cl-dashboard-redesign-page .cl-source-social-guide-v2-modal .guide-top .guide-menu::-webkit-scrollbar {
    display: none !important;
  }

  body.cl-dashboard-redesign-page .cl-source-social-guide-v2-modal .guide-menu ul {
    justify-content: center !important;
    width: 100% !important;
    min-width: 0 !important;
  }
}

@media (max-width: 760px) {
  body.cl-dashboard-redesign-page .cl-source-social-guide-v2-modal {
    align-items: stretch !important;
    padding: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-social-guide-v2-modal > .modal-dialog {
    width: 100vw !important;
    height: 100vh !important;
  }

  body.cl-dashboard-redesign-page .cl-source-social-guide-v2-modal .modal-dialog > .modal-content {
    border-radius: 0 !important;
  }
}

@media (max-width: 640px) {
  body.cl-dashboard-redesign-page .cl-source-social-guide-v2-modal .guide-menu ul,
  body.cl-dashboard-redesign-page .cl-source-naverpay-guide-modal .guide-menu ul {
    gap: 16px !important;
    padding: 11px 12px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-social-guide-v2-modal .guide-menu ul li,
  body.cl-dashboard-redesign-page .cl-source-naverpay-guide-modal .guide-menu ul li {
    flex-basis: 104px !important;
    width: 104px !important;
    height: 54px !important;
    padding: 2px 6px 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-social-guide-v2-modal .guide-menu ul li::after,
  body.cl-dashboard-redesign-page .cl-source-social-guide-v2-modal .guide-menu ul li.active::after,
  body.cl-dashboard-redesign-page .cl-source-naverpay-guide-modal .guide-menu ul li::after,
  body.cl-dashboard-redesign-page .cl-source-naverpay-guide-modal .guide-menu ul li.active::after {
    right: -12px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-social-guide-v2-modal .guide-menu ul li p,
  body.cl-dashboard-redesign-page .cl-source-social-guide-v2-modal .guide-menu ul li.active p {
    font-size: 12px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-social-guide-v2-modal .guide-wrap .step {
    width: 100% !important;
    padding: 20px 14px 64px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-social-guide-modal .guide-wrap .step .cl-source-social-guide-shot {
    padding: 12px !important;
  }
}

/* 모바일 요금제 및 결제 관리 */
@media (max-width: 767px) {
  body.cl-dashboard-redesign-page .sub.sub-page.cl-source-plan-page {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 20px 14px 40px !important;
    overflow-x: hidden !important;
  }

  body.cl-dashboard-redesign-page .cl-source-plan-page .breadcrumb {
    margin-bottom: 18px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-plan-page .cl-source-plan-root,
  body.cl-dashboard-redesign-page .cl-source-plan-page .cl-source-plan-current {
    font-size: 18px !important;
    line-height: 26px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-plan-page .cl-source-plan-sep {
    margin: 0 6px !important;
    font-size: 19px !important;
    line-height: 26px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-plan-page .breadcrumb p {
    margin-top: 8px !important;
    font-size: 13px !important;
    line-height: 20px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-plan-page .plan-tab-wrap,
  body.cl-dashboard-redesign-page .cl-source-billing-history-page .plan-tab-wrap {
    width: 100% !important;
    height: 48px !important;
    margin-top: 0 !important;
    padding: 0 4px !important;
    overflow: hidden !important;
    border-radius: 10px 10px 0 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-plan-page .plan-tab {
    flex-wrap: nowrap !important;
    gap: 0 !important;
    width: 100% !important;
  }

  body.cl-dashboard-redesign-page .cl-source-plan-page .plan-tab > li {
    flex: 1 1 0 !important;
    font-size: 13px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-plan-page .plan-tab > li > a {
    width: 100% !important;
    min-height: 44px !important;
    padding: 0 4px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-plan-page .plan-mng-box,
  body.cl-dashboard-redesign-page .cl-source-plan-page .content-box,
  body.cl-dashboard-redesign-page .cl-source-billing-history-page .content-box {
    width: 100% !important;
    padding: 18px 16px 22px !important;
    border-radius: 0 0 10px 10px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-plan-page .content-title {
    margin-bottom: 12px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-plan-page .plan-list > li {
    margin-bottom: 14px !important;
    padding: 14px !important;
    border-radius: 10px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    align-items: stretch !important;
    gap: 14px !important;
    min-height: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.shot {
    width: 100% !important;
    height: auto !important;
    max-height: 164px !important;
    aspect-ratio: 16 / 9 !important;
    border-radius: 8px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info,
  body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info.is-free-plan {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto auto !important;
    align-items: center !important;
    column-gap: 8px !important;
    width: 100% !important;
    min-height: 0 !important;
    padding: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info > .summry,
  body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info.is-free-plan > .summry {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 28px !important;
    margin-bottom: 6px !important;
    padding-right: 52px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info > .description,
  body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info > .description p {
    overflow-wrap: anywhere !important;
  }

  body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info > .description {
    grid-column: 1 / -1 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info .payment-auto {
    min-height: 44px !important;
    margin-top: 4px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info > .plan-btn-box {
    position: static !important;
    grid-column: 2 !important;
    grid-row: 3 !important;
    align-self: center !important;
    justify-self: end !important;
    display: inline-flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 8px !important;
    width: max-content !important;
    max-width: 100% !important;
    min-width: 96px !important;
    margin: 12px 0 0 auto !important;
    transform: none !important;
  }

  body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info > .plan-btn-box .plan-btn {
    flex: 0 0 auto !important;
    min-width: 96px !important;
    height: 34px !important;
    padding: 0 16px !important;
    border-radius: 20px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-plan-page .plan-site > li.info > .plan-more {
    position: relative !important;
    grid-column: 3 !important;
    grid-row: 3 !important;
    align-self: center !important;
    justify-self: end !important;
    top: auto !important;
    right: auto !important;
    width: 44px !important;
    height: 44px !important;
    margin-top: 12px !important;
    opacity: 1 !important;
    transform: none !important;
  }

  body.cl-dashboard-redesign-page .cl-source-plan-page .plan-more .plan-more-box {
    right: 0 !important;
    width: min(210px, calc(100vw - 76px)) !important;
  }

  body.cl-dashboard-redesign-page .cl-source-plan-page .plan-more .plan-more-box li {
    min-height: 44px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-plan-page .remain-list-box li {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: start !important;
    column-gap: 12px !important;
    row-gap: 8px !important;
    padding: 16px !important;
    border-left-color: var(--cl-border) !important;
  }

  body.cl-dashboard-redesign-page .cl-source-plan-page .remain-list-box .plan-name {
    grid-column: 1 !important;
    grid-row: 1 !important;
    align-self: center !important;
    flex-basis: auto !important;
    width: 100% !important;
    margin: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-plan-page .remain-list-box .plan-date {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    flex-basis: auto !important;
    width: 100% !important;
  }

  body.cl-dashboard-redesign-page .cl-source-plan-page .remain-list-box .remain-list .plan-conn {
    position: static !important;
    grid-column: 2 !important;
    grid-row: 1 !important;
    align-self: center !important;
    justify-self: end !important;
    flex: 0 0 auto !important;
    width: max-content !important;
    min-width: 96px !important;
    height: 34px !important;
    margin: 0 !important;
    padding: 0 16px !important;
    border-radius: 20px !important;
    transform: none !important;
  }

  body.cl-dashboard-redesign-page .cl-source-billing-history-page #site-select {
    display: block !important;
    width: 100% !important;
    margin-bottom: 16px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-billing-history-page #site-select .cl-redesign-select-trigger {
    width: 100% !important;
    min-height: 44px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-billing-history-page #site-select .cl-redesign-select-menu {
    width: 100% !important;
    max-width: 100% !important;
  }

  body.cl-dashboard-redesign-page .cl-source-billing-history-page #site-select .cl-redesign-select-menu li {
    min-height: 44px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-billing-history-page .billing-list {
    width: 100% !important;
    max-width: 100% !important;
    overflow: visible !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }

  body.cl-dashboard-redesign-page .cl-source-billing-history-page .billing-list table,
  body.cl-dashboard-redesign-page .cl-source-billing-history-page .billing-list tbody {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-billing-history-page .billing-list colgroup,
  body.cl-dashboard-redesign-page .cl-source-billing-history-page .billing-list thead {
    display: none !important;
  }

  body.cl-dashboard-redesign-page .cl-source-billing-history-page .billing-list tbody {
    display: grid !important;
    gap: 12px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-billing-history-page .billing-list tbody tr:not(.empty-data) {
    display: block !important;
    width: 100% !important;
    overflow: hidden !important;
    background: #fff !important;
    border: 1px solid var(--cl-border) !important;
    border-radius: 10px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-billing-history-page .billing-list tbody tr:not(.empty-data) > td {
    display: grid !important;
    grid-template-columns: 88px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 12px !important;
    width: 100% !important;
    min-height: 44px !important;
    height: auto !important;
    padding: 10px 12px !important;
    overflow: visible !important;
    border: 0 !important;
    border-bottom: 1px solid var(--cl-line) !important;
    color: var(--cl-text) !important;
    font-size: 13px !important;
    line-height: 20px !important;
    text-align: right !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }

  body.cl-dashboard-redesign-page .cl-source-billing-history-page .billing-list tbody tr:not(.empty-data) > td:first-child {
    background: var(--cl-bg-subtle) !important;
    font-weight: 400 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-billing-history-page .billing-list tbody tr:not(.empty-data) > td:last-child {
    border-bottom: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-billing-history-page .billing-list tbody tr:not(.empty-data) > td::before {
    content: attr(data-label) !important;
    color: var(--cl-text-sub) !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 18px !important;
    text-align: left !important;
  }

  body.cl-dashboard-redesign-page .cl-source-billing-history-page .billing-list .empty-data {
    display: block !important;
    width: 100% !important;
  }

  body.cl-dashboard-redesign-page .cl-source-billing-history-page .billing-list .empty-data td {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-height: 180px !important;
    padding: 24px !important;
    background: var(--cl-bg-subtle) !important;
    border: 1px solid var(--cl-border) !important;
    border-radius: 10px !important;
    white-space: normal !important;
  }

  body.cl-dashboard-redesign-page .cl-source-plan-page .billing-paging {
    margin-top: 18px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-plan-page .billing-paging .paging {
    flex-wrap: wrap !important;
  }

  body.cl-dashboard-redesign-page .cl-source-plan-page .billing-paging :is(a, span, strong) {
    min-width: 36px !important;
    height: 36px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-card-page .bill-card-head {
    gap: 12px !important;
    margin-bottom: 12px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-card-page .bill-card-cnt {
    min-width: 0 !important;
    font-size: 14px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-card-page .bill-card-add {
    flex: 0 0 auto !important;
    min-height: 44px !important;
    padding: 0 12px !important;
    border: 1px solid var(--cl-border) !important;
    border-radius: 8px !important;
    background: #fff !important;
  }

  body.cl-dashboard-redesign-page .cl-source-card-page .card_list.empty_content,
  body.cl-dashboard-redesign-page .cl-source-card-page .card_list.empty_content .card_content {
    min-height: 200px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-card-page .card_list:not(.empty_content) .card_item {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 14px !important;
    min-height: 0 !important;
    padding: 14px 10px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_head {
    grid-column: 1 !important;
    grid-row: 1 !important;
    gap: 14px !important;
    width: 100% !important;
  }

  body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_info {
    grid-column: 1 !important;
    grid-row: 2 !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-rows: auto auto auto !important;
    gap: 8px 12px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_number {
    grid-column: 1 / -1 !important;
    grid-row: 1 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_exp {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    justify-self: start !important;
  }

  body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_actions {
    grid-column: 1 / -1 !important;
    grid-row: 3 !important;
    justify-self: end !important;
    width: auto !important;
    height: 44px !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }

  body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_item:not(.disabled):not(.is-disabled):not([aria-disabled="true"]) .card_actions {
    opacity: 1 !important;
    pointer-events: auto !important;
  }

  body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_item .card_actions .cl-dashboard-button-box[data-func],
  body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_item .card_actions .cl-dashboard-button,
  body.cl-dashboard-redesign-page .cl-source-card-page .card_list .card_actions .card-move-top-button {
    flex-basis: 44px !important;
    width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;
    border-radius: 8px !important;
  }

}

@media (max-width: 417px) {
  body.cl-dashboard-redesign-page .cl-source-plan-page .billing-paging {
    width: 100% !important;
    min-width: 0 !important;
  }

  body.cl-dashboard-redesign-page .cl-source-plan-page .billing-paging .paging {
    flex-wrap: nowrap !important;
    justify-content: center !important;
    gap: 2px !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  body.cl-dashboard-redesign-page .cl-source-plan-page .billing-paging .paging > :is(a, span, strong) {
    flex: 1 1 0 !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: 36px !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
  }
}

@media (max-width: 480px) {
  body.cl-source-card-add-modal-open #billingCardModalRoot .card-add-modal-default .modal-content {
    padding: 28px 20px 24px !important;
  }

  body.cl-source-card-add-modal-open #billingCardModalRoot .source-card-add-form .ca-cardnum {
    gap: 4px !important;
  }

  body.cl-source-card-add-modal-open #billingCardModalRoot .source-card-add-form .ca-cardnum input {
    padding-right: 2px !important;
    padding-left: 2px !important;
  }

  body.cl-source-card-add-modal-open #billingCardModalRoot .source-card-add-form .ca-two {
    gap: 10px !important;
  }
}

@media (max-width: 380px) {
  body.cl-dashboard-redesign-page .cl-source-plan-page .plan-tab > li {
    font-size: 12px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-plan-page .plan-mng-box,
  body.cl-dashboard-redesign-page .cl-source-plan-page .content-box,
  body.cl-dashboard-redesign-page .cl-source-billing-history-page .content-box {
    padding-right: 12px !important;
    padding-left: 12px !important;
  }

  body.cl-dashboard-redesign-page .cl-source-billing-history-page .billing-list tbody tr:not(.empty-data) > td {
    grid-template-columns: 76px minmax(0, 1fr) !important;
    gap: 8px !important;
  }

}

/* 모바일 기본설정: 프로필 이미지와 다음 항목 구분선 간격 */
@media (max-width: 768px) {
  body.cl-dashboard-redesign-page #cl-basic-settings-page .setting-bsInfo .setting-sub-content > ul > li.detail-site-pofile {
    min-height: 104px !important;
    padding-bottom: 18px !important;
  }

  body.cl-dashboard-redesign-page #cl-basic-settings-page .detail-site-pofile > .icon-pen,
  body.cl-dashboard-redesign-page #cl-basic-settings-page .detail-site-pofile .profile-content {
    min-height: 44px !important;
  }

  body.cl-dashboard-redesign-page #cl-basic-settings-page .detail-site-pofile .profile-content {
    align-items: center !important;
  }

  body.cl-dashboard-redesign-page #cl-basic-settings-page .detail-site-pofile .profile-content > label {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
}

/* 모바일 회원 리스트: 요약·검색·필터를 각 행에 안정적으로 배치한다. */
@media (max-width: 767px) {
  body.cl-dashboard-redesign-page #cl-member-list-page .cl-source-member-toolbar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    justify-content: stretch !important;
    gap: 12px 8px;
    width: 100%;
  }

  body.cl-dashboard-redesign-page #cl-member-list-page .cl-source-member-toolbar::before {
    display: none;
    content: none;
  }

  body.cl-dashboard-redesign-page #cl-member-list-page .cl-source-member-toolbar > .mng-title {
    grid-column: 1;
    grid-row: 1;
    width: auto;
    min-width: 0;
    margin: 0;
  }

  body.cl-dashboard-redesign-page #cl-member-list-page .cl-source-member-toolbar > .shopgrade-setting-btn {
    grid-column: 2;
    grid-row: 1;
    justify-self: end;
    margin: 0;
  }

  body.cl-dashboard-redesign-page #cl-member-list-page .cl-source-member-toolbar > .mng-search-box {
    grid-column: 1 / -1;
    grid-row: 2;
    width: 100%;
    max-width: none;
    margin: 0 !important;
  }

  body.cl-dashboard-redesign-page #cl-member-list-page .cl-source-member-toolbar > .mng-subMenu-list {
    grid-column: 1 / -1;
    grid-row: 3;
    display: grid;
    grid-template-columns: minmax(0, 92px) minmax(0, 92px) 104px;
    gap: 8px;
    width: 100%;
    max-width: none;
    margin: 0 !important;
  }

  body.cl-dashboard-redesign-page #cl-member-list-page .mng-selectboxlist {
    display: contents;
  }

  body.cl-dashboard-redesign-page #cl-member-list-page .mng-selectboxlist > .input-group-btn {
    width: 100%;
    min-width: 0;
  }

  body.cl-dashboard-redesign-page :is(#cl-member-list-page, #cl-member-leavelist-page) .mng-selectboxlist :is(select, .bootstrap-select.cl-member-toolbar-select),
  body.cl-dashboard-redesign-page :is(#cl-member-list-page, #cl-member-leavelist-page) .mng-selectboxlist .bootstrap-select.cl-member-toolbar-select > .dropdown-toggle {
    width: 100% !important;
    min-width: 0;
  }

  body.cl-dashboard-redesign-page #cl-member-list-page .mng-sortWrap {
    grid-column: 3;
    grid-row: 1;
    width: 104px;
    min-width: 104px;
    max-width: 104px;
    margin: 0;
  }

  body.cl-dashboard-redesign-page #cl-member-list-page .mng-shopgradeWrap {
    grid-column: 1 / -1;
    grid-row: 2;
    justify-self: start;
    width: 126px;
    min-width: 126px;
    max-width: 126px;
    margin: 0;
  }

  body.cl-dashboard-redesign-page #cl-member-list-page .cl-source-member-toolbar > .table-wrap {
    grid-column: 1 / -1;
    width: 100%;
  }
}

/* 리디자인 공통 안내 팝업: 호출 위치와 기존 팝업 종류에 관계없이 같은 글자 위계를 사용한다. */
body.cl-dashboard-redesign-page .flat-modal.cl-source-information-modal-wrap:not(.cl-source-external-guide-root) .modal-default .modal-dialog.cl-source-information-modal .modal-title {
  font-size: 20px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-source-information-modal-wrap .modal-default .modal-dialog.cl-source-information-modal .modal-body,
body.cl-dashboard-redesign-page .flat-modal.cl-source-information-modal-wrap .modal-default .modal-dialog.cl-source-information-modal .modal-body > :not(.modal-title) {
  font-size: 13.5px !important;
}

/* 상품 상세페이지에서 열리는 팝업은 호출부의 기존 폭·글자값과 관계없이 공통 규격을 따른다. */
body.cl-dashboard-redesign-page.cl-source-product-detail-frame .flat-modal.cl-source-product-workflow-wrap:not(.cl-source-product-price-modal-wrap) .modal-dialog.cl-source-product-workflow-modal {
  width: 100% !important;
  max-width: 440px !important;
}

body.cl-dashboard-redesign-page.cl-source-product-detail-frame .flat-modal.cl-source-information-modal-wrap:not(.cl-source-product-workflow-wrap) .modal-dialog.cl-source-information-modal {
  width: calc(100% - 32px) !important;
  max-width: 440px !important;
  margin-right: auto !important;
  margin-left: auto !important;
}

body.cl-dashboard-redesign-page.cl-source-product-detail-frame .flat-modal .modal-dialog:is(.cl-source-product-workflow-modal, .cl-source-information-modal) .modal-title {
  font-size: 20px !important;
}

body.cl-dashboard-redesign-page.cl-source-product-detail-frame .flat-modal .modal-dialog:is(.cl-source-product-workflow-modal, .cl-source-information-modal) .modal-body,
body.cl-dashboard-redesign-page.cl-source-product-detail-frame .flat-modal .modal-dialog:is(.cl-source-product-workflow-modal, .cl-source-information-modal) .modal-body > :not(.modal-title) {
  font-size: 13.5px !important;
}

/* 모바일 회원 목록: 일괄 작업과 페이지 이동을 카드 하단에 순서대로 배치한다. */
@media (max-width: 600px) {
  body.cl-dashboard-redesign-page #cl-member-list-page .mng-settings.memberlist {
    padding-bottom: 50px;
  }

  body.cl-dashboard-redesign-page #cl-member-list-page .btn-wrap.widthfl {
    clear: both;
    float: none;
    display: flex;
    flex-wrap: wrap;
    grid-column: 1 / -1;
    width: 100%;
    margin-top: 16px;
  }

  body.cl-dashboard-redesign-page #cl-member-list-page .cl-source-member-actions {
    flex: 0 0 100%;
    width: 100%;
  }

  body.cl-dashboard-redesign-page #cl-member-list-page .mng-bottom-btn-wrap {
    flex: 0 0 100%;
    width: 100%;
    margin-left: 0;
  }

  body.cl-dashboard-redesign-page #cl-member-list-page nav.text-center.widthfl {
    clear: both;
    float: none;
    grid-column: 1 / -1;
    width: 100%;
    margin-top: 9px;
    overflow: hidden;
  }

  body.cl-dashboard-redesign-page #cl-member-list-page .mng-list-pagination {
    max-width: 100%;
  }

  body.cl-dashboard-redesign-page #cl-member-list-page .mng-list-pagination > .cl-member-page-number {
    display: none;
  }

  body.cl-dashboard-redesign-page #cl-member-list-page .mng-list-pagination > :is(.cl-member-page-number.active, .cl-member-page-number.cl-mobile-page-visible) {
    display: inline-flex;
  }
}

/* ===== 요금제 및 결제관리 > 요금제 연장 결제 ===== */
body.cl-dashboard-plan-payment-page,
body.cl-dashboard-plan-payment-page .cl-source-plan-buy,
body.cl-dashboard-plan-payment-page .cl-source-plan-buy * {
  box-sizing: border-box;
}

body.cl-dashboard-plan-payment-page {
  min-width: 0;
  background: var(--cl-page-bg);
  color: var(--cl-text);
  font-family: var(--cl-source-font) !important;
  letter-spacing: 0;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy {
  width: 100%;
  min-height: calc(100vh - 56px);
  margin: 0;
  padding: 0;
  background: var(--cl-page-bg);
  color: var(--cl-text);
  font-family: var(--cl-source-font) !important;
  text-align: left;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-wrap {
  width: 100%;
  max-width: 1000px;
  margin: 0 auto;
  padding: 56px 40px 80px;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-head {
  margin: 0 0 34px;
  text-align: center;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-head h1 {
  margin: 0;
  color: var(--cl-text);
  font: 800 24px/1.4 var(--cl-source-font);
  letter-spacing: -.3px;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-steps {
  display: flex;
  width: 100%;
  max-width: 480px;
  margin: 0 auto 28px;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-step {
  position: relative;
  display: flex;
  flex: 1 1 0;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  min-width: 0;
  color: var(--cl-text-muted);
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-step:not(:last-child)::after {
  position: absolute;
  top: 20px;
  left: calc(50% + 21px);
  width: calc(100% - 42px);
  height: 2px;
  background: #e1e4e8;
  content: "";
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-step.done:not(:last-child)::after,
body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-step.active:not(:last-child)::after {
  background: var(--cl-green-action);
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-step-dot {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border: 2px solid #d9dde3;
  border-radius: 999px;
  background: var(--cl-surface);
  color: var(--cl-text-muted);
  font: 600 13px/1 var(--cl-source-font);
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-step.done .plan-buy-step-dot {
  border-color: var(--cl-green-action);
  background: var(--cl-green-action);
  color: #fff;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-step.active .plan-buy-step-dot {
  border-color: var(--cl-green-action);
  color: var(--cl-green-text);
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-step-dot svg {
  display: block;
  width: 20px;
  height: 20px;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-step-name {
  color: inherit;
  font: 500 13.5px/1 var(--cl-source-font);
  white-space: nowrap;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-step.done,
body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-step.active {
  color: var(--cl-green-text);
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-step.active .plan-buy-step-name {
  font-weight: 700;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-back {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin: 0 0 14px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--cl-text-sub);
  font: 400 13px/1.4 var(--cl-source-font);
  text-decoration: none;
  transition: color var(--cl-motion-fast);
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-back:hover,
body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-back:focus {
  color: var(--cl-green-text);
  text-decoration: none;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-back svg {
  display: block;
  width: 15px;
  height: 15px;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-columns {
  display: flex;
  align-items: flex-start;
  gap: 24px;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-main {
  flex: 1 1 0;
  min-width: 0;
  padding: 34px 36px 32px;
  border: 1px solid var(--cl-border);
  border-radius: var(--cl-radius-lg);
  background: var(--cl-surface);
  box-shadow: none;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .sub-content {
  display: block;
  width: 100%;
  margin: 0;
  color: var(--cl-text);
  text-align: left;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .sub-switch {
  display: flex;
  width: 100%;
  max-width: 240px;
  margin: 0 0 26px;
  border: 0;
  border-radius: 0;
  overflow: visible;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .sub-switch > .switch-lang {
  display: block;
  flex: 1 1 50%;
  width: auto;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .sub-switch > .switch-lang > a {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 44px;
  margin-left: -1px;
  border: 1px solid var(--cl-border);
  border-radius: 0;
  background: var(--cl-surface);
  color: var(--cl-text-sub);
  font: 600 14px/1 var(--cl-source-font);
  line-height: 1;
  text-decoration: none;
  transition: background var(--cl-motion-fast), border-color var(--cl-motion-fast), color var(--cl-motion-fast);
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .sub-switch > .switch-lang:first-child > a {
  margin-left: 0;
  border-right: 1px solid var(--cl-border);
  border-radius: 8px 0 0 8px;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .sub-switch > .switch-lang:last-child > a {
  border-radius: 0 8px 8px 0;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .sub-switch > .switch-lang > a.active {
  position: relative;
  z-index: 1;
  border-color: var(--cl-green-action);
  background: var(--cl-green-action);
  color: #fff;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .sub-caption {
  margin: 0 0 9px;
  color: var(--cl-text-sub);
  font: 600 13px/1.4 var(--cl-source-font);
  letter-spacing: 0;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .select-wrap {
  position: relative;
  width: 100%;
  margin: 0 0 26px;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .select-wrap::after {
  pointer-events: none;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .select-wrap > select,
body.cl-dashboard-plan-payment-page .cl-source-plan-buy .select-wrap > select.sites-select,
body.cl-dashboard-plan-payment-page .cl-source-plan-buy .select-wrap > select.sites-select[disabled] {
  width: 100%;
  height: 46px;
  padding: 0 40px 0 15px;
  border: 1px solid var(--cl-border);
  border-radius: 8px;
  background: #f7f8fa;
  color: var(--cl-text-sub);
  font: 400 14px/44px var(--cl-source-font);
  opacity: 1;
  box-shadow: none;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .sub-panel {
  width: 100%;
  margin: 0 0 28px;
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--cl-border);
  border-radius: var(--cl-radius-md);
  background: var(--cl-surface);
  list-style: none;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy:not(.sub-change) .sub-panel > .plan-grid {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  min-height: 62px;
  height: auto;
  padding: 14px 16px;
  border: 0;
  border-top: 1px solid var(--cl-border);
  border-radius: 0;
  background: var(--cl-surface);
  color: var(--cl-text);
  font: 400 14px/1.4 var(--cl-source-font);
  transition: background var(--cl-motion-fast);
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy:not(.sub-change) .sub-panel > .plan-grid:first-child {
  border-top: 0;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy:not(.sub-change) .sub-panel > .plan-grid:hover {
  background: var(--cl-bg-subtle);
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy:not(.sub-change) .sub-panel > .plan-grid:has(.sub-check.active) {
  background: var(--cl-green-soft);
  box-shadow: inset 0 0 0 1px var(--cl-green-line);
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy:not(.sub-change) .plan-grid > div {
  display: block;
  min-width: 0;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-priod {
  flex: 1 1 auto;
  color: var(--cl-text);
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy:not(.sub-change) .plan-grid > div.plan-priod {
  display: flex;
  align-items: center;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-grid:has(.sub-check.active) .plan-priod {
  color: var(--cl-text);
  font-weight: 600;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-priod-discount {
  color: var(--cl-green-text);
  font-style: normal;
  font-weight: 600;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .sub-check {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  margin: 0 8px 0 0;
  padding: 0;
  border-radius: 999px;
  background: #d8dbe0;
  color: #fff;
  vertical-align: -4px;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .sub-check.active {
  background: var(--cl-green-action);
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .sub-check i {
  font-size: 10px;
  line-height: 1;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-per-month {
  flex: 0 0 auto;
  color: var(--cl-text);
  line-height: 1.35;
  white-space: nowrap;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-grid span.plan-price-original {
  display: block;
  margin: 0;
  color: var(--cl-text-muted);
  font: 400 12px/1.35 var(--cl-source-font);
  text-decoration: line-through;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-grid .info-discount {
  display: block;
  color: var(--cl-text);
  font: 400 14px/1.35 var(--cl-source-font);
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-grid:has(.sub-check.active) .info-discount {
  font-weight: 600;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-grid .plan-price-original + .info-discount {
  color: var(--cl-green-text);
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy:not(.sub-change) .plan-grid > div.plan-priod > .event-price,
body.cl-dashboard-plan-payment-page .cl-source-plan-buy:not(.sub-change) .plan-grid > div.plan-priod > p.plan-priod12,
body.cl-dashboard-plan-payment-page .cl-source-plan-buy:not(.sub-change) .plan-grid > div.plan-priod > p.plan-priod24 {
  margin: 4px 0 0 32px;
  padding: 0;
  color: var(--cl-green-text);
  font-size: 12px;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy:not(.sub-change) .plan-grid > div.plan-priod > .event-price > span {
  min-width: 0;
  padding: 2px 7px;
  border-radius: 999px;
  background: var(--cl-green-badge);
  color: var(--cl-green-text);
  font-size: 11px;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .select-wrap.pay-method {
  display: inline-block;
  width: 96px;
  margin: 0 0 12px;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .select-wrap.pay-method::after {
  top: 50%;
  right: 13px;
  width: 6px;
  height: 6px;
  border: solid var(--cl-text-sub);
  border-width: 0 1.25px 1.25px 0;
  background: transparent;
  transform: translateY(-75%) rotate(45deg);
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .select-wrap.pay-method > select {
  height: 34px;
  padding: 0 30px 0 12px;
  border-radius: var(--cl-radius-sm);
  background: var(--cl-surface);
  color: var(--cl-text);
  font-size: 13px;
  line-height: 34px;
  cursor: pointer;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-payment-methods {
  position: relative;
  width: 100%;
  min-width: 0;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-payment-native-select {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  clip-path: inset(50%);
  border: 0;
  white-space: nowrap;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-payment-option {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 20px;
  margin: 12px 0 0;
  padding: 0;
  border: 0;
  border-radius: var(--cl-radius-sm);
  outline: 0;
  background: transparent;
  color: var(--cl-text-muted);
  font: 600 14px/20px var(--cl-source-font);
  text-align: left;
  cursor: pointer;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-payment-option.active {
  color: var(--cl-text);
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-payment-option:focus-visible {
  box-shadow: var(--cl-ring, 0 0 0 3px rgba(3, 199, 90, .13));
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-payment-check {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 19px;
  height: 19px;
  border-radius: 999px;
  background: var(--cl-border-hover);
  color: #fff;
  transition: background var(--cl-motion-fast);
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-payment-option.active .plan-buy-payment-check {
  background: var(--cl-green-action);
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-payment-check svg {
  display: block;
  width: 13px;
  height: 13px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select.plan-inline-card-select {
  width: 252px;
  max-width: 100%;
  min-width: 0;
  margin: 0 auto;
  padding: 12px 0 0;
  border-radius: 0;
  background: transparent;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .select-card-auto-notice {
  margin: 0 0 14px;
  color: var(--cl-text-sub);
  font: 400 12px/1.5 var(--cl-source-font);
  text-align: left;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_list_container {
  position: relative;
  width: 100%;
  max-width: none;
  height: 140px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  overflow: visible;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_list_container::before,
body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_list_container::after {
  content: "";
  position: absolute;
  top: 0;
  z-index: 4;
  width: 24px;
  height: 114px;
  pointer-events: none;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_list_container::before {
  left: 0;
  background: linear-gradient(to right, var(--cl-surface) 0, var(--cl-surface) 8px, rgba(255, 255, 255, 0) 100%);
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_list_container::after {
  right: 0;
  background: linear-gradient(to left, var(--cl-surface) 0, var(--cl-surface) 8px, rgba(255, 255, 255, 0) 100%);
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_viewport {
  position: relative;
  width: 100%;
  height: 114px;
  overflow: visible;
  clip-path: inset(-100vmax 0 -100vmax 0);
  filter: none;
  touch-action: pan-y;
  cursor: grab;
  -webkit-user-select: none;
  user-select: none;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_viewport:active {
  cursor: grabbing;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_ul {
  align-items: center;
  gap: 9px;
  width: 100%;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_wrap,
body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_add_wrap {
  position: relative;
  display: block;
  flex: 0 0 202px;
  width: 202px;
  min-width: 0;
  height: 114px;
  border-radius: 14px;
  opacity: .3;
  transition: opacity var(--cl-motion-fast);
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_wrap.active,
body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_add_wrap.active {
  z-index: 2;
  opacity: 1;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_card,
body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_add_button {
  position: relative;
  width: 100%;
  height: 114px;
  margin: 0;
  padding: 14px 10px;
  overflow: hidden;
  border: 0;
  border-radius: 14px;
  background: #afbac8;
  color: #fff;
  box-shadow: none;
  transform: none;
  transition: box-shadow var(--cl-motion-fast), background var(--cl-motion-fast);
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  display: block;
  border-radius: 14px;
  background-color: transparent;
  background-image:
    repeating-linear-gradient(45deg, rgba(255, 255, 255, 0) 1px, rgba(255, 255, 255, .03) 2px, rgba(255, 255, 255, .04) 3px, rgba(255, 255, 255, .05) 4px),
    repeating-linear-gradient(135deg, rgba(255, 255, 255, .05) 1px, rgba(255, 255, 255, 0) 2px, rgba(255, 255, 255, .04) 3px, rgba(255, 255, 255, .03) 4px),
    linear-gradient(-25deg, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, .2) 70%, rgba(255, 255, 255, 0) 90%);
  pointer-events: none;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_wrap:not(.paycard_add_wrap) .paycard_card::after {
  display: none;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_wrap.jp-card-visa .paycard_card,
body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_wrap.jp-card-visaelectron .paycard_card {
  background-color: #191278;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_wrap.jp-card-mastercard .paycard_card {
  background-color: #0061a8;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_wrap.jp-card-maestro .paycard_card {
  background-color: #174160;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_wrap.jp-card-amex .paycard_card {
  background-color: #a6bbe1;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_wrap.jp-card-discover .paycard_card {
  background-color: #3d392e;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_wrap.jp-card-dinersclub .paycard_card {
  background-color: #8baeae;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_wrap.jp-card-dankort .paycard_card {
  background-color: #0055c7;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_wrap.jp-card-jcb .paycard_card {
  background-color: #f8a61b;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_wrap.selected .paycard_card,
body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_wrap.active .paycard_card {
  border-color: transparent;
  box-shadow: 0 5px 15px rgba(0, 0, 0, .15);
  transform: none;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_add_wrap.selected .paycard_add_button,
body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_add_wrap.active .paycard_add_button {
  box-shadow: none;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_wrap:not(.expired):not(.paycard_add_wrap) .paycard_card {
  color: #fff;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_card_head {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 6px;
  min-width: 0;
  height: 18px;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .card_nickname {
  flex: 0 1 auto;
  min-width: 0;
  max-width: 104px;
  height: 18px;
  overflow: hidden;
  color: #fff;
  font: 500 12px/18px var(--cl-source-font);
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_number {
  position: relative;
  z-index: 1;
  gap: 5px;
  height: 18px;
  margin: 9px 0 0;
  color: #fff;
  font: 500 12px/18px var(--cl-source-font);
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_number .paycard_mask:nth-child(2),
body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_number .paycard_mask:nth-child(3) {
  display: inline-flex;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_mask {
  flex-basis: 21px;
  width: 21px;
  min-width: 21px;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_mask::before {
  width: 3px;
  height: 3px;
  background: #fff;
  box-shadow: 6px 0 0 #fff, 12px 0 0 #fff, 18px 0 0 #fff;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_exp {
  position: absolute !important;
  left: 10px !important;
  bottom: 13px !important;
  z-index: 1;
  gap: 5px;
  height: 17px;
  margin: 0;
  color: #fff;
  font: 400 11px/17px var(--cl-source-font);
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_exp_value {
  color: #fff;
  font-weight: 600;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_exp_label {
  min-width: 0;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_brand_logo {
  right: 10px !important;
  bottom: 13px !important;
  left: auto !important;
  top: auto !important;
  z-index: 1;
  color: #fff;
  line-height: 0;
  transform: none;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_brand_logo svg {
  display: block;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_brand_visa svg,
body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_brand_visaelectron svg {
  width: 38px;
  height: auto;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_brand_mastercard svg,
body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_brand_maestro svg {
  width: 36px;
  height: auto;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_brand_amex svg {
  width: 32px;
  height: 32px;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_brand_discover svg {
  width: 44px;
  height: auto;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_brand_dinersclub svg {
  width: 64px;
  height: auto;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_brand_dankort svg {
  width: 42px;
  height: auto;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_brand_jcb svg {
  width: 34px;
  height: auto;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_expired_badge {
  display: none;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_expired_overlay {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 202px;
  height: 114px;
  margin: 0;
  padding: 0;
  border-radius: 14px;
  pointer-events: none;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_expired_overlay::before {
  content: "";
  position: absolute;
  inset: 0;
  width: 202px;
  height: 114px;
  border-radius: 14px;
  background: #000;
  opacity: .55;
  -webkit-backdrop-filter: blur(1px);
  backdrop-filter: blur(1px);
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_expired_overlay_icon {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  margin-right: 4px;
  color: #fff;
  line-height: 0;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_expired_overlay_icon svg {
  display: block;
  width: 16px;
  height: 16px;
  fill: currentColor;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_expired_overlay_text {
  position: relative;
  z-index: 1;
  color: #fff;
  font: 700 14px/20px var(--cl-source-font);
  white-space: nowrap;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_badge,
body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_legacy_badge {
  flex: none;
  min-width: 0;
  max-width: 76px;
  height: 18px;
  margin-left: auto;
  padding: 0 7px;
  border-color: #fff;
  color: #fff;
  font: 600 10px/16px var(--cl-source-font);
  white-space: nowrap;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_badge::after {
  content: none;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_legacy_badge {
  color: #fff;
  font: 600 10.5px/16px var(--cl-source-font);
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_legacy_wrap .paycard_card_head {
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  height: auto;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_legacy_wrap .card_nickname {
  flex: none;
  width: 100%;
  max-width: 100%;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_add_button {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 13px 14px;
  border-width: 1px;
  border-color: var(--cl-border-hover);
  border-style: dashed;
  background: var(--cl-surface);
  box-shadow: none;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_add_button:hover {
  border-color: var(--cl-green-action);
  background: var(--cl-surface);
  outline: 0;
  box-shadow: none;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_add_button:focus {
  border-color: var(--cl-green-action);
  background: var(--cl-surface);
  outline: 0;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .13);
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_add_icon {
  width: 26px;
  height: 26px;
  margin: 0;
  background: var(--cl-green-action);
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_add_text {
  color: var(--cl-green-text);
  font: 700 13px/1 var(--cl-source-font);
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_add_wrap.is-disabled .paycard_add_button,
body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_add_wrap.is-disabled .paycard_add_button:hover,
body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_add_wrap.is-disabled .paycard_add_button:focus {
  border-color: var(--cl-border);
  background: var(--cl-bg-3);
  box-shadow: none;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_add_wrap.is-disabled .paycard_add_icon {
  background: var(--cl-text-muted);
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_add_wrap.is-disabled .paycard_add_text {
  color: var(--cl-text-muted);
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_arrow {
  z-index: 6;
  top: 57px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border: 0;
  background: var(--cl-surface);
  color: #b6bcc5;
  box-shadow: 0 2px 10px rgba(20, 24, 32, .18);
  transition: background .12s, color .12s, opacity .12s;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_arrow svg {
  display: block;
  width: 12px;
  height: 12px;
  fill: none;
  stroke: currentColor;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_arrow_prev {
  left: -8px;
  transform: translateY(-50%);
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_arrow_next {
  right: -8px;
  transform: translateY(-50%) rotate(180deg);
}

@media (min-width: 521px) {
  body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_viewport {
    width: 100%;
    margin-right: 0;
    margin-left: 0;
  }

  body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_arrow_prev {
    left: -8px;
  }

  body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_arrow_next {
    right: -8px;
  }
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_arrow:not(:disabled):hover,
body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_arrow:not(:disabled):focus {
  background: var(--cl-surface);
  color: var(--cl-green);
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_dots {
  gap: 0;
  height: 15px;
  margin: 8px auto 0;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_dot {
  flex: none;
  width: 15px;
  height: 15px;
  padding: 5px;
  line-height: 0;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_dot::before {
  flex: 0 0 5px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #d3d8df;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_dot.active::before {
  background: var(--cl-text-sub);
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .paypal_checkbox.newcheckbox label {
  margin: 0;
  color: var(--cl-text-sub);
  font-size: 12.5px;
  line-height: 1.6;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-summary > .paypal_checkbox.newcheckbox {
  margin: 18px 0 0;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-side {
  position: sticky;
  top: 76px;
  display: flex;
  flex-direction: column;
  flex: 0 0 300px;
  gap: 16px;
  width: 300px;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-payment,
body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-summary {
  width: 100%;
  padding: 26px 24px 24px;
  border: 1px solid var(--cl-border);
  border-radius: var(--cl-radius-lg);
  background: var(--cl-surface);
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-payment {
  overflow: hidden;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-payment-title,
body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-summary-title {
  margin: 0 0 6px;
  padding: 0 0 14px;
  border-bottom: 1px solid var(--cl-line);
  color: var(--cl-text);
  font: 700 14px/1.4 var(--cl-source-font);
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-payment .select-wrap.pay-method {
  margin-top: 12px;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-charge {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  min-height: 0;
  margin: 0;
  padding: 6px 0;
  color: var(--cl-text-sub);
  font: 400 13.5px/1.45 var(--cl-source-font);
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-charge > span:last-child {
  flex: 0 0 auto;
  color: var(--cl-text-sub);
  font-variant-numeric: tabular-nums;
  text-align: right;
  white-space: nowrap;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-summary-divider {
  height: 1px;
  margin: 6px 0 18px;
  background: var(--cl-border);
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-charge-total {
  padding: 0 0 4px;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-charge-total > span:first-child {
  color: var(--cl-text);
  font-size: 16px;
  font-weight: 700;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-charge-total > span:last-child,
body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-charge-total .charge-total {
  color: var(--cl-green-text);
  font-size: 20px;
  font-weight: 700;
  letter-spacing: -.5px;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-charge-total small {
  margin-left: 3px;
  color: var(--cl-text);
  font-size: 13px;
  font-weight: 600;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-agree {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin: 18px 0 0;
  color: var(--cl-text-sub);
  font: 400 12.5px/1.65 var(--cl-source-font);
  cursor: pointer;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-agree input {
  -webkit-appearance: none;
  appearance: none;
  position: relative;
  flex: none;
  box-sizing: border-box;
  width: 16px;
  height: 16px;
  margin: 1px 0 0;
  border: 1.5px solid #c9cdd4;
  border-radius: 4px;
  background: var(--cl-surface);
  cursor: pointer;
  transition: background .12s, border-color .12s;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-agree input:checked {
  border-color: var(--cl-green-action);
  background-color: var(--cl-green-action);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12.5l4.2 4.2L19 6.5' fill='none' stroke='%23ffffff' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 12px 12px;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-agree input:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .2);
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-agree a {
  color: var(--cl-green-text);
  text-decoration: underline;
  text-underline-offset: 2px;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-agree em {
  color: var(--cl-text-sub);
  font-style: normal;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #buy.btn-pay-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 50px;
  margin: 18px 0 0;
  padding: 0 16px;
  border: 0;
  border-radius: var(--cl-radius-md);
  background: var(--cl-green-action);
  color: #fff;
  font: 700 16px/1 var(--cl-source-font);
  box-shadow: none;
  cursor: pointer;
  transition: background var(--cl-motion-fast), color var(--cl-motion-fast);
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #buy.btn-pay-btn:hover,
body.cl-dashboard-plan-payment-page .cl-source-plan-buy #buy.btn-pay-btn:focus {
  background: var(--cl-green-hover);
  color: #fff;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #buy.btn-pay-btn.is-agreement-disabled,
body.cl-dashboard-plan-payment-page .cl-source-plan-buy #buy.btn-pay-btn.is-agreement-disabled:hover,
body.cl-dashboard-plan-payment-page .cl-source-plan-buy #buy.btn-pay-btn.is-agreement-disabled:focus,
body.cl-dashboard-plan-payment-page .cl-source-plan-buy #buy.btn-pay-btn.is-card-unavailable,
body.cl-dashboard-plan-payment-page .cl-source-plan-buy #buy.btn-pay-btn.is-card-unavailable:hover,
body.cl-dashboard-plan-payment-page .cl-source-plan-buy #buy.btn-pay-btn.is-card-unavailable:focus {
  background: #e9ebee;
  color: var(--cl-text-muted);
  cursor: default;
  pointer-events: auto;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .pay-auto-wrap {
  position: relative;
  width: 100%;
  margin-top: 18px;
  overflow: hidden;
  border-radius: var(--cl-radius-md);
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .pay-auto-wrap.is-agreement-disabled::after {
  position: absolute;
  inset: 0;
  z-index: 1000;
  border-radius: var(--cl-radius-md);
  background: rgba(233, 235, 238, .62);
  cursor: default;
  content: "";
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .paypal_paybtn {
  margin: 0;
  line-height: 0;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-popup-note {
  margin: 10px 0 0;
  color: var(--cl-text-muted);
  font: 400 12px/1.6 var(--cl-source-font);
  text-align: left;
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy .pay_notice,
body.cl-dashboard-plan-payment-page .cl-source-plan-buy .pay_non_subscript {
  max-width: none;
  border-radius: var(--cl-radius-md);
}

@media (max-width: 900px) {
  body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-wrap {
    padding: 40px 20px 64px;
  }

  body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-columns {
    flex-direction: column;
    align-items: stretch;
  }

  body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-main,
  body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-side {
    width: 100%;
  }

  body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-side {
    position: static;
    flex-basis: auto;
    top: auto;
  }
}

@media (max-width: 520px) {
  body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-wrap {
    padding: 32px 16px 56px;
  }

  body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-head {
    margin-bottom: 28px;
  }

  body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-head h1 {
    font-size: 20px;
  }

  body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-steps {
    max-width: 360px;
  }

  body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-step-dot {
    width: 38px;
    height: 38px;
  }

  body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-step:not(:last-child)::after {
    top: 18px;
    left: calc(50% + 19px);
    width: calc(100% - 38px);
  }

  body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-step-name {
    font-size: 12px;
  }

  body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-main {
    padding: 26px 20px 24px;
  }

  body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-payment,
  body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-buy-summary {
    padding: 20px 16px 18px;
  }

  body.cl-dashboard-plan-payment-page .cl-source-plan-buy:not(.sub-change) .sub-panel > .plan-grid {
    align-items: flex-start;
    padding: 14px;
  }

  body.cl-dashboard-plan-payment-page .cl-source-plan-buy .plan-per-month {
    max-width: 48%;
    white-space: normal;
  }

  body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_wrap,
  body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_add_wrap {
    flex-basis: 202px;
    width: 202px;
  }

  body.cl-dashboard-plan-payment-page .cl-source-plan-buy #payment-card-select .paycard_arrow {
    display: inline-flex;
  }
}

body.cl-dashboard-plan-payment-page .cl-source-plan-buy #buy.btn-pay-btn.pay_notice,
body.cl-dashboard-plan-payment-page .cl-source-plan-buy #buy.btn-pay-btn.pay_notice:hover,
body.cl-dashboard-plan-payment-page .cl-source-plan-buy #buy.btn-pay-btn.pay_notice:focus {
  position: static;
  min-height: 50px;
  margin-top: 18px;
  background: #e9ebee;
  color: var(--cl-text-muted);
  opacity: 1;
}

/* 기본설정: 기본 프로필 아이콘과 도움말 의미 색상 */
body.cl-dashboard-redesign-page #cl-basic-settings-page .cl-site-profile-avatar {
  color: var(--cl-text-muted);
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .cl-site-profile-avatar .cl-site-profile-placeholder {
  display: none;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .cl-site-profile-avatar.is-default .cl-site-profile-photo {
  display: none;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .cl-site-profile-avatar.is-default .cl-site-profile-placeholder {
  display: block;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page .cl-site-profile-avatar .cl-site-profile-placeholder-bg {
  color: var(--cl-bg-3);
}

body.cl-dashboard-redesign-page #cl-basic-settings-page :is(
  .setting-sub-content > ul > li > label,
  .setting-sub-title
) .cm-popover-info {
  color: var(--cl-green-text) !important;
  fill: var(--cl-green) !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page :is(
  .setting-sub-content > ul > li > label,
  .setting-sub-title
) .cm-popover-info :is(path, rect, circle) {
  fill: currentColor !important;
}

/* 결제 카드 추가: 대시보드·요금제 결제 화면에서 시안의 닫기 버튼 규격을 동일하게 유지한다. */
body.cl-source-card-add-modal-open #billingCardModalRoot .card-add-modal-default .modal-content > .modal-close {
  top: 16px !important;
  right: 16px !important;
  width: 30px !important;
  min-width: 30px !important;
  max-width: 30px !important;
  height: 30px !important;
  min-height: 30px !important;
  max-height: 30px !important;
  color: var(--cl-text-sub) !important;
}

body.cl-source-card-add-modal-open #billingCardModalRoot .card-add-modal-default .modal-content > .modal-close > span,
body.cl-source-card-add-modal-open #billingCardModalRoot .card-add-modal-default .modal-content > .modal-close svg {
  display: block !important;
}

body.cl-source-card-add-modal-open #billingCardModalRoot .card-add-modal-default .modal-content > .modal-close::before,
body.cl-source-card-add-modal-open #billingCardModalRoot .card-add-modal-default .modal-content > .modal-close::after {
  display: none !important;
  content: none !important;
}

/* 요금제 관리: 비활성 연장 버튼은 공통 disabled·행 hover보다 우선한다. */
body.cl-dashboard-redesign-page .cl-source-plan-page .plan-list > li .plan-site > li.info > .plan-btn-box .plan-btn.extend:is(.disabled, .auto-schedule-disabled, .no_active_btn, .vbank_ready),
body.cl-dashboard-redesign-page .cl-source-plan-page .plan-list > li:hover .plan-site > li.info > .plan-btn-box .plan-btn.extend:is(.disabled, .auto-schedule-disabled, .no_active_btn, .vbank_ready):hover {
  --cl-disabled-button-border: #e5e7eb;
  background: transparent !important;
  border-color: #e5e7eb !important;
  color: #d1d3d5 !important;
  cursor: default !important;
}

/* 요금제 결제 결과: 카드 결제 완료·가상계좌 입금 대기 화면 */
body.cl-dashboard-plan-payment-result-page,
body.cl-dashboard-plan-payment-result-page .cl-source-plan-payment-result,
body.cl-dashboard-plan-payment-result-page .cl-source-plan-payment-result * {
  box-sizing: border-box;
}

body.cl-dashboard-plan-payment-result-page {
  min-width: 0;
  background: var(--cl-page-bg);
  color: var(--cl-text);
  font-family: var(--cl-source-font) !important;
  letter-spacing: 0;
}

body.cl-dashboard-plan-payment-result-page .cl-source-plan-payment-result {
  width: 100%;
  min-height: calc(100vh - 56px);
  margin: 0 !important;
  padding: 0 !important;
  background: var(--cl-page-bg);
  color: var(--cl-text);
  font-family: var(--cl-source-font) !important;
  text-align: center;
}

body.cl-dashboard-plan-payment-result-page .cl-payment-result-wrap {
  width: 100%;
  max-width: 620px;
  margin: 0 auto;
  padding: 72px 40px 90px;
}

body.cl-dashboard-plan-payment-result-page .cl-payment-result-steps {
  display: flex;
  width: 100%;
  max-width: 480px;
  margin: 0 auto 28px;
}

body.cl-dashboard-plan-payment-result-page .cl-payment-result-step {
  position: relative;
  display: flex;
  flex: 1 1 0;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  min-width: 0;
  color: var(--cl-text-muted);
}

body.cl-dashboard-plan-payment-result-page .cl-payment-result-step:not(:last-child)::after {
  position: absolute;
  top: 20px;
  left: calc(50% + 21px);
  width: calc(100% - 42px);
  height: 2px;
  background: #e1e4e8;
  content: "";
}

body.cl-dashboard-plan-payment-result-page .cl-payment-result-step.done:not(:last-child)::after {
  background: var(--cl-green-action);
}

body.cl-dashboard-plan-payment-result-page .cl-payment-result-step-dot {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border: 2px solid #d9dde3;
  border-radius: 999px;
  background: var(--cl-surface);
  color: var(--cl-text-muted);
  font: 600 13px/1 var(--cl-source-font);
}

body.cl-dashboard-plan-payment-result-page .cl-payment-result-step.done .cl-payment-result-step-dot {
  border-color: var(--cl-green-action);
  background: var(--cl-green-action);
  color: #fff;
}

body.cl-dashboard-plan-payment-result-page .cl-payment-result-step.active .cl-payment-result-step-dot {
  border-color: var(--cl-green-action);
  color: var(--cl-green-text);
}

body.cl-dashboard-plan-payment-result-page .cl-payment-result-step-dot svg {
  display: block;
  width: 20px;
  height: 20px;
}

body.cl-dashboard-plan-payment-result-page .cl-payment-result-step-name {
  color: inherit;
  font: 500 13.5px/1 var(--cl-source-font);
  white-space: nowrap;
}

body.cl-dashboard-plan-payment-result-page .cl-payment-result-step.done,
body.cl-dashboard-plan-payment-result-page .cl-payment-result-step.active {
  color: var(--cl-green-text);
}

body.cl-dashboard-plan-payment-result-page .cl-payment-result-step[aria-current="step"] .cl-payment-result-step-name {
  font-weight: 700;
}

body.cl-dashboard-plan-payment-result-page .cl-payment-result-card {
  position: relative;
  width: 100%;
  padding: 34px 36px 32px;
  border: 1px solid var(--cl-border);
  border-radius: var(--cl-radius-lg);
  background: var(--cl-surface);
}

body.cl-dashboard-plan-payment-result-page .cl-payment-result-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  margin: 0 auto 18px;
  border-radius: 999px;
}

body.cl-dashboard-plan-payment-result-page .cl-payment-result-icon.wait {
  background: var(--cl-green-soft);
  color: var(--cl-green);
}

body.cl-dashboard-plan-payment-result-page .cl-payment-result-icon.ok {
  background: var(--cl-green-action);
  color: #fff;
}

body.cl-dashboard-plan-payment-result-page .cl-payment-result-icon svg {
  width: 26px;
  height: 26px;
}

body.cl-dashboard-plan-payment-result-page .cl-payment-result-card h1 {
  margin: 0 0 14px;
  color: var(--cl-text);
  font: 700 21px/1.4 var(--cl-source-font);
  letter-spacing: 0;
}

body.cl-dashboard-plan-payment-result-page .cl-payment-result-description {
  margin: 0 0 26px;
  color: var(--cl-text-sub);
  font-size: 13px;
  line-height: 1.7;
}

body.cl-dashboard-plan-payment-result-page .cl-payment-result-list {
  margin: 0;
  border-top: 1px solid var(--cl-line);
  text-align: left;
}

body.cl-dashboard-plan-payment-result-page .cl-payment-result-row {
  display: flex;
  align-items: center;
  gap: 16px;
  min-height: 42px;
  padding: 0 2px;
  border-bottom: 1px solid var(--cl-line);
  font-size: 13px;
  line-height: 18px;
}

body.cl-dashboard-plan-payment-result-page .cl-payment-result-row dt {
  flex: none;
  width: 104px;
  color: var(--cl-text-sub);
  font-weight: 600;
  text-align: right;
}

body.cl-dashboard-plan-payment-result-page .cl-payment-result-row dd {
  flex: 1 1 auto;
  min-width: 0;
  margin: 0;
  color: var(--cl-text);
  overflow-wrap: anywhere;
}

body.cl-dashboard-plan-payment-result-page .cl-payment-result-row dd.status {
  color: var(--cl-green-text);
  font-weight: 600;
}

body.cl-dashboard-plan-payment-result-page .cl-payment-result-billing-info {
  margin-top: 20px;
  color: var(--cl-text-sub);
  font-size: 13px;
  line-height: 1.7;
  text-align: left;
}

body.cl-dashboard-plan-payment-result-page .cl-payment-result-billing-info a {
  color: var(--cl-green-text);
}

body.cl-dashboard-plan-payment-result-page .cl-payment-result-account {
  display: flex;
  align-items: center;
  gap: 6px;
}

body.cl-dashboard-plan-payment-result-page .cl-payment-account-copy {
  display: inline-flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  padding: 0;
  border: 0;
  border-radius: var(--cl-radius-sm);
  background: transparent;
  color: var(--cl-text-muted);
  cursor: pointer;
  transition: color var(--cl-motion-fast), background-color var(--cl-motion-fast);
}

body.cl-dashboard-plan-payment-result-page .cl-payment-account-copy svg {
  width: 15px;
  height: 15px;
}

body.cl-dashboard-plan-payment-result-page .cl-payment-account-copy:hover,
body.cl-dashboard-plan-payment-result-page .cl-payment-account-copy:focus-visible {
  background: var(--cl-green-tint);
  color: var(--cl-green-text);
}

body.cl-dashboard-plan-payment-result-page .cl-payment-result-primary {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 50px;
  margin-top: 34px;
  padding: 0 16px;
  border: 0;
  border-radius: 9px;
  background: var(--cl-green-action);
  color: #fff;
  font-size: 15px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
  transition: background-color var(--cl-motion-fast);
}

body.cl-dashboard-plan-payment-result-page .cl-payment-result-billing-info + .cl-payment-result-primary {
  margin-top: 20px;
}

body.cl-dashboard-plan-payment-result-page .cl-payment-result-primary:hover,
body.cl-dashboard-plan-payment-result-page .cl-payment-result-primary:focus-visible {
  background: var(--cl-green-hover);
  color: #fff;
  text-decoration: none;
}

body.cl-dashboard-plan-payment-result-page .cl-payment-result-cancel {
  display: block;
  width: 100%;
  margin-top: 14px;
  padding: 11px;
  border: 0;
  border-radius: 9px;
  background: transparent;
  color: var(--cl-danger);
  font-family: inherit;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: background-color var(--cl-motion-fast);
}

body.cl-dashboard-plan-payment-result-page .cl-payment-result-cancel:hover,
body.cl-dashboard-plan-payment-result-page .cl-payment-result-cancel:focus-visible {
  background: var(--cl-danger-soft);
  color: var(--cl-danger);
}

/* common.css의 *:focus outline:0 !important보다 결과 화면의 키보드 포커스를 우선한다. */
body.cl-dashboard-plan-payment-result-page .cl-payment-result-primary:focus-visible,
body.cl-dashboard-plan-payment-result-page .cl-payment-account-copy:focus-visible {
  outline: 2px solid var(--cl-green-action) !important;
  outline-offset: 2px;
}

body.cl-dashboard-plan-payment-result-page .cl-payment-result-cancel:focus-visible {
  outline: 2px solid var(--cl-danger) !important;
  outline-offset: 2px;
}

/* 요금제 결제 결과: 가상계좌 결제 취소 확인 팝업 */
body.cl-dashboard-plan-payment-result-page .flat-modal.cl-plan-vbank-cancel-modal-wrap {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  overflow: auto !important;
  background: rgba(20, 24, 32, .45) !important;
  z-index: 1000001 !important;
}

body.cl-dashboard-plan-payment-result-page .flat-modal.cl-plan-vbank-cancel-modal-wrap + .modal-backdrop,
body.cl-dashboard-plan-payment-result-page .flat-modal.cl-plan-vbank-cancel-modal-wrap + .modal-backdrop.fade.in {
  background: transparent !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

body.cl-dashboard-plan-payment-result-page .flat-modal.cl-plan-vbank-cancel-modal-wrap > .modal-default {
  position: fixed !important;
  inset: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100vw !important;
  min-height: 100vh !important;
  margin: 0 !important;
  padding: 20px 16px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  background: transparent !important;
  z-index: inherit !important;
}

body.cl-dashboard-plan-payment-result-page .flat-modal.cl-plan-vbank-cancel-modal-wrap > .modal-default > .cl-mobile-btn.close {
  display: none !important;
}

body.cl-dashboard-plan-payment-result-page .flat-modal.cl-plan-vbank-cancel-modal-wrap .modal-dialog.cl-plan-vbank-cancel-modal {
  width: min(440px, calc(100vw - 32px)) !important;
  min-width: 0 !important;
  max-width: min(440px, calc(100vw - 32px)) !important;
  height: auto !important;
  min-height: 0 !important;
  margin: auto !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  transform: none !important;
}

body.cl-dashboard-plan-payment-result-page .flat-modal.cl-plan-vbank-cancel-modal-wrap .modal-dialog.cl-plan-vbank-cancel-modal .modal-content {
  position: relative !important;
  float: none !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 44px 28px 34px !important;
  overflow: visible !important;
  background: var(--cl-surface, #fff) !important;
  border: 0 !important;
  border-radius: 18px !important;
  box-shadow: 0 20px 50px rgba(20, 24, 32, .25) !important;
  color: var(--cl-text, #222428) !important;
  font-family: var(--cl-source-font) !important;
  text-align: center !important;
}

body.cl-dashboard-plan-payment-result-page .flat-modal.cl-plan-vbank-cancel-modal-wrap .modal-dialog.cl-plan-vbank-cancel-modal .modal-body {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cl-text-sub, #8a8f98) !important;
  font-family: var(--cl-source-font) !important;
  text-align: center !important;
}

body.cl-dashboard-plan-payment-result-page .flat-modal.cl-plan-vbank-cancel-modal-wrap .modal-dialog.cl-plan-vbank-cancel-modal .modal-title {
  margin: 0 30px 22px !important;
  padding: 0 !important;
  color: var(--cl-text, #222428) !important;
  font-size: 21px !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  word-break: keep-all !important;
}

body.cl-dashboard-plan-payment-result-page .flat-modal.cl-plan-vbank-cancel-modal-wrap .cl-plan-vbank-cancel-message {
  margin: 4px 0 2px !important;
  color: var(--cl-text-sub, #8a8f98) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.75 !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  word-break: keep-all !important;
}

body.cl-dashboard-plan-payment-result-page .flat-modal.cl-plan-vbank-cancel-modal-wrap .modal-content > .close.close-button-dialog {
  position: absolute !important;
  top: 16px !important;
  right: 16px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--cl-text-sub, #8a8f98) !important;
  opacity: 1 !important;
  transition: color .12s, background-color .12s, transform .18s cubic-bezier(.34, 1.56, .64, 1) !important;
}

body.cl-dashboard-plan-payment-result-page .flat-modal.cl-plan-vbank-cancel-modal-wrap .modal-content > .close.close-button-dialog:hover,
body.cl-dashboard-plan-payment-result-page .flat-modal.cl-plan-vbank-cancel-modal-wrap .modal-content > .close.close-button-dialog:focus {
  background: var(--cl-bg-3, #f1f2f5) !important;
  color: var(--cl-text, #222428) !important;
  outline: 0 !important;
  transform: rotate(90deg) !important;
}

body.cl-dashboard-plan-payment-result-page .flat-modal.cl-plan-vbank-cancel-modal-wrap .modal-content > .close.close-button-dialog svg {
  display: block !important;
  width: 15px !important;
  height: 15px !important;
  fill: currentColor !important;
}

body.cl-dashboard-plan-payment-result-page .flat-modal.cl-plan-vbank-cancel-modal-wrap .modal-dialog.cl-plan-vbank-cancel-modal .modal-footer {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  width: 100% !important;
  max-width: none !important;
  margin: 26px 0 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  gap: 12px !important;
}

body.cl-dashboard-plan-payment-result-page .flat-modal.cl-plan-vbank-cancel-modal-wrap .modal-dialog.cl-plan-vbank-cancel-modal .modal-footer::before,
body.cl-dashboard-plan-payment-result-page .flat-modal.cl-plan-vbank-cancel-modal-wrap .modal-dialog.cl-plan-vbank-cancel-modal .modal-footer::after {
  display: none !important;
}

body.cl-dashboard-plan-payment-result-page .flat-modal.cl-plan-vbank-cancel-modal-wrap .modal-dialog.cl-plan-vbank-cancel-modal .modal-footer > .btn {
  float: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 16px !important;
  border: 0 !important;
  box-shadow: none !important;
  font-family: var(--cl-source-font) !important;
  line-height: 1 !important;
  text-decoration: none !important;
}

body.cl-dashboard-plan-payment-result-page .flat-modal.cl-plan-vbank-cancel-modal-wrap .modal-dialog.cl-plan-vbank-cancel-modal .modal-footer > .ok-button-dialog,
body.cl-dashboard-plan-payment-result-page .flat-modal.cl-plan-vbank-cancel-modal-wrap .modal-dialog.cl-plan-vbank-cancel-modal .modal-footer > .ok-button-dialog:active {
  order: 1 !important;
  height: 48px !important;
  min-height: 48px !important;
  background: var(--cl-danger, #e5484d) !important;
  border-radius: 9px !important;
  color: #fff !important;
  font-size: 15px !important;
  font-weight: 700 !important;
}

body.cl-dashboard-plan-payment-result-page .flat-modal.cl-plan-vbank-cancel-modal-wrap .modal-dialog.cl-plan-vbank-cancel-modal .modal-footer > .ok-button-dialog:hover,
body.cl-dashboard-plan-payment-result-page .flat-modal.cl-plan-vbank-cancel-modal-wrap .modal-dialog.cl-plan-vbank-cancel-modal .modal-footer > .ok-button-dialog:focus {
  background: #d93a53 !important;
  color: #fff !important;
  outline: 0 !important;
}

body.cl-dashboard-plan-payment-result-page .flat-modal.cl-plan-vbank-cancel-modal-wrap .modal-dialog.cl-plan-vbank-cancel-modal .modal-footer > .close-button-dialog,
body.cl-dashboard-plan-payment-result-page .flat-modal.cl-plan-vbank-cancel-modal-wrap .modal-dialog.cl-plan-vbank-cancel-modal .modal-footer > .close-button-dialog:active {
  order: 2 !important;
  height: 40px !important;
  min-height: 40px !important;
  background: transparent !important;
  border-radius: 8px !important;
  color: var(--cl-text-sub, #8a8f98) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
}

body.cl-dashboard-plan-payment-result-page .flat-modal.cl-plan-vbank-cancel-modal-wrap .modal-dialog.cl-plan-vbank-cancel-modal .modal-footer > .close-button-dialog:hover,
body.cl-dashboard-plan-payment-result-page .flat-modal.cl-plan-vbank-cancel-modal-wrap .modal-dialog.cl-plan-vbank-cancel-modal .modal-footer > .close-button-dialog:focus {
  background: var(--cl-bg-3, #f1f2f5) !important;
  color: var(--cl-text, #222428) !important;
  outline: 0 !important;
}

@media (max-width: 480px) {
  body.cl-dashboard-plan-payment-result-page .flat-modal.cl-plan-vbank-cancel-modal-wrap .modal-dialog.cl-plan-vbank-cancel-modal .modal-content {
    padding: 28px 20px 24px !important;
  }

  body.cl-dashboard-plan-payment-result-page .flat-modal.cl-plan-vbank-cancel-modal-wrap .modal-dialog.cl-plan-vbank-cancel-modal .modal-title {
    margin-bottom: 18px !important;
    font-size: 19px !important;
  }
}

@media (max-width: 640px) {
  body.cl-dashboard-plan-payment-result-page .cl-payment-result-wrap {
    padding: 48px 20px 72px;
  }

  body.cl-dashboard-plan-payment-result-page .cl-payment-result-steps {
    max-width: 360px;
  }

  body.cl-dashboard-plan-payment-result-page .cl-payment-result-card {
    padding: 26px 20px 24px;
  }
}

@media (max-width: 480px) {
  body.cl-dashboard-plan-payment-result-page .cl-payment-result-wrap {
    padding: 36px 16px 56px;
  }

  body.cl-dashboard-plan-payment-result-page .cl-payment-result-card {
    padding: 22px 16px 20px;
  }

  body.cl-dashboard-plan-payment-result-page .cl-payment-result-step-dot {
    width: 38px;
    height: 38px;
  }

  body.cl-dashboard-plan-payment-result-page .cl-payment-result-step:not(:last-child)::after {
    top: 18px;
    left: calc(50% + 19px);
    width: calc(100% - 38px);
  }

  body.cl-dashboard-plan-payment-result-page .cl-payment-result-step-name {
    font-size: 12px;
  }
}

@media (max-width: 380px) {
  body.cl-dashboard-plan-payment-result-page .cl-payment-result-row {
    flex-direction: column;
    align-items: stretch;
    gap: 4px;
    padding: 10px 2px;
  }

  body.cl-dashboard-plan-payment-result-page .cl-payment-result-row dt {
    width: auto;
    text-align: left;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.cl-dashboard-plan-payment-result-page .cl-payment-account-copy,
  body.cl-dashboard-plan-payment-result-page .cl-payment-result-primary,
  body.cl-dashboard-plan-payment-result-page .cl-payment-result-cancel {
    transition: none;
  }
}

/* 요금제 관리: 결제 카드 변경 팝업 */
body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .modal-dialog.cl-plan-card-select-modal,
body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .modal-default.fade .modal-dialog.cl-plan-card-select-modal,
body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .modal-default.in .modal-dialog.cl-plan-card-select-modal,
body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .modal-default.show .modal-dialog.cl-plan-card-select-modal {
  width: min(560px, calc(100vw - 32px)) !important;
  max-width: min(560px, calc(100vw - 32px)) !important;
  /* 일반 페이지용 .sub-page의 min-height:80%가 카드 아래 빈 공간을 만들지 않도록 한다. */
  min-height: 0;
}

body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .cl-plan-card-select-modal .modal-content {
  padding: 36px 32px 30px !important;
  overflow: hidden !important;
  background: var(--surface, #fff) !important;
  border: 1px solid var(--border, #e5e7eb) !important;
  border-radius: 14px !important;
  box-shadow: var(--shadow-modal, 0 20px 50px rgba(20, 24, 32, .25)) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .cl-plan-card-select-modal .modal-body {
  overflow: visible !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .cl-plan-card-select-modal .modal-title {
  margin: 0 36px 18px !important;
  color: var(--ink, #222428) !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .cl-plan-card-select-modal .select-card-auto-notice {
  margin: 0 0 18px !important;
  color: var(--ink-2, #8a8f98) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.55 !important;
  text-align: center !important;
  word-break: keep-all !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .cl-plan-card-select-modal .paycard_list_container,
body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .cl-plan-card-select-modal .select-card-auto-notice + .paycard_list_container {
  position: relative !important;
  box-sizing: border-box !important;
  width: min(380px, calc(100% - 88px)) !important;
  max-width: min(380px, calc(100% - 88px)) !important;
  height: 240px !important;
  margin: 0 auto !important;
  padding: 26px 0 0 !important;
  overflow: visible !important;
  background: var(--bg, #f4f5f9) !important;
  border: 1px solid var(--line, #eef0f4) !important;
  border-radius: 8px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .cl-plan-card-select-modal .paycard_viewport {
  width: 100% !important;
  margin: 0 auto !important;
  padding-bottom: 15px !important;
  overflow: hidden !important;
  touch-action: pan-y !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .cl-plan-card-select-modal .paycard_ul {
  align-items: center !important;
  gap: 10px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .cl-plan-card-select-modal .paycard_dots {
  height: 15px !important;
  margin: 8px auto 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .cl-plan-card-select-modal .paycard_add_button {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  padding: 13px 14px !important;
  overflow: hidden !important;
  background: var(--surface, #fff) !important;
  border: 1px dashed var(--green, #03c75a) !important;
  border-radius: 14px !important;
  box-shadow: none !important;
  color: var(--cl-green-text) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .cl-plan-card-select-modal .paycard_add_button:hover {
  background: var(--surface, #fff) !important;
  border-color: var(--green-hover, #02b351) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .cl-plan-card-select-modal .paycard_add_button:focus-visible {
  background: var(--surface, #fff) !important;
  border-color: var(--green, #03c75a) !important;
  box-shadow: var(--ring, 0 0 0 3px rgba(3, 199, 90, .13)) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .cl-plan-card-select-modal .paycard_add_icon {
  width: 26px !important;
  height: 26px !important;
  margin: 0 !important;
  background: var(--green, #03c75a) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .cl-plan-card-select-modal .paycard_add_text {
  color: var(--cl-green-text) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .cl-plan-card-select-modal .paycard_add_wrap.is-disabled .paycard_add_button,
body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .cl-plan-card-select-modal .paycard_add_wrap.is-disabled .paycard_add_button:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .cl-plan-card-select-modal .paycard_add_wrap.is-disabled .paycard_add_button:focus-visible {
  background: var(--bg-3, #f1f2f5) !important;
  border-color: var(--border, #e5e7eb) !important;
  box-shadow: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .cl-plan-card-select-modal .paycard_add_wrap.is-disabled .paycard_add_icon {
  background: var(--ink-3, #b4b8bf) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .cl-plan-card-select-modal .paycard_add_wrap.is-disabled .paycard_add_text {
  color: var(--ink-3, #b4b8bf) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .cl-plan-card-select-modal .paycard_arrow {
  position: absolute !important;
  top: 50% !important;
  z-index: 6 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  min-width: 30px !important;
  height: 30px !important;
  min-height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #fff !important;
  border: 0 !important;
  border-radius: 50% !important;
  box-shadow: 0 2px 10px rgba(20, 24, 32, .18) !important;
  color: var(--ink-3, #b4b8bf) !important;
  opacity: 1 !important;
  visibility: visible !important;
  cursor: pointer !important;
  transition: color .12s ease, opacity .12s ease !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .cl-plan-card-select-modal .paycard_arrow svg {
  display: block !important;
  width: 10px !important;
  height: 10px !important;
  fill: none !important;
  stroke: currentColor !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .cl-plan-card-select-modal .paycard_arrow_prev {
  left: -44px !important;
  transform: translateY(-50%) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .cl-plan-card-select-modal .paycard_arrow_next {
  right: -44px !important;
  transform: translateY(-50%) rotate(180deg) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .cl-plan-card-select-modal .paycard_arrow:disabled {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .cl-plan-card-select-modal .paycard_arrow:not(:disabled):hover,
body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .cl-plan-card-select-modal .paycard_arrow:not(:disabled):focus-visible {
  background: #fff !important;
  color: var(--green, #03c75a) !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .cl-plan-card-select-modal:is(.is-active-expired-card, .is-active-limit-reached-card) .modal-footer > .ok-button-dialog,
body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .cl-plan-card-select-modal .modal-footer > .ok-button-dialog:disabled,
body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .cl-plan-card-select-modal .modal-footer > .ok-button-dialog.is-disabled-visual {
  background: var(--bg-3, #f1f2f5) !important;
  border-color: var(--border, #e5e7eb) !important;
  box-shadow: none !important;
  color: var(--ink-3, #b4b8bf) !important;
  cursor: default !important;
}

@media (max-width: 767px) {
  body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .cl-plan-card-select-modal .paycard_list_container,
  body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .cl-plan-card-select-modal .select-card-auto-notice + .paycard_list_container {
    width: 100% !important;
    max-width: 100% !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .cl-plan-card-select-modal .paycard_wrap {
    flex-basis: min(260px, calc(100% - 40px));
    width: min(260px, calc(100% - 40px));
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .cl-plan-card-select-modal .paycard_arrow {
    display: none !important;
  }
}

@media (max-width: 640px) {
  body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .modal-dialog.cl-plan-card-select-modal,
  body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .modal-default.fade .modal-dialog.cl-plan-card-select-modal,
  body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .modal-default.in .modal-dialog.cl-plan-card-select-modal,
  body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .modal-default.show .modal-dialog.cl-plan-card-select-modal {
    width: calc(100vw - 24px) !important;
    max-width: calc(100vw - 24px) !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 0 !important;
    border-radius: 0 !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .cl-plan-card-select-modal .modal-content {
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 30px 20px 22px !important;
    border-radius: 14px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .cl-plan-card-select-modal .modal-title {
    margin-bottom: 14px !important;
    font-size: 18px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .cl-plan-card-select-modal .select-card-auto-notice {
    margin-bottom: 14px !important;
    font-size: 12px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .cl-plan-card-select-modal .paycard_list_container,
  body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .cl-plan-card-select-modal .select-card-auto-notice + .paycard_list_container {
    height: 225px !important;
    padding-top: 20px !important;
  }

  body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .cl-plan-card-select-modal .modal-footer {
    margin-top: 18px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.cl-dashboard-redesign-page .flat-modal.cl-plan-card-select-modal-wrap .cl-plan-card-select-modal .paycard_arrow {
    transition: none !important;
  }
}

/* 외부연동 */
body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page,
body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page * {
  box-sizing: border-box;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .dashbottom-container.settingMarketing-Dash {
  max-width: 964px !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .cl-source-basic-settings-head,
body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .site-detail.settings-dashboard,
body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .inner-box.new.setting-box {
  max-width: 900px !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .inner-box.new.setting-box {
  padding: 26px 28px 28px !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .setting-sub-box > .setting-subInfoBox {
  display: flex !important;
  flex-direction: row !important;
  align-items: flex-start;
  gap: 28px;
  margin: 0 !important;
  padding: 30px 0 !important;
  border-top: 0 !important;
  border-bottom: 1px solid var(--cl-border) !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .setting-sub-box > .setting-subInfoBox:first-child {
  padding-top: 0 !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .setting-sub-box > .setting-subInfoBox:last-child {
  padding-bottom: 0 !important;
  border-bottom: 0 !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .setting-sub-box > .setting-subInfoBox > .setting-sub-title {
  align-self: flex-start;
  flex: 0 0 22%;
  width: 22% !important;
  max-width: none !important;
  margin: 0 !important;
  padding-top: 0;
  min-height: 21px;
  display: flex;
  align-items: center;
  gap: 6px;
  position: relative;
  top: 7px;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .setting-sub-box > .setting-subInfoBox > .setting-sub-content {
  flex: 1 1 auto;
  width: auto !important;
  max-width: 720px;
  min-width: 0;
}

body.cl-dashboard-redesign-page #view-extlink .mkt-help {
  width: 15px !important;
  height: 15px !important;
  color: var(--cl-green-text, #13B059) !important;
  flex: none;
  position: relative !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .setting-sub-content > ul > li > label .cm-popover-info,
body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .setting-sub-title .cm-popover-info {
  top: -.5px !important;
}

body.cl-dashboard-redesign-page .popover.cl-external-integration-kakao-popover .popover-content {
  color: var(--cl-text-sub, #8A8F98) !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  line-height: 1.65 !important;
}

body.cl-dashboard-redesign-page .popover.cl-external-integration-kakao-popover .cl-kakao-tooltip-intro {
  margin: 0 0 12px !important;
}

body.cl-dashboard-redesign-page .popover.cl-external-integration-kakao-popover .cl-kakao-tooltip-list > li {
  margin-bottom: 10px !important;
  color: var(--cl-text-sub, #8A8F98) !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  line-height: 1.65 !important;
}

body.cl-dashboard-redesign-page .popover.cl-source-help-popover.cl-external-integration-kakao-popover:not(.cl-order-search-listitem-popover):not(.cl-delivery-action-popover) .popover-content .cl-kakao-tooltip-list > li:last-child {
  margin-bottom: 10px !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .setting-sub-content > ul > li > label {
  flex: 0 0 32%;
  width: 32% !important;
  max-width: 32% !important;
  gap: 9px;
  white-space: nowrap;
  padding: 0 !important;
  font-weight: 500 !important;
}

body.cl-dashboard-redesign-page #view-extlink .mkt-sec-label > span,
body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .externalintegration-sub-title-text {
  display: block;
  min-width: 0;
  font-size: 16px;
  font-weight: 700;
  line-height: 24px;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .setting-sub-box :is(
  .setting-sub-title > span,
  .setting-sub-content > ul > li > label,
  .msetting-val,
  .kakaolink-val,
  .navermap-val,
  .usekakaolinkText,
  .btn-add,
  .msetting-info small.error,
  .sl-guide,
  .ext-note,
  .kakaolink-key,
  .navermap-key,
  .kakaolink-key-save,
  .kakaolink-key-cancel,
  .navermap-key-save,
  .navermap-key-cancel
) {
  line-height: 1 !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .setting-detail-btn > span {
  min-height: 0;
  margin-left: 0;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .setting-detail-btn > .sl-guide {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 0 !important;
  border: 0;
  background: none;
  cursor: pointer;
  font-family: inherit;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  line-height: 1.5;
  color: var(--cl-green-text) !important;
  text-align: left;
  text-decoration: none !important;
  word-break: keep-all;
  transition: color .12s;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .setting-detail-btn > .sl-guide:focus {
  text-decoration: none !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .sl-guide svg {
  width: 11px;
  height: 11px;
  flex: none;
  position: relative;
  top: .5px;
  margin-left: 0 !important;
  fill: none !important;
  stroke: currentColor;
  transition: transform .13s;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .sl-guide svg path {
  fill: none !important;
}

@media (hover: hover) and (pointer: fine) {
  body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .sl-guide:hover {
    text-decoration: underline !important;
    text-underline-offset: 3px;
  }

  body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .sl-guide:hover svg {
    transform: translateX(2px);
  }
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page :is(.kakaolink-setting, .navermap-setting) > li:nth-last-child(2):not(.setting-detail-btn) {
  padding-bottom: 0 !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page :is(.kakaolink-setting, .navermap-setting) > .setting-detail-btn {
  margin: 28px 0 0 !important;
  padding: 0 !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page :is(.kakaolink-edit-box, .navermap-edit-box) {
  display: grid !important;
  grid-template-columns: minmax(0, 66%) repeat(2, minmax(0, calc(17% - 8px)));
  align-items: center;
  gap: 8px;
  position: static !important;
  top: auto !important;
  left: auto !important;
  transform: none !important;
  width: 100% !important;
  min-width: 0;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page :is(.kakaolink-edit-box, .navermap-edit-box).hide {
  display: none !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page :is(.kakaolink-edit-box, .navermap-edit-box) > .input-group,
body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page :is(.kakaolink-edit-box, .navermap-edit-box) .input-group-btn {
  display: contents !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page :is(.kakaolink-edit-box, .navermap-edit-box) :is(.kakaolink-key, .navermap-key) {
  width: 100% !important;
  min-width: 0;
  min-height: 38px !important;
  height: 38px !important;
  padding: 0 14px !important;
  transition: none !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page :is(.kakaolink-edit-box, .navermap-edit-box) :is(.kakaolink-key, .navermap-key):focus {
  border-color: var(--cl-green) !important;
  box-shadow: 0 0 0 3px rgba(3, 199, 90, .14) !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .kakaolink-edit-box:not(.hide) + .kakaolink-info,
body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .navermap-edit-box:not(.hide) + .navermap-info {
  display: none !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page :is(.kakaolink-edit-box, .navermap-edit-box) > .error {
  grid-column: 1 / -1;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page :is(.kakaolink-edit-box, .navermap-edit-box) :is(.kakaolink-key-save, .kakaolink-key-cancel, .navermap-key-save, .navermap-key-cancel) {
  width: 100% !important;
  min-width: 0 !important;
  height: 38px !important;
  padding: 0 8px !important;
  font-family: inherit;
  font-size: 13px !important;
  font-weight: 600 !important;
  white-space: nowrap;
  cursor: pointer;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page :is(.kakaolink-edit-box, .navermap-edit-box) :is(.kakaolink-key-cancel, .navermap-key-cancel) {
  position: static !important;
  top: auto !important;
  right: auto !important;
  background: #fff !important;
  border: 1px solid var(--cl-border) !important;
  color: var(--cl-text-sub) !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .msetting-info small.error {
  margin-left: 8px;
  color: var(--cl-danger, #e5484d);
  font-size: 12px;
  line-height: 18px;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .setting-sub-content > ul > li:not(.setting-detail-btn) {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap;
  align-items: center;
  gap: 14px;
  padding: 16px 0 !important;
  padding-right: 0 !important;
  padding-left: 0 !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .setting-sub-content > ul > li:not(.setting-detail-btn):first-child {
  padding-top: 0 !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .kakaolink-setting > li:not(.setting-detail-btn):first-child {
  border-bottom: 1px solid #f2f3f5 !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .setting-sub-content > ul > li:not(.setting-detail-btn):last-child {
  padding-bottom: 0 !important;
}

@media (min-width: 701px) {
  body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .setting-sub-box > .setting-subInfoBox > .setting-sub-title {
    top: -3px;
  }

  body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .setting-sub-box > #view-extlink > .setting-sub-title {
    top: 0;
  }

  body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page #view-extlink .setting-sub-content > ul > li:not(.setting-detail-btn):last-child {
    position: relative;
    top: -5px;
  }
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .setting-sub-content > ul > li > :is(.msetting-detail, .detail-kakaolink, .detail-navermap) {
  flex: 1 1 auto;
  width: auto !important;
  min-width: 0;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page :is(.msetting-info, .kakaolink-info, .navermap-info) {
  display: flex !important;
  align-items: center;
  gap: 14px;
  width: 100% !important;
  min-width: 0;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page :is(.sns-actions, .kakaolink-actions, .navermap-actions) {
  display: inline-flex;
  flex: none;
  align-items: center;
  gap: 24px;
  margin-left: auto;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .sns-actions > .sns-delete,
body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page :is(.kakaolink-actions, .navermap-actions) > :is(.kakaolink-delete, .navermap-delete) {
  display: inline-flex;
  flex: 0 0 30px;
  align-items: center;
  justify-content: center;
  width: 30px !important;
  min-width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0;
  border: 0 !important;
  border-radius: 8px;
  background: transparent;
  color: var(--text-muted, var(--cl-text-muted, #b4b8bf)) !important;
  cursor: pointer;
  transition: none !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page :is(.kakaolink-actions, .navermap-actions) > :is(.kakaolink-delete, .navermap-delete).hide {
  display: none !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .sns-actions > .sns-delete > svg,
body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page :is(.kakaolink-actions, .navermap-actions) > :is(.kakaolink-delete, .navermap-delete) > svg {
  display: block;
  width: 16px !important;
  height: 16px !important;
  margin: 0 !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: none !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .sns-actions > .sns-delete > svg path,
body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page :is(.kakaolink-actions, .navermap-actions) > :is(.kakaolink-delete, .navermap-delete) > svg path {
  fill: none !important;
  stroke: currentColor !important;
  transition: none !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .sns-actions > .sns-delete:hover,
body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .sns-actions > .sns-delete:focus,
body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .sns-actions > .sns-delete:focus-visible,
body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page :is(.kakaolink-actions, .navermap-actions) > :is(.kakaolink-delete, .navermap-delete):hover,
body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page :is(.kakaolink-actions, .navermap-actions) > :is(.kakaolink-delete, .navermap-delete):focus,
body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page :is(.kakaolink-actions, .navermap-actions) > :is(.kakaolink-delete, .navermap-delete):focus-visible {
  background: var(--cl-danger-soft, #fdecee);
  color: #e5484d !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .sns-actions > .sns-delete:is(:hover, :focus, :focus-visible) > svg,
body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .sns-actions > .sns-delete:is(:hover, :focus, :focus-visible) > svg path,
body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page :is(.kakaolink-actions, .navermap-actions) > :is(.kakaolink-delete, .navermap-delete):is(:hover, :focus, :focus-visible) > svg,
body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page :is(.kakaolink-actions, .navermap-actions) > :is(.kakaolink-delete, .navermap-delete):is(:hover, :focus, :focus-visible) > svg path {
  stroke: #e5484d !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .sns-actions > .sns-delete:focus-visible,
body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page :is(.kakaolink-actions, .navermap-actions) > :is(.kakaolink-delete, .navermap-delete):focus-visible {
  outline: 2px solid rgba(229, 72, 77, .24);
  outline-offset: 2px;
  border-radius: 3px;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .kakaolink-setting > li:not(.setting-detail-btn) > .usekakaolinkText {
  flex: 1 1 auto;
  min-width: 0;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .kakaolink-setting > li:not(.setting-detail-btn) > .kakaolink-detail {
  flex: none;
  width: auto !important;
  margin-left: auto;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .kakaolink-setting > li > .usekakaolinkText {
  color: var(--cl-text-muted, #b4b8bf) !important;
  font-size: 13.5px !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .kakaolink-setting > li.is-kakaolink-disabled > label > .kakaolink-use-label-text,
body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .kakaolink-setting > li.is-kakaolink-disabled > .usekakaolinkText {
  opacity: var(--disabled-opacity, .45);
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .kakaolink-setting > li.is-kakaolink-disabled > label > .kakaolink-use-help {
  position: relative;
  z-index: 1;
  opacity: var(--disabled-opacity, .45);
  pointer-events: auto !important;
  cursor: help !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .kakaolink-setting > li.is-kakaolink-disabled .kakaolink-use,
body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .kakaolink-setting > li.is-kakaolink-disabled .kakaolink-use * {
  cursor: not-allowed !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page :is(.msetting-val, .kakaolink-val, .navermap-val) {
  flex: 1 1 auto;
  min-width: 0;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page #view-extlink #extState_instagram {
  display: inline-flex;
  flex: 1 1 auto;
  align-items: center;
  gap: 8px;
  height: 30px;
  min-width: 0;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page #view-extlink #extState_instagram .msetting-val {
  display: inline-flex;
  flex: 0 1 auto;
  align-items: center;
  height: 30px;
  line-height: 30px !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page #view-extlink #extState_instagram .mcpn-cst {
  display: inline-flex;
  align-items: center;
  height: 22px;
  margin: 0;
  padding: 3px 10px;
  box-sizing: border-box;
  border-radius: 999px;
  font-size: 11.5px;
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page #view-extlink .sns-actions,
body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page #view-extlink .sns-actions > .btn-add,
body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page #view-extlink .msetting-info > .btn-add {
  height: 30px;
  align-items: center;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page #view-extlink #extState_instagram .mcpn-cst.expired {
  background: #fdecec;
  color: #e5484d;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page :is(.msetting-val, .kakaolink-val, .navermap-val, .usekakaolinkText, .btn-add) {
  white-space: nowrap;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page :is(#sns-setting, #kakaolink-setting, #navermap-setting) .btn-add,
body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page :is(#sns-setting, #kakaolink-setting, #navermap-setting) .btn-add:hover,
body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page :is(#sns-setting, #kakaolink-setting, #navermap-setting) .btn-add:focus {
  min-height: 0;
  gap: 3px;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  cursor: pointer;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page :is(#sns-setting, #kakaolink-setting, #navermap-setting) .btn-add > svg {
  display: block !important;
  align-self: center;
  flex: 0 0 6px;
  width: 6px !important;
  height: 8px !important;
  margin: 0 !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .txt-line-through {
  text-decoration: line-through;
}

@media (max-width: 700px) {
  body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .setting-sub-box > .setting-subInfoBox {
    flex-direction: column !important;
    align-items: stretch;
    gap: 14px;
    padding: 22px 0 !important;
  }

  body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .setting-sub-box > .setting-subInfoBox > .setting-sub-title {
    flex-basis: auto;
    width: auto !important;
    margin: 0 !important;
    top: 0;
  }

  body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .setting-sub-box > .setting-subInfoBox > .setting-sub-content {
    width: 100% !important;
    max-width: none;
  }

  body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .setting-sub-content > ul > li > label {
    flex: 1 1 auto;
    width: auto !important;
    max-width: none !important;
  }

  body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .setting-sub-content > ul > li:not(.setting-detail-btn) {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 12px;
  }

  body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page :is(#sns-setting, #kakaolink-setting, #navermap-setting) > li:first-child {
    position: relative;
  }

  body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page :is(#sns-setting, #kakaolink-setting, #navermap-setting) > li:first-child > label {
    min-height: 30px;
  }

  body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page :is(#sns-setting, #kakaolink-setting, #navermap-setting) > li:first-child > :is(.msetting-detail, .detail-kakaolink, .detail-navermap) {
    position: static !important;
  }

  body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page :is(#sns-setting, #kakaolink-setting, #navermap-setting) > li:first-child .btn-add {
    position: absolute !important;
    top: 0;
    right: 0;
    margin: 0 !important;
  }

  body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page :is(#sns-setting, #kakaolink-setting, #navermap-setting) > li:first-child :is(.sns-actions, .kakaolink-actions, .navermap-actions) {
    position: absolute !important;
    top: 0;
    right: 0;
    height: 30px;
    min-height: 30px;
    margin: 0 !important;
  }

  body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page :is(#sns-setting, #kakaolink-setting, #navermap-setting) > li:first-child :is(.sns-actions, .kakaolink-actions, .navermap-actions) > .btn-add {
    position: static !important;
  }

  body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .setting-sub-content > ul > li > :is(.msetting-detail, .detail-kakaolink, .detail-navermap) {
    flex: 1 1 100%;
    order: 3;
  }

  body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .kakaolink-setting > li:not(.setting-detail-btn) > .usekakaolinkText {
    flex: 1 1 100%;
    order: 3;
  }

  body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .kakaolink-setting > li:not(.setting-detail-btn) > .kakaolink-detail {
    order: 2;
    margin-left: auto;
  }
}

@media (min-width: 320px) and (max-width: 700px) {
  body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page :is(.kakaolink-edit-box, .navermap-edit-box) {
    grid-template-columns: minmax(0, 1fr) 62px 62px;
  }

  body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page :is(.kakaolink-edit-box, .navermap-edit-box) :is(.kakaolink-key, .navermap-key) {
    grid-column: 1 / -1;
    grid-row: 1;
  }

  body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page :is(.kakaolink-edit-box, .navermap-edit-box) :is(.kakaolink-key-save, .navermap-key-save) {
    grid-column: 2;
    grid-row: 2;
    width: 62px !important;
    min-width: 62px !important;
  }

  body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page :is(.kakaolink-edit-box, .navermap-edit-box) :is(.kakaolink-key-cancel, .navermap-key-cancel) {
    grid-column: 3;
    grid-row: 2;
    width: 62px !important;
    min-width: 62px !important;
  }
}

@media (min-width: 701px) and (max-width: 1200px) {
  body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page :is(#kakaolink-setting, #navermap-setting) > li:first-child.is-key-editing {
    flex-wrap: wrap;
    row-gap: 10px;
  }

  body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page :is(#kakaolink-setting, #navermap-setting) > li:first-child.is-key-editing > label,
  body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page :is(#kakaolink-setting, #navermap-setting) > li:first-child.is-key-editing > :is(.detail-kakaolink, .detail-navermap) {
    flex: 1 1 100%;
    width: 100% !important;
    max-width: none !important;
  }

  body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page :is(.kakaolink-edit-box, .navermap-edit-box) {
    grid-template-columns: minmax(0, 1fr) 62px 62px;
  }
}

@media (min-width: 1201px) {
  body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page :is(#kakaolink-setting, #navermap-setting) > li:first-child > label {
    align-self: flex-start;
  }
}

@media (min-width: 481px) and (max-width: 700px) {
  body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page .setting-sub-box > .setting-subInfoBox {
    padding: 30px 0 !important;
  }
}

@media (min-width: 320px) and (max-width: 767px) {
  body.cl-dashboard-redesign-page #cl-basic-settings-page.cl-external-integration-page :is(#sns-setting, #kakaolink-setting, #navermap-setting) > li:first-child {
    height: auto !important;
  }
}

body.cl-dashboard-redesign-page .modal-dialog.cl-external-integration-delete-modal .modal-footer > .ok-button-dialog {
  background: var(--cl-danger, #e5484d) !important;
  border-color: var(--cl-danger, #e5484d) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .modal-dialog.cl-external-integration-delete-modal .modal-footer > .ok-button-dialog:hover,
body.cl-dashboard-redesign-page .modal-dialog.cl-external-integration-delete-modal .modal-footer > .ok-button-dialog:focus,
body.cl-dashboard-redesign-page .modal-dialog.cl-external-integration-delete-modal .modal-footer > .ok-button-dialog:focus-visible {
  background: #d93f44 !important;
  border-color: #d93f44 !important;
  color: #fff !important;
}

/* 외부 연동: 카카오 JavaScript 키 안내·삭제 */
body.cl-dashboard-redesign-page .flat-modal.cl-kakaolink-modal-wrap {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  overflow: auto !important;
  background: rgba(0, 0, 0, .45) !important;
  z-index: 1000000 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-kakaolink-modal-wrap > .modal-default,
body.cl-dashboard-redesign-page .flat-modal.cl-kakaolink-modal-wrap > .modal-default.in,
body.cl-dashboard-redesign-page .flat-modal.cl-kakaolink-modal-wrap > .modal-default.show {
  position: fixed !important;
  box-sizing: border-box !important;
  inset: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100vw !important;
  height: 100vh !important;
  margin: 0 !important;
  padding: 24px 16px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  background: transparent !important;
  z-index: 1000000 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-kakaolink-delete-modal-wrap > .modal-default,
body.cl-dashboard-redesign-page .flat-modal.cl-kakaolink-delete-modal-wrap > .modal-default.in,
body.cl-dashboard-redesign-page .flat-modal.cl-kakaolink-delete-modal-wrap > .modal-default.show {
  padding: 20px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-kakaolink-delete-modal-wrap .modal-dialog.cl-kakaolink-delete-modal {
  width: min(440px, calc(100vw - 40px)) !important;
  max-width: min(440px, calc(100vw - 40px)) !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-kakaolink-modal-wrap + .modal-backdrop,
body.cl-dashboard-redesign-page .flat-modal.cl-kakaolink-modal-wrap + .modal-backdrop.fade,
body.cl-dashboard-redesign-page .flat-modal.cl-kakaolink-modal-wrap + .modal-backdrop.in {
  display: none !important;
  opacity: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-kakaolink-modal-wrap > .modal-default > .cl-mobile-btn.close {
  display: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-kakaolink-modal-wrap .modal-dialog.cl-kakaolink-modal {
  box-sizing: border-box !important;
  width: min(440px, calc(100vw - 32px)) !important;
  max-width: min(440px, calc(100vw - 32px)) !important;
  margin: 0 auto !important;
  padding: 0 !important;
  border: 0 !important;
  transform: none !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-kakaolink-modal-wrap .modal-dialog.cl-kakaolink-modal .modal-content {
  position: relative !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 36px 28px 28px !important;
  overflow: visible !important;
  background: #fff !important;
  border: 0 !important;
  border-radius: 14px !important;
  box-shadow: 0 24px 64px rgba(20, 24, 32, .26) !important;
  color: var(--cl-text) !important;
  font-family: var(--cl-source-font) !important;
  letter-spacing: 0 !important;
}

@media (min-width: 481px) {
  body.cl-dashboard-redesign-page .flat-modal.cl-kakaolink-delete-modal-wrap .modal-dialog.cl-kakaolink-delete-modal .modal-content {
    padding: 48px 28px 34px !important;
  }
}

@media (max-width: 480px) {
  body.cl-dashboard-redesign-page .flat-modal.cl-kakaolink-delete-modal-wrap .modal-dialog.cl-kakaolink-delete-modal .modal-content {
    padding: 28px 20px 24px !important;
  }
}

body.cl-dashboard-redesign-page .flat-modal.cl-kakaolink-modal-wrap .modal-dialog.cl-kakaolink-modal .modal-body {
  width: 100% !important;
  max-width: none !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  color: var(--cl-text-sub) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 22px !important;
  text-align: center !important;
  word-break: keep-all !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-kakaolink-nokey-modal-wrap > .modal-default .modal-dialog.cl-kakaolink-nokey-modal .modal-body {
  font-size: 14px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-kakaolink-nokey-modal-wrap > .modal-default .modal-dialog.cl-kakaolink-nokey-modal .modal-title {
  margin-bottom: 22px !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-kakaolink-modal-wrap .modal-dialog.cl-kakaolink-modal .modal-title {
  margin: 0 32px 18px !important;
  padding: 0 !important;
  color: var(--cl-text) !important;
  font-size: 21px !important;
  font-weight: 800 !important;
  line-height: 28px !important;
  letter-spacing: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-kakaolink-modal-wrap .modal-dialog.cl-kakaolink-modal :is(.kakaolink-delete-question, .kakaolink-delete-notice) {
  margin: 0 !important;
  padding: 0 !important;
  color: inherit !important;
  font: inherit !important;
  line-height: inherit !important;
  letter-spacing: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-kakaolink-modal-wrap .modal-dialog.cl-kakaolink-modal .modal-footer {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  width: 100% !important;
  max-width: none !important;
  margin-top: 28px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  background: transparent !important;
  border: 0 !important;
  text-align: center !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-kakaolink-modal-wrap .modal-dialog.cl-kakaolink-modal .modal-footer > .btn {
  float: none !important;
  display: flex !important;
  box-sizing: border-box !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  min-height: 46px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  text-align: center !important;
  text-decoration: none !important;
  text-shadow: none !important;
  outline: 0 !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-kakaolink-delete-modal-wrap .modal-dialog.cl-kakaolink-delete-modal .modal-footer > .ok-button-dialog {
  order: 1 !important;
  background: var(--cl-danger, #e5484d) !important;
  border: 1px solid var(--cl-danger, #e5484d) !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-kakaolink-delete-modal-wrap .modal-dialog.cl-kakaolink-delete-modal .modal-footer > .ok-button-dialog:hover,
body.cl-dashboard-redesign-page .flat-modal.cl-kakaolink-delete-modal-wrap .modal-dialog.cl-kakaolink-delete-modal .modal-footer > .ok-button-dialog:focus,
body.cl-dashboard-redesign-page .flat-modal.cl-kakaolink-delete-modal-wrap .modal-dialog.cl-kakaolink-delete-modal .modal-footer > .ok-button-dialog:focus-visible {
  background: #d93f44 !important;
  border-color: #d93f44 !important;
  color: #fff !important;
}

body.cl-dashboard-redesign-page .flat-modal.cl-kakaolink-delete-modal-wrap .modal-dialog.cl-kakaolink-delete-modal .modal-footer > .close-button-dialog {
  order: 2 !important;
  height: 46px !important;
}