.hide {
  display: none !important;
}

.invisible {
  visibility: hidden;
}

#multivariant-campaign-id {
  height: 2.5rem;
}

#standard-campaign-id {
  height: 2.5rem;
}

.font-size-13 {
  font-size: 13px !important;
}

.font-size-14 {
  font-size: 0.4375rem !important;
}

.font-weight-500 {
  font-weight: 500 !important;
}

.font-family-roboto {
  font-family: Roboto;
}

.ht-60-px {
  height: 1.875rem !important;
}

.ht-100-px {
  height: 3.125rem !important;
}

.ht-176px {
  height: 5.5rem !important;
}

.ht-35px {
  height: 35px !important;
}

.ht-50px {
  height: 1.5625rem !important;
}

.ht-52px {
  height: 1.625rem !important;
}

.ht-56px {
  height: 1.75rem !important;
}

.btn-width {
  width: 8.6875rem;
}

.ht-350px {
  height: 10.9375rem;
}

.wd-80px {
  width: 80px;
}

.wd-250px {
  width: 250px;
}

.wd-130px {
  width: 130px !important;
}

.wd-308px {
  width: 9.625rem;
}

.wd-215px {
  width: 6.71875rem;
}

.wd-165px {
  width: 5.15625rem;
}

.wd-164px {
  width: 5.125rem;
}

.ht-100 {
  height: 3.125rem !important;
}

.ht-80 {
  height: 2.5rem !important;
}

.w-100-imp {
  width: 100% !important;
}

.wd-90px {
  width: 90px;
}

.wd-100 {
  width: 100%;
}

.wd-49-p-2 {
  width: 49.2%;
}

.wd-100-imp {
  width: 100% !important;
}

.wd-110px {
  width: 110px;
}

.wd-70 {
  width: 70%;
}

.wd-75 {
  width: 75%;
}

.wd-80 {
  width: 80%;
}

.wd-30 {
  width: 30%;
}

.wd-35 {
  width: 35%;
}

.wd-28 {
  width: 28%;
}

.wd-60 {
  width: 60%;
}

.wd-32 {
  width: 32%;
}

.wd-40 {
  width: 40%;
}

.wd-48 {
  width: 48%;
}

.wd-45 {
  width: 45%;
}

.wd-47 {
  width: 47%;
}

.wd-50 {
  width: 50%;
}

.wd-27 {
  width: 27%;
}

.wd-23 {
  width: 23%;
}

.wd-10 {
  width: 10%;
}

.wd-20 {
  width: 20%;
}

.wd-22 {
  width: 22%;
}

.wd-66 {
  width: 66%;
}

.wd-63 {
  width: 63%;
}

.wd-43 {
  width: 43%;
}

.wd-25 {
  width: 25%;
}

.wd-15 {
  width: 15%;
}

.wd-18 {
  width: 18%;
}

.wd-30 {
  width: 30%;
}

.wd-68 {
  width: 68%;
}

.wd-28 {
  width: 28%;
}

.wd-70 {
  width: 70%;
}

.wd-450px {
  width: 14.0625rem;
}

.wd-73 {
  width: 73%;
}

.mar-lft-8 {
  margin-left: 0.25rem;
}

.mar-lft-12 {
  margin-left: 0.375rem;
}

.mar-lft-60 {
  margin-left: 1.875rem !important;
}

.mar-lft-30 {
  margin-left: 30px;
}

.mar-lft-25 {
  margin-left: 0.78125rem;
}

.mar-lft-24 {
  margin-left: 0.75rem;
}

.mar-rt-60 {
  margin-right: 1.875rem;
}

.mar-rt-neg-10 {
  margin-right: -10px;
}

.mar-rt-neg-20 {
  margin-right: -20px;
}

.pd-rt-30 {
  padding-right: 0.9375rem;
}

.pd-rt-36 {
  padding-right: 1.125rem !important;
}

.pd-rt-15 {
  padding-right: 15px;
}

.pd-rt-14 {
  padding-right: 0.4375rem !important;
}

.pd-rt-60 {
  padding-right: 1.875rem;
}

.mar-rt-20 {
  margin-right: 0.625rem;
}

.mar-rt-22 {
  margin-right: 0.6875rem;
}

.mar-rt-29 {
  margin-right: 0.90625rem !important;
}

.mar-bt-0 {
  margin-bottom: 0px !important;
}

.mar-bt-20 {
  margin-bottom: 0.625rem !important;
}

.mar-bt-24 {
  margin-bottom: 0.75rem !important;
}

.mar-bt-40 {
  margin-bottom: 1.25rem;
}

.mar-bt-30 {
  margin-bottom: 30px;
}

.mar-bt-31 {
  margin-bottom: 0.96875rem;
}

.mar-bt-35 {
  margin-bottom: 1.09375rem;
}

.mar-bt-50 {
  margin-bottom: 50px;
}

.mar-bt-52 {
  margin-bottom: 1.625rem;
}

.mar-bt-67 {
  margin-bottom: 2.09375rem;
}

.mar-bt-16 {
  margin-bottom: 0.5rem !important;
}

.mar-bt-32 {
  margin-bottom: 1rem !important;
}

.mar-tp-70 {
  margin-top: 100px;
}

.mar-tp-80 {
  margin-top: 2.5rem;
}

.mar-tp-100 {
  margin-top: 100px !important;
}

.mar-bt-100 {
  margin-bottom: 100px !important;
}

.pd-tp-100 {
  padding-top: 100px !important;
}

.pd-tp-50 {
  padding-top: 50px !important;
}

.pd-bt-32 {
  padding-bottom: 1rem !important;
}

.pd-bt-38 {
  padding-bottom: 1.1875rem !important;
}

.pd-bt-18 {
  padding-bottom: 0.5625rem !important;
}

.pd-bt-100 {
  padding-bottom: 100px !important;
}

.pd-bt-52 {
  padding-bottom: 1.625rem !important;
}

.pd-bt-54 {
  padding-bottom: 1.6875rem !important;
}

.pd-bt-62 {
  padding-bottom: 1.9375rem !important;
}

.pd-bt-67 {
  padding-bottom: 2.09375rem !important;
}

.pd-bt-50 {
  padding-bottom: 1.5625rem !important;
}

.ht-300px {
  height: 300px !important;
}

.mar-rt-24 {
  margin-right: 0.75rem;
}

.pr-24 {
  padding-right: 0.75rem;
}

.mar-tp-14 {
  margin-top: 0.4375rem !important;
}

.mar-tp-13 {
  margin-top: 0.40625rem;
}

.mar-bt-38 {
  margin-bottom: 1.1875rem;
}

.mar-tp-38 {
  margin-top: 1.1875rem !important;
}

.mar-tp-32 {
  margin-top: 1rem;
}

.mar-tp-33 {
  margin-top: 1.03125rem;
}

.mar-tp-27 {
  margin-top: 0.84375rem;
}

.mar-tp-2 {
  margin-top: 0.0625rem !important;
}

.mar-tp-26 {
  margin-top: 0.8125rem;
}

.mar-tp-28 {
  margin-top: 0.875rem;
}

.mar-tp-22 {
  margin-top: 0.6875rem !important;
}

/*.mar-rt-40 {*/
/*    margin-right: 40px;*/
/*}*/

.mar-tp-40 {
  margin-top: 1.25rem;
}

.mar-tp-60 {
  margin-top: 1.875rem;
}

.mar-tp-62 {
  margin-top: 1.9375rem;
}

.mar-tp-64 {
  margin-top: 2rem;
}

.mar-tp-12 {
  margin-top: 0.375rem;
}

.mar-tp-30 {
  margin-top: 0.9375rem !important;
}

.mar-tp-31 {
  margin-top: 0.96875rem;
}

.mar-tp-35 {
  margin-top: 1.09375rem;
}

.mar-tp-38 {
  margin-top: 1.1875rem;
}

.mar-tp-39 {
  margin-top: 1.125rem;
}

.mar-tp-50 {
  margin-top: 1.5625rem;
}

.mar-tp-52 {
  margin-top: 1.625rem;
}

.mar-tp-54 {
  margin-top: 1.6875rem;
}

.mar-tp-55 {
  margin-top: 1.71875rem;
}

.mar-tp-25 {
  margin-top: 25px;
}

.mar-tp-0 {
  margin-top: 0px !important;
}

.mar-tp-20 {
  margin-top: 0.625rem !important;
}

.mar-tp-23 {
  margin-top: 0.71875rem;
}

.mar-tp-18 {
  margin-top: 0.5625rem;
}

.mar-rt-54 {
  margin-right: 1.6875rem;
}

.mar-rt-52 {
  margin-right: 1.625rem;
}

.mar-rt-50 {
  margin-right: 1.5625rem;
}

.mar-rt-58 {
  margin-right: 1.8125rem !important;
}

.mar-rt-30 {
  margin-right: 0.9375rem;
}

.mar-rt-32 {
  margin-right: 1rem;
}

.mar-rt-34 {
  margin-right: 1.0625rem;
}

.mar-rt-36 {
  margin-right: 1.125rem;
}

.mar-rt-38 {
  margin-right: 1.1875rem !important;
}

.mar-rt-39 {
  margin-right: 1.21875rem;
}

.mar-rt-35 {
  margin-right: 1.09375rem;
}

.mar-rt-0 {
  margin-right: 0px !important;
}

.mar-rt-8 {
  margin-right: 0.25rem;
}

.pd-lft-60 {
  padding-left: 1.875rem;
}

.pd-lft-24 {
  padding-left: 0.75rem;
}

.mar-tp-15 {
  margin-top: 0.46875rem !important;
}

.mar-tp-10 {
  margin-top: 0.3125rem;
}

.mar-tp-8negative {
  margin-top: -0.25rem;
}

.mar-tp-8 {
  margin-top: 0.25rem;
}

.mar-tp-16 {
  margin-top: 0.5rem;
}

.mar-bt-13 {
  margin-bottom: 0.40625rem;
}

.mar-rt-108 {
  margin-right: 3.375rem;
}

.mar-rt-101 {
  margin-right: 3.15625rem !important;
}

.mar-rt-106 {
  margin-right: 3.3125rem !important;
}

.mar-rt-100 {
  margin-right: 3.125rem !important;
}

.mar-rt-16 {
  margin-right: 0.5rem !important;
}

.mar-rt-12 {
  margin-right: 0.375rem;
}

.mar-rt-14 {
  margin-right: 0.4375rem;
}

.mar-rt-142 {
  margin-right: 4.4375rem;
}

.mar-rt-40 {
  margin-right: 1.25rem !important;
}

.mar-rt-46 {
  margin-right: 1.4375rem !important;
}

.mar-tp-20 {
  margin-top: 0.625rem;
}

.mar-tp-24 {
  margin-top: 0.75rem;
}

.mar-tp-52 {
  margin-top: 1.625rem;
}

.mar-tp-7 {
  margin-top: 0.21875rem;
}

.mar-bt-10 {
  margin-bottom: 0.3125rem;
}

.mar-rt-26 {
  margin-right: 26px;
}

.pd-tp-24 {
  padding-top: 0.75rem !important;
}

.pd-tp-30 {
  padding-top: 30px !important;
}

.pd-tp-32 {
  padding-top: 1rem !important;
}

.pd-bt-48 {
  padding-bottom: 1.5rem !important;
}

.pd-tp-0 {
  padding-top: 0 !important;
}

.mar-tp-36 {
  margin-top: 1.125rem;
}

.pd-tp-50 {
  padding-top: 1.5625rem !important;
}

.pd-tp-54 {
  padding-top: 1.6875rem !important;
}

.pd-bt-70 {
  padding-bottom: 70px !important;
}

.pd-50px {
  padding: 50px !important;
}

.font-size-16 {
  font-size: 0.5rem !important;
}

.font-size-17 {
  font-size: 0.53125rem !important;
}

.font-size-18 {
  font-size: 0.5625rem !important;
  line-height: 0.5625rem;
}

.pd-0 {
  padding: 0px !important;
}

.mar-lft-3 {
  margin-left: 3%;
}

.mar-lft-16 {
  margin-left: 0.5rem;
}

.mar-rt-3 {
  margin-right: 3%;
}

.max-wd-none {
  max-width: none !important;
}

.max-wd-210 {
  width: 6.5625rem !important;
}

.box-shadow-none:hover {
  box-shadow: none !important;
}

.align-items-baseline {
  align-items: baseline !important;
}

.align-items-flexend {
  align-items: flex-end !important;
}

.align-items-flexstart {
  align-items: flex-start !important;
}

.card {
  border-radius: 0.375rem !important;
  background-color: #ffffff !important;
  border: none !important;
}

.responsive-image {
  width: 100%;
  height: auto;
}

.campaign-default-page-communication-flex-card {
  display: flex;
  flex-direction: row !important;
  /* flex-wrap: wrap; */
  align-items: center;
  justify-content: space-between;
  padding: 1.09375rem 2.5625rem 1.09375rem 2.65625rem;
}

.flex-45 {
  width: 45%;
}

.campaign-default-page-communication-flex-card h3 {
  font-family: Roboto;
  font-size: 22px;
  font-weight: 500;
  color: #000000;
  line-height: 22px;
}

.campaign-default-page-communication-flex-card p {
  font-family: Roboto;
  font-size: 18px;
  font-weight: 400;
  color: #000000;
  line-height: 20px;
  margin-top: 15px;
}

.campaign-default-page-channel-card {
  padding: 0.625rem;
  margin-right: 0.6875rem;
  width: 13.6875rem;
}

.campaign-default-page-channel-card img {
  width: 4.25rem;
  height: 5.0625rem;
}

.campaign-default-page-channel-card h3 {
  font-family: Roboto;
  /* font-size: 16px; */
  font-weight: 500;
  color: #000000;
  /* line-height: 20px; */
  margin-top: 1.125rem;
}

.campaign-default-page-channel-card p {
  font-family: Roboto;
  /* font-size: 14px; */
  font-weight: 400;
  color: #000000;
  /* line-height: 15px; */
  margin-top: 0.71875rem;
}

.channels-flex-container {
  /* margin-top: 24px; */
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: left;
  gap: 0.75rem;
  width: 68.2%;
}

.channel-card {
  background-color: #ffffff;
  border-radius: 0.375rem;
  max-height: 6.25rem;
  min-width: 6.25rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
  text-decoration: none;
  /* margin-left: 24px;
    margin-bottom: 24px; */
}

.channel-card:hover {
  box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.16);
}

.channel-card.disabled {
  pointer-events: none;
  cursor: default;
  opacity: 0.4;
}

.disabled {
  pointer-events: none;
  cursor: default;
  opacity: 0.4;
}

.channel-card > img {
  max-width: 2.1875rem;
  max-height: 2.1875rem;
}

.channel-card > p {
  font-family: Roboto;
  font-size: 0.625rem;
  font-weight: 400;
  color: #000000;
  margin-top: 0.25rem;
}

.campaign-list-card {
  /*padding-top: 0.5625rem;*/
  padding-bottom: 0.625rem;
}

.campaign-status-tabs-flex-container {
  display: flex;
  flex-direction: row;
  align-items: center;
  /*padding-left: 15px;*/
  /*padding-right: 15px;*/
  /*padding-top: 0.5625rem;*/
  padding: 0 0.46875rem;
}

.tab-btn {
  background-color: #ffffff;
  border: none;
  outline: none;
  font-family: Roboto;
  font-weight: 500;
  font-size: 0.5rem;
  line-height: 1.39;
  color: #000000;
  padding: 0.5625rem 0;
  margin-right: 1.25rem;
  cursor: pointer;
  display: flex;
  flex-direction: row;
  align-items: center;
}

.tab-btn:last-child {
  margin-right: 0px;
}

.tab-btn.active {
  font-size: 0.5625rem;
  color: #1b54d9;
  border-bottom: 0.0625rem solid #1b54d9;
}

.campaign-table-container {
  margin-bottom: 0.625rem;
  min-width: 100%;
  /*max-width: 700px;*/
  width: auto;
  overflow-x: auto !important;
}

.multivariant-campaign-table-container {
  margin-bottom: 0.625rem;
  min-width: 100%;
  /*max-width: 700px;*/
  width: auto;
  overflow-x: auto !important;
}

.campaign-table .multi-campaign-table {
  border-collapse: collapse;
  width: 100%;
  /*white-space: nowrap;*/
  table-layout: auto;
}

.campaign-table thead,
.multi-campaign-table thead {
  font-family: Roboto;
  font-weight: 500;
  font-size: 13px;
  color: #263238;
}

.campaign-table tbody,
.multi-campaign-table tbody {
  font-family: Roboto;
  font-weight: 400;
  font-size: 13px;
  color: #263238;
}

.campaign-table tr,
.multi-campaign-table tr {
  border-bottom: 0.03125rem solid rgba(0, 0, 0, 0.1);
}

.campaign-table thead tr:first-child,
.multi-campaign-table thead tr:first-child {
  border-bottom: none;
  background-color: #f5f5f5;
}

.campaign-table th,
.multi-campaign-table th {
  text-align: left;
  padding: 0.71875rem 0.3125rem;
  height: 2.5rem;
  font-size: 0.5rem;
  color: #263238;
}

.campaign-table td,
.multi-campaign-table td {
  text-align: left !important;
  padding: 0.375rem 0.3125rem;
  height: 2.5rem;
  color: #263238;
  font-size: 0.5625rem;

  white-space: nowrap;
}

.campaign-table th:first-child,
.multi-campaign-table th:first-child {
  padding-top: 4px;
  padding-left: 15px;
}

.campaign-table th:last-child,
.multi-campaign-table th:last-child {
  /*padding-right: 15px;*/
}

.campaign-table td:first-child,
.multi-campaign-table td:first-child {
  padding-top: 0px;
  padding-bottom: 16px;
  padding-left: 15px;
}

.campaign-table td:last-child,
.multi-campaign-table td:last-child {
  /*padding-right: 15px;*/
}

.medium-font {
  font-weight: 500 !important;
}

.time-string {
  font-family: Roboto;
  font-size: 0.4375rem;
  font-weight: 400;
  opacity: 0.5;
  margin-left: 0.1875rem;
}

.status-badge {
  border-radius: 1.0625rem;
  padding: 0.15625rem 0.3125rem;
  font-family: Roboto;
  font-size: 0.4375rem;
  color: #263238;
  font-weight: 500;
  width: fit-content;
  text-align: center;
  white-space: nowrap;
}

.status-badge.Running {
  background-color: #b1d8ff;
}

.status-badge.Live {
  background-color: #b1d8ff;
}

.status-badge.Recurring {
  background-color: #b1d8ff;
}

.status-badge.Active {
  background-color: #b1d8ff;
}

.status-badge.Suspended {
  background-color: #ff9248;
}

.status-badge.Scheduled {
  background-color: #ffc43e;
}

.status-badge.Completed {
  background-color: #a0dd74;
}

.status-badge.ACTIVE {
  background-color: #a0dd74;
}

.status-badge.Draft {
  background-color: #ededed;
}

.status-badge.Stopped {
  background-color: #ff8d7e;
}

/* Approval Badge Styles for RCS Templates */
.approval-badge {
  display: inline-block;
  padding: 0.15625rem 0.46875rem;
  border-radius: 0.75rem;
  font-size: 0.4375rem;
  font-weight: 500;
  text-align: center;
  min-width: 2.5rem;
  font-family: Roboto;
  white-space: nowrap;
}

/* Approved - Green */
.approval-badge.APPROVED {
  background-color: #D4EDDA;
  color: #155724;
}

/* Pending - Yellow */
.approval-badge.PENDING {
  background-color: #FFF3CD;
  color: #856404;
}

/* Rejected - Red */
.approval-badge.REJECTED {
  background-color: #F8D7DA;
  color: #721C24;
}

.status-badge.Paused {
  background-color: #ff8d7e;
}

.status-badge.Hold {
  background-color: #fffd8d;
}

.status-badge.Inactive {
  background-color: #ff8d7e;
}

.status-badge.Deleted {
  background-color: #ff8d7e;
}

.checked-record {
  background-color: #f6f8fe;
}

.pagination-container {
  display: flex;
  flex-direction: row-reverse;
  align-items: center;
  font-family: Roboto;
  font-weight: 400;
  font-size: 0.5rem;
  bottom: 0.25rem;
  margin-right: 0.3125rem;
  margin-left: auto;
}

.pagination-container img {
  height: 0.75rem;
  width: 0.75rem;
}

.pagination-container > div > button {
  font-family: Roboto;
  font-weight: 400;
  /*font-size: 23px;*/
  background-color: #ffffff;
  border: none;
  cursor: pointer;
  /*padding-top: 6px;*/
  border-radius: 50%;
}

.pagination-container > div > button:hover {
  background-color: #f5f5f5;
}

.pagination-container > div > button:disabled:hover {
  background-color: #ffffff;
  cursor: not-allowed;
}

.pagination-container > div > button:disabled > img {
  opacity: 0.2;
}

.pagination-container > select,
.pagination-container > span {
  font-family: Roboto;
  font-weight: 400;
  font-size: 0.5rem;
  margin-right: 20px;
}

.pagination-container > select {
  width: 80px;
  height: 28px;
  border-radius: 4px;
  border: 0.03125rem solid #919eab;
  background: linear-gradient(90deg, #ffffff 50%, #e3e7ea 50%);
}

.rotate-180-deg {
  transform: rotate(180deg);
}

.steps-flex-container {
  display: flex !important;
  flex-direction: row !important;
  align-items: center;
  min-height: 2.5rem;
  max-height: 2.5rem;
  /* padding-top: 28px;
    padding-bottom: 28px; */
  padding-left: 0.625rem;
  padding-right: 0.625rem;
  font-family: Roboto;
  font-size: 0.5625rem;
  font-weight: 500;
}

.steps-arrow {
  opacity: 50%;
  margin-right: 1.1875rem;
  margin-left: 0.46875rem;
  height: 0.75rem;
  width: 0.75rem;
}

.step {
  min-height: 2.5rem;
  max-height: 2.5rem;
  display: flex;
  flex-direction: row;
  align-items: center;
  color: #808080;
  border-bottom: 0.09375rem solid transparent;
}

.steps-flex-container > .step.active {
  border-bottom: 0.09375rem solid #1b54d9;
  color: #000000;
  cursor: pointer !important;
}

.steps-flex-container > .step.completed {
  color: #000000;
  cursor: pointer !important;
}

.step--check {
  margin-left: 0.46875rem;
  height: 0.5626rem;
  width: 0.5626rem;
}

.steps-flex-container > .step--check.checked {
  visibility: visible;
}

.form-card {
}

.card-header {
  width: 100%;
  height: 1.875rem;
  display: flex;
  align-items: center;
  padding-left: 0.625rem !important;
  padding-right: 0.625rem !important;
  border-bottom: 0.0625rem solid #f5f5f5 !important;
  font-family: Roboto;
  font-size: 0.5625rem;
  font-weight: 500;
  color: #000000 !important;
  background-color: white !important;
}

.card-body {
  /*padding-left: 20px;*/
  /*padding-right: 20px;*/
  /*padding-top: 40px;*/
  /*padding-bottom: 40px;*/
  padding: 0 0.625rem 1.09375rem 0.625rem !important;
}

.btn {
  font-family: Roboto !important;
  font-size: 0.5625rem !important;
  font-weight: 500 !important;
  padding: 0.3125rem 0.5rem !important;
  border-radius: 0.25rem !important;
  background-color: #ffffff !important;
  outline: none !important;
  cursor: pointer;
  line-height: 0.75rem;
}

.btn-next {
  color: #1b54d9 !important;
  border: 0.03125rem solid #1b54d9 !important;
}

.btn-back {
  color: #1b54d9 !important;
  border: none !important;
  margin-right: 0.3125rem;
}

.btn-back:hover {
  background-color: #e6e6e6;
}

.row--flex {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
}

.column--flex {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.625rem;
}

.justify-space-between {
  justify-content: space-between;
}

.justify-center {
  justify-content: center;
}

.justify-flex-end {
  justify-content: flex-end;
}

.justify-space-around {
  justify-content: space-around;
}

.align-items-flex-start {
  align-items: flex-start;
}

.flex-no-wrap {
  flex-wrap: nowrap;
}

.align-items-flex-start {
  align-items: flex-start !important;
}

.form-field {
  max-width: 14.53125rem;
  line-height: normal;
}

.form-field > h3 {
  font-family: Roboto;
  font-size: 14px;
  font-weight: 500;
  color: #000000;
}

.form-label {
  font-family: Roboto;
  font-size: 0.5rem;
  font-weight: 500;
  color: #263238;
  display: inline-block;
  height: 0.6525rem;
}

.light-shade-black {
  color: #404040;
  font-weight: 400;
}

.form-textfield {
  height: 1.625rem;
  font-family: Roboto;
  font-size: 0.5rem;
  font-weight: 400;
  color: #000000;
  border: 0.03125rem solid #bebebe;
  border-radius: 4px;
  outline: none;
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  /*margin-top: 0.3125rem;*/
}

.form-textfield:disabled {
  background-color: #eeeeee !important;
}

.form-textarea {
  height: 1.625rem;
  font-family: Roboto;
  font-size: 0.5rem;
  font-weight: 400;
  color: #455a64;
  border: 0.03125rem solid #bebebe;
  border-radius: 4px;
  outline: none;
  resize: none;
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  /*margin-top: 10px;*/
  scrollbar-color: #afafb0 transparent;
  scrollbar-width: thin;
}

.form-textfield-description {
  font-family: Roboto;
  font-size: 0.4375rem;
  font-weight: 400;
  color: rgb(0 0 0 / 50%);
}

.preview-flex-container {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}

.form-section {
  flex: 60%;
  margin-right: 24px;
}

.preview-section {
  flex: 30%;
}

/* Drop area overlay styles */

.rich-content-card > .card-body,
.popup-image-card > .card-body,
.fullscreen-image-card > .card-body,
.notificationbar-image-card > .card-body,
.web-push-message-card > .card-body,
.recipient-card > .card-body {
  position: relative;
}

.overlay {
  position: absolute;
  display: none;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.425);
  z-index: 2;
  cursor: pointer;
}

.overlay-text {
  font-family: Roboto;
  font-weight: 500;
  position: absolute;
  top: 50%;
  left: 50%;
  font-size: 20px;
  color: white;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
}

.drag-area {
  border: 0.03125rem dashed #dbdbdb;
  /*height: 50px;*/
  border-radius: 0.125rem;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  /*margin-bottom: 14px;*/
}

.drag-area.active {
  border: 0.03125rem dashed #000000;
  /*display: none;*/
}

.file-uploaded {
  background-color: #f5f5f5;
  display: flex;
  align-items: center;
  justify-content: center;
}

.file-uploaded img {
  width: 2.625rem;
  height: 2.15625rem;
}

.drag-area p {
  font-family: Roboto;
  font-size: 0.5rem;
  font-weight: 500;
  color: #000000;
}

.drag-area button {
  border: none;
  outline: none;
  background: #ffffff;
  font-family: Roboto;
  font-size: 0.5rem;
  font-weight: 500;
  color: #1b54d9;
  cursor: pointer;
  text-decoration: underline;
}

.drag-area img {
  margin-right: 0.5rem;
  height: 0.75rem;
  width: 0.75rem;
}

.img-help,
.file-help {
  font-family: Roboto;
  font-size: 0.4375rem;
  font-weight: 400;
  color: #7f7f7f;
}

.img-upload-card,
.file-upload-card {
  display: flex;
  flex-direction: row;
  align-items: center;
  border-radius: 4px;
  background-color: #f5f5f5;
  padding: 0.625rem;
  margin-top: 0.75rem;
  /*margin-top: 40px;*/
}

.upload-check {
  margin-right: 0.25rem;
  height: 0.75rem;
  width: 0.75rem;
}

.delete-file {
  height: 0.75rem;
  width: 0.75rem;
}

.img-info,
.file-info {
  display: flex;
  flex-direction: column;
  line-height: 18px;
  flex: 50%;
  margin-right: 10px;
}

.img-name-size,
.file-name-size {
  font-family: Roboto;
  font-size: 0.5rem;
  font-weight: 500;
  color: #000000;
}

.upload-size-percent,
#imgSize,
#fileSize {
  font-family: Roboto;
  font-size: 0.5rem;
  font-weight: 400;
  color: #7e7e7e;
}

/* Progress bar styles */

#myProgress {
  width: 100%;
  background-color: #ddd;
  margin-top: 5px;
}

#myBar {
  width: 0%;
  height: 4px;
  background-color: #1b54d9;
  text-align: center;
  line-height: 30px;
  color: white;
}

.delete-img {
  cursor: pointer;
}

.btn-action {
  color: #1b54d9 !important;
  border: 0.03125rem solid #1b54d9 !important;
  border-radius: 0.125rem !important;
  font-size: 0.5rem !important;
}

.switch {
  position: relative;
  display: inline-block;
  width: 1.09375rem;
  height: 0.625rem;
  border: 0.0625rem solid #000000;
  border-radius: 0.375rem;
}

.switch.checked {
  border: 0.0625rem solid #02b964;
}

.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ffffff;
  -webkit-transition: 0.4s;
  transition: 0.4s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 0.3125rem;
  width: 0.3125rem;
  left: 0.125rem;
  bottom: 0.09375rem;
  background-color: #ffffff;
  -webkit-transition: 0.4s;
  transition: 0.4s;
}

input:checked + .slider:before {
  background-color: #02b964;
}

input:focus + .slider {
  box-shadow: 0 0 0.03125rem #2196f3;
}

input:checked + .slider:before {
  -webkit-transform: translateX(0.4375rem);
  -ms-transform: translateX(0.4375rem);
  transform: translateX(0.4375rem);
}

/* Rounded sliders */

.slider.round {
  border-radius: 1.0625rem;
}

.slider.round:before {
  border-radius: 50%;
  background-color: #000000;
}

.add-event-btn {
}

.switch-text {
  font-family: Roboto;
  font-size: 0.5rem;
  font-weight: 500;
  color: #000000;
  margin-left: 10px;
  line-height: 22px;
}

.attribute-event-filter {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  padding: 8px 18px;
  font-family: Roboto;
  font-size: 12px;
  color: #000000;
  font-weight: 400;
  background-color: #e6e6eb;
  border: 0.03125rem solid #e2e2e4;
  border-radius: 20px;
  margin-top: 18px;
  margin-right: 24px;
}

.attribute-event-filter > p {
  margin-right: 10px;
}

.attribute-event-filter > img {
  cursor: pointer;
}

.date-picker {
  background-image: url("../images/icons/calendar.svg");
  background-position: 90% 50%;
  background-repeat: no-repeat;
  background-size: 0.75rem;
}

#recurrStartDate,
#recurrStartTime {
  background-position: 95% 50%;
}

.time-picker {
  background-image: url("../images/icons/clock.svg");
  background-position: 90% 50%;
  background-repeat: no-repeat;
  background-size: 0.75rem;
}

.date-range-picker {
  border: none;
  padding-left: 0.375rem;
  padding-right: 0.3125rem;
  height: 100%;
  border-right: 0.03125rem solid #bebebe;
  display: flex;
  align-items: center;
  margin-right: 0.3125rem;
  outline: none !important;
  width: 100%;
  cursor: pointer;
  font-size: 0.5rem;
}

.date-range-picker:hover {
  background-color: #f5f5f5;
}

input[type="color"] {
  -webkit-appearance: none;
  width: 0.9375rem;
  height: 0.9375rem !important;
  border: 0;
  border-radius: 5px;
  padding: 0;
  overflow: hidden;
  box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1);
  float: right;
}

input[type="color"]::-webkit-color-swatch-wrapper {
  padding: 0;
}

input[type="color"]::-webkit-color-swatch {
  border: none;
}

.color-input-container {
  width: 100%;
  height: 1.5625rem;
  border: 0.03125rem solid #bebebe;
  border-radius: 5px;
  /* background-color: #ffffff; */
  padding-top: 0.375rem !important;
  padding-left: 0.625rem;
  padding-right: 0.625rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-bottom: 0.375rem;
}

.color-code {
  float: left;
  font-family: Roboto;
  font-size: 0.4375rem;
  font-weight: 400;
  color: #000000;
  display: flex;
  flex-direction: row;
  align-items: center;
}

.color-code > img {
  margin-top: -2px;
  margin-right: 0.3125rem;
  width: 0.9375rem;
  height: 0.9375rem;
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type="number"] {
  -moz-appearance: textfield;
}

.contact-channels-flex-container {
  display: flex;
  flex-direction: row;
}

.contact-channel-card {
  display: flex;
  flex-direction: row;
  align-items: center;
  border: 0.03125rem solid #bfbfbf;
  border-radius: 4px;
  max-width: 152px;
  min-width: 152px;
  height: 45px;
  padding-left: 15px;
  padding-right: 15px;
  font-family: Roboto;
  font-size: 14px;
  font-weight: 400;
  color: #000000;
  margin-right: 16px;
  cursor: default;
}

.contact-channel-card > img {
  margin-right: 20px;
}

.download-sample-file-link {
  display: flex;
  flex-direction: row;
  align-items: center;
  font-family: Roboto;
  font-size: 13px;
  font-weight: 400;
  color: #455a64;
  text-decoration: none;
  float: right;
}

.download-sample-file-link > img {
  margin-right: 10px;
  width: 12%;
  height: auto;
}

#editor {
  height: 100%;
  border: 0.03125rem solid #bfbfbf;
  border-radius: 4px;
}

.mapping-row {
  font-family: Roboto;
  background-color: #f5f5f5;
  border: 0.03125rem solid #cccccc;
  border-radius: 12px;
  padding: 25px;
}

.attribute-name {
  font-family: Roboto;
  font-size: 14px;
  font-weight: 500;
  color: #263238;
}

.attribute-values {
  font-family: Roboto;
  font-size: 13px;
  font-weight: 400;
  color: #000000;
}

.mapping-row-select {
  height: 42px !important;
  margin-top: 0px !important;
  border: 0.03125rem solid #cccccc !important;
  /*  box-shadow: 0 -5px 5px -5px rgb(0 0 0 / 25%),
               -5px 0 5px -5px rgb(0 0 0 / 25%),
               5px 0 5px -5px rgb(0 0 0 / 25%);
     box-shadow: 0px 8px 16px 0px rgb(0 0 0 / 25%) !important; */
  font-size: 13px !important;
}

.mapping-row-select.toggle {
  border-bottom-left-radius: 0px;
  border-bottom-right-radius: 0px;
}

.mapping-row-select .selectBtn {
  padding: 11px 20px !important;
}

.mapping-row-select .selectDropdown {
  width: 101% !important;
  margin-left: -0.03125rem !important;
  margin-top: 0.03125rem !important;
  border-radius: 0 0 4px 4px !important;
  box-shadow: 0 5px 5px -5px rgb(0 0 0 / 25%), -5px 0 5px -5px rgb(0 0 0 / 25%),
    5px 0 5px -5px rgb(0 0 0 / 25%) !important;
  box-shadow: 0px 5px 5px 0px rgb(0 0 0 / 25%) !important;
  border: 0.03125rem solid #cccccc !important;
  border-top: none !important;
}

.mapping-row-select .selectDropdown .option {
  padding: 11px 20px !important;
}

.create-attribute-form {
  background-color: #ffffff;
  gap: 5px;
  border: 0.5px solid #cccccc;
  border-radius: 6px;
  padding: 15px;
}

.min-wd-217px {
  min-width: 217px !important;
}

.min-wd-250px {
  min-width: 250px !important;
}

.wd-250px {
  width: 7.8125rem !important;
}

.mapping-row-textfield {
  min-width: 217px !important;
  height: 42px !important;
  font-family: Roboto;
  font-weight: 400;
  font-size: 13px;
  border: 0.03125rem solid #cccccc !important;
}

.base-table-container {
  margin-top: 15px;
  width: 100%;
  margin-bottom: 20px;
  min-width: 100%;
  max-width: 700px;
  width: auto;
  overflow-x: auto !important;
}

.contact-table-container {
  margin-top: 15px;
  width: 100%;
  margin-bottom: 20px;
  min-width: 100%;
  max-width: 700px;
  width: auto;
  overflow-x: auto !important;
}

.base-table {
  border-collapse: collapse;
  width: 100%;
  white-space: nowrap;
  table-layout: auto;
}

.base-table thead {
  font-family: Roboto;
  font-weight: 500;
  font-size: 13px;
  color: #263238;
}

.base-table tbody {
  font-family: Roboto;
  font-weight: 400;
  font-size: 13px;
  color: #263238;
}

.base-table tr {
  border-bottom: 0.03125rem solid #cfd8dc;
}

.base-table thead tr:first-child {
  border-bottom: none;
  background-color: #f5f5f5;
}

.base-table th {
  text-align: left;
  padding: 23px 10px;
}

.base-table td {
  text-align: left;
  padding: 23px 10px;
}

.base-table th:first-child {
  padding-left: 20px;
}

.base-table td:first-child {
  padding-left: 20px;
}

.base-table th:last-child {
  padding-right: 20px;
}

.base-table td:last-child {
  padding-right: 20px;
}

.base-table-container > .base-table th:first-child {
  padding-top: 4px;
  padding-left: 20px;
}

.base-table-container > .base-table th:last-child {
  padding-right: 20px;
}

.base-table-container > .base-table td:first-child {
  padding-top: 0px;
  padding-bottom: 16px;
  padding-left: 20px;
}

.base-table-container > .base-table td:last-child {
  padding-right: 20px;
}

.mar-lt-20px {
  margin-left: 20px;
}

.mar-lt-auto {
  margin-left: auto;
}

.pd-lt-24 {
  padding-left: 0.75rem !important;
}

.pd-lt-7 {
  padding-left: 0.21875rem;
}

.pd-lt-rt-0 {
  padding-left: 0px !important;
  padding-right: 0px !important;
}

.pd-lt-rt-20 {
  padding-left: 0.625rem !important;
  padding-right: 0.625rem !important;
}

.pd-bt-0 {
  padding-bottom: 0rem !important;
}

.pd-bt-20 {
  padding-bottom: 0.625rem !important;
}

.mar-bt-25 {
  margin-bottom: 0.78125rem !important;
}

.pd-tp-20 {
  padding-top: 0.625rem !important;
}

.pd-tp-10 {
  padding-top: 0.3125rem !important;
}

.pd-tp-12 {
  padding-top: 0.375rem !important;
}

.ht-42px {
  height: 42px !important;
}

.ht-45px {
  height: 1.40625rem;
}

.ht-40px {
  height: 1.25rem !important;
}

.wd-140px {
  width: 140px !important;
}

.wd-100px {
  width: 3.125rem;
}

.wd-100px {
  width: 3.125rem;
}

.wd-150px {
  width: 4.6875rem;
}

.search-bar {
  height: 1.75rem;
  background-color: #f5f5f5;
  font-family: Roboto;
  font-weight: 400;
  font-size: 0.5rem;
  color: #000000;
  border-radius: 0.375rem;
  outline: none;
  border: 0.03125rem solid #ffffff;
  background-image: url("../images/icons/search.svg");
  background-position: 3% 50%;
  background-repeat: no-repeat;
  padding-left: 1.25rem;
  padding-right: 0.625rem;
  margin-left: 0.625rem;
  background-size: 0.75rem;
}

.contact-tabs-flex-container {
  display: flex;
  flex-direction: row;
  /*align-items: center;*/
  padding-right: 1.0625rem;
  border-bottom: 0.03125rem solid #e0e0e0;
}

.contact-tab-btn {
  min-width: 9.125rem;
  height: 1.875rem;
  background-color: #f8f8f8;
  border: none;
  outline: none;
  font-family: Roboto;
  font-weight: 500;
  font-size: 0.5625rem;
  color: #000000;
  padding: 0.625rem;
  /*padding-top: 0.4rem;*/
  cursor: pointer;
  display: flex;
  flex-direction: row;
  align-items: center;
  border-left: 0.03125rem solid #e0e0e0;
  border-right: 0.03125rem solid #e0e0e0;
}

.contact-tab-btn:first-child {
  border-left: none !important;
  border-right: none !important;
}

.contact-tab-btn:nth-child(3) {
  border-left: none !important;
}

.contact-tab-btn:disabled {
  cursor: not-allowed;
}

.contact-tab-btn.active {
  background-color: #ffffff;
  /*font-size: 13px;*/
  color: #1b54d9;
}

.contact-tab-btn:first-child {
  border-top: solid 0.03125rem #e0e0e0;
}

.contact-tab-btn:nth-child(2) {
  border-top: solid 0.03125rem #e0e0e0;
  border-top-right-radius: 12px;
}

.centered-cell {
  padding-left: 40px !important;
  padding-right: 40px !important;
  text-align: center !important;
}

.add-new-option {
  color: #1b54d9 !important;
}

.error-input {
  border: 0.03125rem solid #cf3636 !important;
}

.contact-list-card {
  padding-bottom: 20px;
}

.list-details-table td {
  padding: 22.5px 10px;
}

.tab-close-btn {
  /* position:fixed; */
  width: 130px;
  height: 35px;
  font-family: Roboto;
  font-size: 14px;
  font-weight: 500;
  color: #ffffff;
  background-color: #1b54d9;
  padding: 10px 24px;
  border: none;
  outline: none;
  border-radius: 8px;
  cursor: pointer;
}

.list-table th:first-child {
  padding-top: 0px;
  padding-left: 15px;
}

.list-table td:first-child {
  padding-top: 0px;
  padding-bottom: 0px;
  padding-left: 15px;
}

.list-table th:nth-child(2) {
  /*padding-top: 4px;*/
  /*padding-left: 0px;*/
}

.list-table td:nth-child(2) label {
  /*padding-top: 0px;*/
  padding-bottom: 0.5rem;
  /*padding-left: 0px;*/
}

.sublist-record {
  background-color: #f5f5f5;
}

.sublist-record td {
  padding: 3px 10px;
}

.list-name-filter-flex-container {
  border: 0.03125rem solid #bebebe;
  border-radius: 4px;
  padding: 0 20px 20px 20px;
}

.list-name-filter {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  padding: 0.66rem 0.25rem;
  font-family: Roboto;
  font-size: 0.4375rem;
  color: #000000;
  font-weight: 400;
  background-color: rgb(248 248 248);
  border: 0.03125rem solid rgb(190 190 190);
  border-radius: 0.78125rem;
  margin-top: 0.625rem;
  margin-right: 0.3125rem;
  width: 4.90625rem;
  height: 1.25rem;
}

.list-name-filter > p {
  /* margin-right: 0.46875rem; */
  margin-left: 0.625rem;
}

.list-name-filter > img {
  cursor: pointer;
  /* margin-right:0.5rem; */
  width: 0.4375rem;
  height: 0.4375rem;
}

.selected-list-count {
  font-family: Roboto;
  font-size: 12px;
  font-weight: 400;
  color: #678898;
}

.code-editor {
  border-radius: 12px !important;
  /*min-height:600px;*/
}

.drag-area.error-input {
  border: 0.03125rem solid #cf3636 !important;
}

.campaign-details-card {
  background-color: #e1e2e3;
  border-radius: 16px;
  min-height: 640px;
  margin-top: 45px;
  padding: 40px;
  font-family: Roboto;
}

.campaign-details {
  font-size: 14px;
  line-height: 30px;
}

#messageDetails {
  font-family: Roboto;
  font-size: 0.5rem;
  font-weight: 400;
  color: #678898;
}

.text-box-width-656 {
  width: 20.5rem;
  height: 1.625rem;
}

.text-box-width-307 {
  width: 9.59375rem;
}

.mar-tp-78 {
  margin-top: 2.4375rem;
}

.email-preview-back > a {
  display: flex;
  flex-direction: row;
  /*align-items: flex-end;*/
  text-decoration: none;
  font-family: Roboto;
  font-size: 0.5rem;
  color: #263238;
  text-align: left;
}

.email-preview-back > a:hover {
  color: #1b54d9;
}

.justify-content-between {
  justify-content: space-between;
}

.mar-rt-5 {
  margin-right: 5px;
}

.email-preview-back > a:first-child {
  border-right: 0.03125rem solid #707070;
  padding-right: 10px;
}

.email-preview-back > a:last-child {
  margin-left: 10px;
}

.email-preview-back img {
  height: 0.625rem;
  width: 0.625rem;
}

/*@media only screen and (min-width: 1921px) and (max-width: 2500px){*/
/*    .customer-support-information {*/
/*        padding: 1rem 1.09rem 0.1875rem 1.09rem;*/
/*    }*/

/*    .customer-support-information > img {*/
/*        height: 3.66rem;*/
/*    }*/
/*}*/

.side-nav-link:hover {
  color: #000000;
}

.side-nav-link.active:hover {
  color: white;
}

#defineComponent {
  background: white;
  border-radius: 0.375rem;
}

.std-text-box-width {
  width: 13.4375rem;
}

.std-text-box-width-1 {
  width: 14.53125rem;
}

.std-text-box-width-r {
  width: 13.4375rem;
}

.std-text-box-width-r-1 {
  width: 14.5625rem;
}

.wid {
  width: 9.9375rem;
}

@media screen and (max-width: 1148px) {
  .std-text-box-width-r {
    width: 12.4375rem;
  }

  .std-text-box-width-r-1 {
    width: 12.4375rem;
  }
}

.lg-text-box-width {
  width: 28.5rem;
}

.lg-text-box-width-1 {
  width: 30.6875rem;
}

.md-text-box-width {
  width: 9.625rem;
}

.text-box-width-491 {
  width: 15.34375rem;
}

.text-box-width-134 {
  width: 4.1875rem;
}

.text-box-width-246 {
  width: 7.6875rem;
}

.text-box-width-484 {
  width: 15.125rem;
}

.text-box-width-210 {
  width: 6.5625rem;
}

.text-box-width-206 {
  width: 6.4375rem;
}

.text-box-width-289 {
  width: 9.03125rem;
}

.text-box-width-273 {
  width: 8.5312rem;
}

.text-box-width-758 {
  width: 23.6875rem;
}

.text-box-width-732 {
  width: 22.875rem;
}

.text-box-width-301 {
  width: 9.40625rem;
}

.text-box-width-122 {
  width: 3.8359375rem;
}

.text-box-width-245 {
  width: 7.65625rem;
}

.text-box-width-241 {
  width: 7.53125rem;
}

.text-box-width-204 {
  width: 6.375rem;
}

.text-box-width-289 {
  width: 9.03125rem;
}

.text-box-width-301 {
  width: 9.40625rem;
}

.text-box-width-319 {
  width: 9.96875rem;
}

.text-box-width-588 {
  width: 18.375rem;
}

.text-box-width-466 {
  width: 14.5625rem;
}

.text-box-width-465 {
  width: 14.53125rem;
}

.text-box-width-388 {
  width: 12.125rem;
}

.text-box-width-366 {
  width: 11.4375rem;
}

.text-box-width-446 {
  width: 13.9375rem;
}

.text-box-width-430 {
  width: 13.4375rem;
}

.text-box-width-666 {
  width: 20.8125rem;
}

.text-box-width-638 {
  width: 19.9375rem;
}

.text-box-width-266 {
  width: 8.3125rem;
}

.text-box-width-358 {
  width: 11.1875rem;
}

.text-box-width-740 {
  width: 23.125rem;
}

.text-box-width-982 {
  width: 30.6875rem;
}

.text-box-width-989 {
  width: 30.90625rem;
}

.text-box-width-129 {
  width: 4.03125rem;
}

.text-box-width-655 {
  width: 20.46875rem;
  max-width: 20.46875rem !important;
}

.emoji-picker-container {
  height: 1.625rem !important;
}

.emoji-wysiwyg-editor {
  margin-top: 0 !important;
  /*padding: 0 !important;*/
  display: flex;
  /*align-items: center;*/
  padding: 0.5rem 0.625rem !important;
  height: 100% !important;
  font-size: 0.5rem !important;
  line-height: 0.5rem !important;
}

.emoji-picker-icon {
  right: 0.3125rem !important;
  top: 0.46875rem !important;
  font-size: 0.625rem !important;
}

.email-action-btn {
  height: 1.625rem;
  display: flex !important;
  align-items: center;
  justify-content: center;
  padding: unset !important;
}

.exclusion-div {
  margin-top: 1.5625rem;
  border-top: 2px solid #f5f5f5 !important;
  margin-left: -0.625rem;
  margin-right: -0.625rem;
  padding: 0.75rem 0.625rem 0;
}

.scheduling-component .form-label {
  margin-bottom: 0.375rem !important;
}

.scheduling-component .font-size-18 .form-label {
  margin-bottom: unset !important;
}

.one-time-scheduling-component {
  width: 33.71875rem;
  flex-wrap: nowrap;
}

.multiple-datetime-scheduling-component {
  width: 33.71875rem;
}

.phone-icons img {
  height: 0.75rem !important;
  width: 0.75rem !important;
}

.phone-icons {
  margin-bottom: 1.5625rem !important;
}

.table-time {
  opacity: 0.5;
  font-family: Roboto;
  font-size: 0.4375rem;
  color: #263238;
  margin-left: 0.1875rem;
}

.wd-1082px {
  width: 33.8125rem;
}

.img-ht-24px {
  height: 0.75rem;
  width: 0.75rem;
}

.img-ht-13px {
  height: 0.40625rem;
  width: 0.40625rem;
}

.img-ht-20 {
  height: 0.625rem;
  width: 0.625rem;
}

.img-ht-16 {
  height: 0.5rem;
  width: 0.5rem;
}

.padding-20 {
  padding: 0.625rem;
}

.sml-text-box-width {
  width: 6.625rem;
}

.med-text-box-width {
  width: 11rem;
}

.mar-tp-40 {
  margin-top: 1.25rem;
}

.mar-tp-42 {
  margin-top: 1.3125rem;
}

.mar-tp-45 {
  margin-top: 1.40625rem;
}

.status-badge.Running {
  background-color: #b1d8ff;
}

.status-badge.Live {
  background-color: #b1d8ff;
}

.status-badge.Recurring {
  background-color: #b1d8ff;
}

.status-badge.Scheduled {
  background-color: #ffc43e;
}

.status-badge.Completed,
.status-badge.ACTIVE {
  background-color: #a0dd74;
}

.status-badge.Draft {
  background-color: #ededed;
}

.status-badge.Stopped,
.status-badge.STOPPED {
  background-color: #ff8d7e;
}

.status-badge.Paused,
.status-badge.INACTIVE,
.status-badge.PAUSED {
  background-color: #ff8d7e;
}

.status-badge.Requested,
.status-badge.REQUEST {
  background-color: #b1d8ff;
}

.status-badge.Rejected {
  background-color: #ff8d7e;
}

.status-badge.DRAFT {
  background-color: #ededed;
}

.align-items-flex-end {
  align-items: flex-end;
}

.mar-bt-60 {
  margin-bottom: 1.5rem;
}

.mar-bt-77 {
  margin-bottom: 2.40625rem;
}

.text-box-width-140 {
  width: 4.375rem;
}

.text-box-width-1016 {
  width: 31.75rem;
}

.mar-lt-rt-20 {
  margin: 0 0.625rem;
}

.pd-lt-rt-0 {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.mar-tp-20 {
  margin-top: 0.625rem;
}

.ht-179x {
  height: 5.59375rem !important;
}

.ht-100px {
  height: 3.125rem !important;
}

.cp {
  cursor: pointer;
}

.table-container {
  margin-top: 0.75rem;
  /* padding-bottom: 0.46875rem; */
  min-width: 100%;
  width: auto;
  overflow-x: auto !important;
  overflow-y: hidden;
  padding-right: 0.75rem;
  background: #ffffff;
  height: max-content;
  max-height: calc(100% - 3rem);
  overflow-y: hidden;
  border-radius: 0.375rem;
  /* border-bottom-right-radius: 0;
    border-bottom-left-radius: 0; */
}

.table-container:hover {
  /* overflow-y: scroll; */
  padding-right: 0;
}

.admin-table {
  border-collapse: collapse;
  width: 100%;
  /*white-space: nowrap;*/
  table-layout: auto;
}

.admin-table thead {
  font-family: Roboto;
  font-weight: 500;
  font-size: 13px;
  color: #263238;
  position: sticky;
  top: 0;
  z-index: 2;
}

.admin-table tbody {
  font-family: Roboto;
  font-weight: 400;
  font-size: 13px;
  color: #263238;
}

.admin-table tr {
  border-bottom: 0.03125rem solid #f2f2fc;
}

.admin-table thead tr:first-child {
  border-bottom: none;
  background-color: #ffffff;
}

.admin-table th {
  text-align: left;
  padding: 0.4375rem 0.3125rem;
  height: 1.5rem;
  color: #27272a;
  font-size: 0.5rem;
  font-weight: 500;
}

.admin-table td {
  text-align: left !important;
  padding: 0.375rem 0.3125rem;
  font-size: 0.4375rem;
  height: 1.5rem;
  color: #27272a;
}

td img {
  height: 0.75rem;
  width: 0.75rem;
}

.admin-table th:first-child {
  padding-left: 0.75rem;
}

.admin-table td:first-child {
  padding-left: 0.75rem;
}

.admin-table td:last-child,
.admin-table th:last-child {
  text-align: center !important;
}

/* table scroll css */

.admin {
  height: calc(100vh - 2.5rem);
}

.table-container {
  max-height: 100%;
  height: max-content;
}

.admin-table-container {
  height: 100%;
  max-height: calc(100vh - 7.5rem);
  overflow-y: hidden;
}

.admin-table-container:hover {
  overflow-y: auto;
}

.table-container,
.table-container:hover {
  padding-right: 0;
  /* overflow: auto; */
}

.admin-table {
  width: calc(100vw - 12.125rem);
}

/* table scroll css */
.form-group {
  display: flex;
  flex-direction: column;
  margin-top: 0.5rem;
}

.text-box-height-40 {
  height: 1.25rem !important;
}

.text-box-width-256 {
  width: 8rem;
}

.text-box-width-208 {
  width: 6.5rem;
}

.text-box-width-150 {
  width: 4.6875rem !important;
}

.text-box-width-160 {
  width: 5rem !important;
}

.access-box {
  width: 16.5rem;
  height: 1.25rem;
  background: #ffffff;
  border: 0.03125rem solid #d4d4d8;
  border-radius: 0.25rem;
}

.border-top {
  border: 0.03125rem solid #f4f4f5;
}

.justify-content-between {
  justify-content: space-between;
}

.peId-details {
  border: 0.03125rem solid #d4d4d8;
  border-radius: 0.1875rem;
  /* padding: .34375rem 0 .34375rem 0; */
  font-size: 0.4375rem;
  line-height: 0.59375rem;
  color: #27272a;
}

.pd-lt-rt-16 {
  padding-right: 0.5rem;
  padding-left: 0.5rem;
}

.pd-lft-16 {
  padding-left: 0.5rem;
}

.pd-bt-10 {
  padding-bottom: 0.3125rem;
}

.cancel-btn {
  width: 2.5625rem;
  height: 1.25rem;
  background: #ffffff;
  border: 0.03125rem solid rgb(212 212 216);
  border-radius: 0.125rem;
  color: #1d4ed8;
  font-weight: 400;
}

.form-check {
  min-height: unset;
  display: flex !important;
  align-items: center;
  min-height: 1.5rem;
  padding-left: 1.5em;
  margin-right: 0.75rem;
  margin-bottom: 0.5rem;
}

.position-relative {
  position: relative;
}

.input-img {
  width: 0.5625rem;
  height: 0.5625rem;
  position: absolute;
  top: 39%;
  right: 2%;
}

.text-box-width-528 {
  width: 16.5rem;
}

.user-details {
  font-size: 0.4375rem;
  line-height: 0.59375rem;
  color: #27272a;
  font-weight: 500;
}

.bordr-table {
  /* width: 16.46875rem; */
  height: 100%;
  max-height: calc(100vh - 7.5rem);
  overflow-y: hidden;
  background: #ffffff;
  border: 0.03125rem solid #d4d4d8;
  border-radius: 0.125rem;
}

.text-box-width-144 {
  width: 4.5rem;
}

.text-box-width-258 {
  width: 8.0625rem;
}

.text-box-width-1052 {
  width: 32.875rem;
}

.text-box-width-703 {
  width: 21.96875rem;
}

.text-box-width-308 {
  width: 9.625rem;
}

.mar-bt-45 {
  margin-bottom: 1.40625rem;
}

.ht-72px {
  height: 2.25rem;
}

.re-container .card-header {
  padding: 1rem 0.75rem 0.75rem;
  border-bottom: none !important;
  height: auto;
}

.reachability-graph {
  width: 23.1875rem !important;
  height: 10.875rem !important;
  border: 0.03125rem solid #e3e3e3;
  border-radius: 0.375rem;
  padding: 0.5rem;
}

.graphs-container {
  padding: 0.1875rem 0.75rem;
}

.img-ht-10 {
  height: 0.3125rem;
  width: 0.3125rem;
}

.graph-div .graph-header {
  display: flex;
  align-items: baseline;
}

.graph-div .graph-header img {
  margin-right: 0.21875rem;
}

.timeout-modal {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999999;
  display: none;
  width: 100%;
  height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  outline: 0;
  background-color: rgba(0, 0, 0, 0.342);
}

.timeout-modal-content {
  padding: 0 !important;
  width: 14.0625rem;
  border-radius: 0.375rem;
  border: none;
}

.timeout-modal-content {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  position: absolute !important;
  width: 14.0625rem !important;
  border-radius: 0.375rem;
  display: flex;
  flex-direction: column;
  pointer-events: auto;
  background-color: #ffffff;
  background-clip: padding-box;
  border: none;
  outline: 0;
  margin: auto;
  padding: 0;
  background-clip: border-box !important;
  /* box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); */
  scrollbar-color: #afafb0 transparent;
  scrollbar-width: thin;
}

.timeout-modal-content > .modal-header {
  border-bottom: 2px solid #f5f5f5;
  padding: 0.5625rem 0.625rem 0.5625rem 0.625rem !important;
  display: flex;
  flex-direction: row;
  flex-shrink: 0;
  align-items: center;
  position: sticky;
  top: 0;
  z-index: 101;
  background: #ffffff;
  border-radius: 0.375rem !important;
}

.timeout-modal-content > .modal-header > h3 {
  margin: 0;
  font-size: 0.5625rem;
  font-family: Roboto;
  font-weight: 500;
}

.timeout-modal-content > .modal-body {
  padding: 0 0.625rem !important;
  background-color: #ffffff !important;
  border-radius: 0.375rem !important;
  position: relative;
  flex: 1 1 auto;
  border-top-left-radius: 0px;
  border-top-right-radius: 0px;
}

.mar-rt-26 {
  margin-right: 26px;
}

.confirm-modal-btns {
  display: flex;
  justify-content: space-between;
  justify-content: flex-end !important;
  padding-right: 0.75rem;
  padding: 0 0.75rem 1.25rem 1.03125rem;
}

.timeout-logout-btn {
  width: 4.03125rem !important;
  height: 1.25rem !important;
  border-radius: 0.25rem !important;
  border: 2px solid #1b54d9 !important;
  background: #ffffff !important;
  color: #1b54d9 !important;
  font-family: Roboto !important;
  font-weight: 500 !important;
  font-size: 0.5rem !important;
}

.timeout-cancel-btn {
  width: 3.03125rem !important;
  height: 1.25rem !important;
  border-radius: 0.25rem !important;
  border: none !important;
  background: #1b54d9 !important;
  color: #ffffff !important;
  font-family: Roboto !important;
  font-weight: 500 !important;
  font-size: 0.5rem !important;
}

.timeout-text {
  color: #000000 !important;
  font-size: 0.5rem !important;
}

/*Circular progress CSS*/
.progress-container {
  display: flex;
  margin: 0.3125rem auto;
  justify-content: center;
  align-items: center;
}

.timeout-unit {
  font-family: Roboto;
  font-weight: 400;
  color: #000000;
  font-size: 0.5rem;
  margin-left: 0.25rem;
  margin-top: 0.15625rem;
}

.circle-wrap {
  width: 40px;
  height: 40px;
  background: #fefcff;
  border-radius: 50%;
  border: none;
}

.circle-wrap .circle .mask,
.circle-wrap .circle .fill {
  width: 40px;
  height: 40px;
  position: absolute;
  border-radius: 50%;
}

.circle-wrap .circle .mask {
  clip: rect(0px, 40px, 40px, 20px);
}

.circle-wrap .inside-circle {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: #ffffff;
  line-height: 30px;
  text-align: center;
  margin-top: 5px;
  margin-left: 5px;
  color: #1e51dc;
  position: absolute;
  z-index: 100;
  font-family: Roboto;
  font-weight: 700;
  font-size: 0.625rem;
}

/* color animation */

/* 3rd progress bar */
.mask .fill {
  clip: rect(0px, 20px, 40px, 0px);
  background-color: #227ded;
}

.mask.full,
.circle .fill {
  animation: fill ease-in-out 60s;
  transform: rotate(180deg);
}

@keyframes fill {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(180deg);
  }
}

.common-spacing {
  margin: 0 -0.3125rem !important;
}

.event-width {
  padding: 0 0.3125rem !important;
}

.common-spacing .text-box-width-491 {
  width: 100% !important;
}

.note-text {
  font-size: 0.5rem;
  color: #00000061;
  margin-top: 1.84375rem;
  font-style: oblique;
}

.max-value-text {
  font-size: 0.4375rem;
  color: rgb(0 0 0 / 50%);
  text-align: end;
  margin-top: 0.25rem;
}

.red-circle {
  width: 0.625rem;
  height: 0.625rem;
  background: #ff4027;
  border-radius: 50%;
  margin-top: 0.125rem;
  margin-left: 0.125rem;
}

.color-mark {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 0.4375rem;
  color: #ffffff;
}

.color-black {
  color: #000000 !important;
  font-weight: bold !important;
}

.font-weight-normal {
  font-weight: normal !important;
}

.mar-lft-20 {
  margin-left: 0.625rem !important;
}

.mar-lft-28 {
  margin-left: 0.875rem !important;
}

.mar-bt-20 {
  margin-bottom: 0.625rem !important;
}

.retry-flex {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  height: 4.5rem;
  width: 19rem;
}

.color-count {
  color: #1b54d9 !important;
}

.standard-campaign-list {
  min-width: 6.8125rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

.multivariant-campaign-list {
  min-width: 6.8125rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

.flex-direction-row {
  flex-direction: row !important;
}

.active-list-header {
  border-bottom: 2px solid #1d4ed8 !important;
  color: #1d4ed8 !important;
  font-weight: bold !important;
}

.slider-left-circle {
  border: 1px solid black;
  border-radius: 50%;
  width: 0.75rem;
  height: 0.75rem;
  position: relative;
  top: 41%;
  right: 18%;
}

.left-img {
  width: 0.55rem;
  height: 0.55rem;
  position: absolute;
  top: 9%;
  left: 10%;
}

.slider-right-circle {
  border: 1px solid black;
  border-radius: 50%;
  width: 0.75rem;
  height: 0.75rem;
  position: relative;
  transform: rotate(181deg);
  bottom: 49%;
  left: 111%;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
  -webkit-box-shadow: 0 0 0 30px white inset !important;
}

.preview-data {
  margin-left: 3.125rem;
  margin-top: 2.3rem;
  background-color: #e4e4e4;
  padding: 0.625rem;
  width: 19rem;
  border-radius: 0.5rem;
  height: 18.75rem;
}

.mar-lft-75 {
  margin-left: 2.34375rem;
}

.notification-quick-reply-buttons {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 0.15625rem !important;
}

.notification-quick-reply-buttons .mv-btn-row-flex {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

.notification-quick-reply-buttons .mv-btn-column-flex {
  display: flex;
  flex-direction: column;
}

.notification-content .mv-divider {
  margin-top: 0.3125rem;
  margin-bottom: 0.3125rem;
}

.mar-lft-42 {
  margin-left: 1.3125rem;
}

.wd-166 {
  width: 5.1875rem !important;
}

.formCheckbox label {
  color: #27272a;
  font-size: 0.5rem;
  font-weight: 400;
  line-height: 0.6667rem;
}

.feedbackURL {
  color: #27272a;
  font-size: 0.5833rem;
  font-weight: 400;
  line-height: 0.6667rem;
  margin: 0;
  font-size: 0.5rem;
}

.feedbackURL strong {
  font-weight: 500;
  white-space: nowrap;
}

.feedbackURL span {
  display: inline-block;
  margin-left: 0.1667rem;
  color: #1d4ed8;
}

.feedbackDiv {
  display: flex;
  gap: 0.75rem;
  align-items: flex-start;
  margin-bottom: 0.75rem;
}

.feedbackDiv .formCheckbox {
  display: flex;
  align-items: center;
  column-gap: 0.25rem;
  min-width: 9rem;
}

.feedbackDiv .formCheckbox input,
.feedbackDiv .formCheckbox input:hover,
.feedbackDiv .formCheckbox input:focus {
  width: 0.688rem;
  height: 0.688rem;
  background-color: #1b54d9 !important;
}

.sticky-preview-wrapper {
  height: calc(100vh - 150px);
  position: sticky;
  top: 0;
}

.design-wrapper {
  align-self: stretch;
  display: grid;
  gap: 0.75rem;
}

.select-template-section {
  background-color: white;
  padding: 0.625rem;
  border-radius: 0.375rem;
  display: flex;
  gap: 8px;
  align-items: center;
}

.clone-template-btn  {
  height: 16px;
  width: 16px;
  cursor: pointer; 
}

.clone-template-btn > img {
  background-color: #f0f0f0;
  padding: 0.125rem;
  border-radius: 50%;
  width: 100%;
  height: 100%;
}