a {
  text-decoration: none;
  color: inherit;
}

/* =============================== */
/* ==== Typography Components ==== */
/* =============================== */
.weight-normal {
  font-weight: 400;
}

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

.weight-semibold {
  font-weight: 600;
}

.weight-bold {
  font-weight: 700;
}

.primary-bg {
  background: #ef4869 !important;
}

.primary-text {
  color: #ef4869 !important;
}

.secondary-bg {
  background: #e2e8f0 !important;
}

.secondary-text {
  color: #94a3b8 !important;
}

.success-bg {
  background: #1ccb68 !important;
}

.success-text {
  color: #118444 !important;
}

.error-bg {
  background: #F04438 !important;
}

.error-text {
  color: #F04438 !important;
}

.warning-bg {
  background: #FFCB68 !important;
}

.warning-text {
  color: #E5AD43 !important;
}

.info-bg {
  background: #3DABF4 !important;
}

.info-text {
  color: #3DABF4 !important;
}

.slate-bg {
  background: #64748b !important;
}

.slate-text {
  color: #64748b !important;
}

.gray-bg {
  background: #6b7280 !important;
}

.gray-text {
  color: #6b7280 !important;
}

.white-bg {
  background: #fff !important;
}

.white-text {
  color: #fff !important;
}

/* =========================== */
/* ==== Button Components ==== */
/* =========================== */
.success-btn,
.success-outline-btn,
.success-secondary-btn,
.success-text-btn,
.default-btn,
.default-outline-btn,
.default-secondary-btn,
.default-text-btn,
.error-btn,
.error-outline-btn,
.error-secondary-btn,
.error-text-btn,
.warning-btn,
.warning-outline-btn,
.warning-secondary-btn,
.warning-text-btn,
.info-btn,
.info-outline-btn,
.info-secondary-btn,
.info-text-btn,
.primary-btn,
.secondary-btn,
.connect-info-outline-btn,
.text-btn {
  transition: 0.2s all linear;
  border: 2px solid transparent;
  font-weight: 400;
  outline: none;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  flex-direction: row;
  white-space: nowrap;
  gap: 12px;
  cursor: pointer;
  font-family: "Inter", sans-serif;
}
.success-btn.shadow,
.success-outline-btn.shadow,
.success-secondary-btn.shadow,
.success-text-btn.shadow,
.default-btn.shadow,
.default-outline-btn.shadow,
.default-secondary-btn.shadow,
.default-text-btn.shadow,
.error-btn.shadow,
.error-outline-btn.shadow,
.error-secondary-btn.shadow,
.error-text-btn.shadow,
.warning-btn.shadow,
.warning-outline-btn.shadow,
.warning-secondary-btn.shadow,
.warning-text-btn.shadow,
.info-btn.shadow,
.info-outline-btn.shadow,
.info-secondary-btn.shadow,
.info-text-btn.shadow,
.primary-btn.shadow,
.secondary-btn.shadow,
.text-btn.shadow {
  -webkit-box-shadow: -1px 5px 20px -5px rgba(0, 0, 0, 0.18);
  -moz-box-shadow: -1px 5px 20px -5px rgba(0, 0, 0, 0.18);
  box-shadow: -1px 5px 20px -5px rgba(0, 0, 0, 0.18);
}
.success-btn:is([disabled]),
.success-outline-btn:is([disabled]),
.success-secondary-btn:is([disabled]),
.success-text-btn:is([disabled]),
.default-btn:is([disabled]),
.default-outline-btn:is([disabled]),
.default-secondary-btn:is([disabled]),
.default-text-btn:is([disabled]),
.error-btn:is([disabled]),
.error-outline-btn:is([disabled]),
.error-secondary-btn:is([disabled]),
.error-text-btn:is([disabled]),
.warning-btn:is([disabled]),
.warning-outline-btn:is([disabled]),
.warning-secondary-btn:is([disabled]),
.warning-text-btn:is([disabled]),
.info-btn:is([disabled]),
.info-outline-btn:is([disabled]),
.info-secondary-btn:is([disabled]),
.info-text-btn:is([disabled]),
.primary-btn:is([disabled]),
.secondary-btn:is([disabled]),
.text-btn:is([disabled]) {
  pointer-events: none;
  opacity: 0.9;
}

.sm-btn {
  gap: 6px;
  font-size: 15px;
  padding: 8px 16px;
  border-radius: 4px;
  line-height: 14px;
}
.sm-btn > i {
  font-size: 17px;
}

.md-btn {
  gap: 8px;
  font-size: 16px;
  padding: 10px 18px;
  border-radius: 6px;
  line-height: 21px;
}
.md-btn > i {
  font-size: 18px;
}

.xl-btn {
  font-size: 18px;
  padding: 12px 20px;
  border-radius: 8px;
  line-height: 28px;
}
.xl-btn > i {
  font-size: 20px;
}

.icon-sm-btn {
  font-size: 16px;
  padding: 8px 10px;
  border-radius: 4px;
}

.icon-md-btn {
  font-size: 16px;
  padding: 10px 12px;
  border-radius: 4px;
}

.icon-xl-btn {
  font-size: 16px;
  padding: 12px 14px;
  border-radius: 4px;
}

@media only screen and (min-width: 230px) and (max-width: 768px) {
  .sm-btn {
    font-size: 13px;
    padding: 6px 10px;
  }
  .sm-btn > i {
    font-size: 14px;
  }
  .md-btn {
    font-size: 14px;
    padding: 6px 12px;
  }
  .md-btn > i {
    font-size: 16px;
  }
  .xl-btn {
    font-size: 15px;
    padding: 8px 16px;
  }
  .xl-btn > i {
    font-size: 16px;
  }
  .icon-sm-btn {
    font-size: 13px;
    padding: 6px 8px;
  }
  .icon-md-btn {
    font-size: 14px;
    padding: 8px 10px;
  }
  .icon-xl-btn {
    font-size: 15px;
    padding: 10px 12px;
  }
}
/* ==== Datatable Sub Area Buttons ==== */
tr:is(.child) .sm-btn {
  gap: 2px;
  font-size: 10px;
  padding: 2px 6px;
}
tr:is(.child) .sm-btn > i {
  font-size: 10px;
}
tr:is(.child) .md-btn {
  gap: 4px;
  font-size: 11px;
  padding: 2px 8px;
}
tr:is(.child) .md-btn > i {
  font-size: 12px;
}
tr:is(.child) .xl-btn {
  gap: 6px;
  font-size: 12px;
  padding: 4px 12px;
}
tr:is(.child) .xl-btn > i {
  font-size: 14px;
}
tr:is(.child) .icon-sm-btn {
  gap: 2px;
  font-size: 10px;
  padding: 2px 4px;
}
tr:is(.child) .icon-md-btn {
  gap: 4px;
  font-size: 11px;
  padding: 4px 6px;
}
tr:is(.child) .icon-xl-btn {
  gap: 6px;
  font-size: 12px;
  padding: 6px 8px;
}

/* ==== Brand Button Components ==== */
.primary-btn {
  background: #ef4869;
  color: #fff;
}
.primary-btn:hover {
  background: #d51a4c;
}
.primary-btn:focus {
  background: #b71a49;
}

.secondary-btn {
  background: #fff0f1;
  color: #ef4869;
}
.secondary-btn:hover {
  background: #fee6e9;
  color: #ef4869;
}
.secondary-btn:focus {
  background: #fdced5;
}

.text-btn {
  background: none;
  color: #ef4869;
}
.text-btn:hover {
  background: #fee6e9;
  color: #ef4869;
}
.text-btn:focus {
  background: #fdced5;
}

/* ==== Success Button Components ==== */
.success-btn {
  background: #11a853;
  color: #fff;
}
.success-btn:hover {
  background: #118444;
}
.success-btn:focus {
  background: #136839;
}

.success-outline-btn {
  background: none;
  border: 2px solid #1ccb68;
  color: #118444;
}
.success-outline-btn:hover {
  background: #1ccb68;
  color: #fff;
}
.success-outline-btn:focus {
  background: #118444;
  border-color: #118444;
  color: #fff;
}

.success-secondary-btn {
  background: #f0fdf5;
  color: #118444;
}
.success-secondary-btn:hover {
  background: #b9f9d3;
}
.success-secondary-btn:focus {
  background: #82f3b2;
}

.success-text-btn {
  background: none;
  color: #118444;
}
.success-text-btn:hover {
  background: #dbfde9;
}
.success-text-btn:focus {
  background: #b9f9d3;
}

/* ==== Default Button Components ==== */
.default-btn {
  background: #475569;
  color: #fff;
}
.default-btn:hover {
  background: #334155;
}
.default-btn:focus {
  background: #1e293b;
}

.default-outline-btn {
  background: none;
  border: 2px solid #475569;
  color: #334155;
}
.default-outline-btn:hover {
  background: #475569;
  color: #fff;
}
.default-outline-btn:focus {
  background: #334155;
  border-color: #334155;
  color: #fff;
}

.default-secondary-btn {
  background: #f8fafc;
  color: #334155;
}
.default-secondary-btn:hover {
  background: #e2e8f0;
}
.default-secondary-btn:focus {
  background: #cbd5e1;
}

.default-text-btn {
  background: none;
  color: #334155;
}
.default-text-btn:hover {
  background: #f1f5f9;
}
.default-text-btn:focus {
  background: #e2e8f0;
}

/* ==== Error Button Components ==== */
.error-btn {
  background: #F04438;
  color: #fff;
}
.error-btn:hover {
  background: #DF3023;
}
.error-btn:focus {
  background: #A50F05;
}

.error-outline-btn {
  background: none;
  border: 2px solid #F04438;
  color: #C51407;
}
.error-outline-btn:hover {
  background: #F04438;
  color: #fff;
}
.error-outline-btn:focus {
  background: #C51407;
  border-color: #C51407;
  color: #fff;
}

.error-secondary-btn {
  background: #FFF1F1;
  color: #C51407;
}
.error-secondary-btn:hover {
  background: #FFE1E2;
}
.error-secondary-btn:focus {
  background: #FFB5B0;
}

.error-text-btn {
  background: none;
  color: #C51407;
}
.error-text-btn:hover {
  background: #FFF1F1;
}
.error-text-btn:focus {
  background: #FFE1E2;
}

/* ==== Warning Button Components ==== */
.warning-btn {
  background: #E5AD43;
  color: #fff;
}
.warning-btn:hover {
  background: #BE861C;
}

.warning-outline-btn {
  background: none;
  border: 2px solid #E5AD43;
  color: #BE861C;
}
.warning-outline-btn:hover {
  background: #FFCB68;
  color: #fff;
}
.warning-outline-btn:focus {
  background: #BE861C;
  border-color: #BE861C;
  color: #fff;
}

.warning-secondary-btn {
  background: #FFF0D3;
  color: #BE861C;
}
.warning-secondary-btn:hover {
  background: #FFF0D3;
}
.warning-secondary-btn:focus {
  background: #FFE6B8;
}

.warning-text-btn {
  background: none;
  color: #BE861C;
}
.warning-text-btn:hover {
  background: #FFF0D3;
}
.warning-text-btn:focus {
  background: #FFE6B8;
}

/* ==== Info Button Components ==== */
.info-btn {
  background: #3DABF4;
  color: #fff;
}
.info-btn:hover {
  background: #2E93EA;
}
.info-btn:focus {
  background: #1F61AE;
}

.info-outline-btn {
  background: none;
  border: 2px solid #3DABF4;
  color: #1F78D6;
}
.info-outline-btn:hover {
  background: #3DABF4;
  color: #fff;
}
.info-outline-btn:focus {
  background: #1F78D6;
  border-color: #1F78D6;
  color: #fff;
}

.connect-info-outline-btn {
    background: none;
    border: 2px solid #e16e86;
    color: #EF4969;
}
.connect-info-outline-btn:hover {
    background: #EF4969;
    color: #fff;
}
.connect-info-outline-btn:focus {
    background: #EF4969;
    border-color: #EF4969;
    color: #fff;
}

.info-secondary-btn {
  background: #EFFAFF;
  color: #1F78D6;
}
.info-secondary-btn:hover {
  background: #C0E9FD;
}
.info-secondary-btn:focus {
  background: #94DCFC;
}

.info-text-btn {
  background: none;
  color: #1F78D6;
}
.info-text-btn:hover {
  background: #EFFAFF;
}
.info-text-btn:focus {
  background: #C0E9FD;
}

/* ==== # End Button Components ==== */
/* =========================== */
/* ==== Widget Components ==== */
/* =========================== */
.widget {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-direction: row;
  -ms-flex-direction: row;
  padding: 1.25rem;
  border-radius: 8px;
  background: #fff;
  outline: 2px solid transparent;
  overflow: hidden;
  z-index: 1;
}
.widget:is(.chart), .widget:is(.footer) {
  padding: 0;
}
.widget:is(.chart) > .body, .widget:is(.footer) > .body {
  padding: 1.25rem;
}
.widget:is(.chart) > .chart, .widget:is(.footer) > .chart {
  width: 100%;
  padding: 0;
  margin: 0;
}
.widget:is(.chart) > .footer-info, .widget:is(.footer) > .footer-info {
  background: #e2e8f0;
  padding: 0.5rem 1rem;
  color: #64748b;
  font-size: 16px;
  font-weight: 500;
  width: 100%;
}
.widget .info {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  flex-direction: column;
  -ms-flex-direction: column;
  gap: 6px;
}
.widget .info .title {
  font-size: 17px;
  font-weight: 400;
}
.widget .info .count {
  font-size: 19px;
  font-weight: 600;
}
.widget .info .message {
  height: 2lh;
  font-size: 15px;
  font-weight: 400;
  display: flex;
  align-items: center;
  gap: 8px;
}
.widget .info .message:is(.up)::before {
  content: "\ea5e";
  font-family: lineicons !important;
  font-weight: 600;
  font-size: 14px;
}
.widget .info .message:is(.down)::before {
  content: "\ea58";
  font-family: lineicons !important;
  font-weight: 600;
  font-size: 14px;
}
.widget .info .message:is(.normal)::before {
  content: "\eb2c";
  font-family: lineicons !important;
  font-weight: 600;
  font-size: 14px;
}
.widget .icon > i {
  font-size: 30px;
}
.widget .icon.bg {
  border-radius: 4px;
  padding: 4px 12px;
}
.widget .icon.primary {
  background: #fee6e9;
  color: #ef4869;
}
.widget .icon.secondary {
  background: #f1f5f9;
  color: #64748b;
}
.widget .icon.success {
  background: #dbfde9;
  color: #11a853;
}
.widget .icon.warning {
  background: #FFF0D3;
  color: #E5AD43;
}
.widget .icon.info {
  background: #DBF2FE;
  color: #3DABF4;
}
.widget .icon.error {
  background: #FFE1E2;
  color: #F04438;
}
.widget:has(> .body) {
  flex-direction: column;
  gap: 8px;
}
.widget:has(> .body) .body {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}
.widget:has(> .body) .info {
  align-items: flex-start;
  justify-content: space-between;
  flex-direction: column;
  -ms-flex-direction: column;
}
.widget > .progress {
  width: 100%;
  height: 7px;
  border-radius: 12px;
}
.widget > .progress .bar {
  height: 7px;
  border-radius: 12px;
  z-index: 1;
}
.widget.shadow {
  box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
}
.widget.primary {
  background: #ef4869;
  color: #fff0f1;
}
.widget.primary.shapes::before {
  content: "";
  border-radius: 50%;
  background: #f77389;
  width: 80px;
  height: 80px;
  position: absolute;
  top: -30px;
  left: -30px;
  transform: translate(0%, 0%);
  overflow: hidden;
  z-index: -1;
}
.widget.primary.shapes::after {
  content: "";
  border-radius: 50%;
  background: #f77389;
  width: 80px;
  height: 80px;
  position: absolute;
  bottom: -30px;
  right: -30px;
  transform: translate(0%, 0%);
  overflow: hidden;
  z-index: -1;
}
.widget.primary > .footer-info {
  background: #fee6e9;
}
.widget.secondary {
  background: #fff;
  color: #64748b;
}
.widget.secondary.shapes::before {
  content: "";
  border-radius: 50%;
  background: #f1f5f9;
  width: 80px;
  height: 80px;
  position: absolute;
  top: -30px;
  left: -30px;
  transform: translate(0%, 0%);
  overflow: hidden;
  z-index: -1;
}
.widget.secondary.shapes::after {
  content: "";
  border-radius: 50%;
  background: #f1f5f9;
  width: 80px;
  height: 80px;
  position: absolute;
  bottom: -30px;
  right: -30px;
  transform: translate(0%, 0%);
  overflow: hidden;
  z-index: -1;
}
.widget.outline-primary {
  background: #fff0f1;
  outline-color: #ef4869;
  color: #d51a4c;
}
.widget.outline-primary.shapes::before {
  content: "";
  border-radius: 50%;
  background: #fdced5;
  width: 80px;
  height: 80px;
  position: absolute;
  top: -30px;
  left: -30px;
  transform: translate(0%, 0%);
  overflow: hidden;
  z-index: -1;
}
.widget.outline-primary.shapes::after {
  content: "";
  border-radius: 50%;
  background: #fdced5;
  width: 80px;
  height: 80px;
  position: absolute;
  bottom: -30px;
  right: -30px;
  transform: translate(0%, 0%);
  overflow: hidden;
  z-index: -1;
}
.widget.outline-secondary {
  background: #fff;
  outline-color: #94a3b8;
  color: #64748b;
}
.widget.outline-secondary.shapes::before {
  content: "";
  border-radius: 50%;
  background: #e2e8f0;
  width: 80px;
  height: 80px;
  position: absolute;
  top: -30px;
  left: -30px;
  transform: translate(0%, 0%);
  overflow: hidden;
  z-index: -1;
}
.widget.outline-secondary.shapes::after {
  content: "";
  border-radius: 50%;
  background: #e2e8f0;
  width: 80px;
  height: 80px;
  position: absolute;
  bottom: -30px;
  right: -30px;
  transform: translate(0%, 0%);
  overflow: hidden;
  z-index: -1;
}

.widget-create-button:hover .widget {
  background: #3cc992 !important;
}

.widget-create-button:hover .widget::before {
  background: #3bcc94 !important;
}

.widget-create-button:focus .widget {
  background: #3cc992 !important;
  box-shadow: inset 0 0 0 0.2rem rgba(60, 201, 146, 0.5);
}

.widget-create-button h6 {
  color: #fff;
}

.widget.success {
  background: #5CCFA2;
  color: #fff;
}

.widget.success.shapes::before {
  content: "";
  border-radius: 50%;
  background: #40c491;
  width: 80px;
  height: 80px;
  position: absolute;
  top: -30px;
  left: -30px;
  transform: translate(0%, 0%);
  overflow: hidden;
  z-index: -1;
}

.widget.success.shapes::after {
  content: "";
  border-radius: 50%;
  background: #40c491;
  width: 80px;
  height: 80px;
  position: absolute;
  bottom: -30px;
  right: -30px;
  transform: translate(0%, 0%);
  overflow: hidden;
  z-index: -1;
}

@media only screen and (min-width: 230px) and (max-width: 767px) {
  .widget:is(.chart) > .body, .widget:is(.footer) > .body {
    padding: 14px;
  }
  .widget .icon > i {
    font-size: 24px;
  }
  .widget .info {
    gap: 6px;
  }
  .widget .info .title {
    font-size: 14px;
    font-weight: 400;
  }
  .widget .info .count {
    font-size: 18px;
    font-weight: 600;
  }
  .widget .info .message {
    font-size: 12px;
    gap: 6px;
  }
  .widget .info .message:is(.up)::before, .widget .info .message:is(.down)::before, .widget .info .message:is(.normal)::before {
    font-size: 12px;
  }
  .widget:is(.chart) > .footer-info, .widget:is(.footer) > .footer-info {
    font-size: 13px;
  }
}
/* ==== # End Widget Components ==== */
/* =========================== */
/* ==== Switch Components ==== */
/* =========================== */
.connect-switch {
  display: inline-block;
  width: 60px;
  height: 30px;
  position: relative;
}
.connect-switch input {
  display: none;
}
.connect-switch .slider {
  background: #cbd5e1;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  border-radius: 30px;
  cursor: pointer;
  border: 3px solid transparent;
  overflow: hidden;
  transition: 0.2s;
}
.connect-switch .slider::before {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  background-color: #fff;
  border-radius: 30px;
  transform: translateX(-30px);
  transition: 0.2s;
}
.connect-switch input:checked + .slider::before {
  transform: translateX(30px);
  background-color: #fff;
}
.connect-switch:is(.success) input:checked + .slider {
  background: #11a853;
}
.connect-switch:is(.error) input:checked + .slider {
  background: #DF3023;
}
.connect-switch:is(.warning) input:checked + .slider {
  background: #FFCB68;
}
.connect-switch:is(.info) input:checked + .slider {
  background: #2E93EA;
}

/* ==== # End Switch Components ==== */
/* ==== Datatable Sub Area Switch ==== */
tr:is(.child) .connect-switch input {
  display: none;
}

/* ==== Custom Checkbox (Employee Services) ==== */
.employee-services .form-check {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}
.employee-services .form-check-input:checked[type=checkbox] {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m5 10 3 3 6-6'/%3e%3c/svg%3e");
}
.employee-services .form-check-input {
  width: 1.25rem;
  height: 1.25rem;
}

.connect-table {
  border: 1px solid #e2e8f0 !important;
  border-radius: 8px;
  overflow: hidden;
}
.connect-table tbody {
  vertical-align: initial;
}
.connect-table thead th {
  color: #334155;
  font-weight: 500;
  padding: 12px;
  font-size: 15px;
  border-bottom: 1px solid #e2e8f0;
}
.connect-table tbody tr {
  border-bottom: 1px solid #e2e8f0;
  color: #334155;
  overflow: hidden;
}
.connect-table tbody tr:last-child {
  border: transparent;
}
.connect-table tbody tr:nth-child(odd) {
  background: #f8fafc;
}
.connect-table .child .dtr-title {
  margin-bottom: 8px;
  font-weight: 600;
}
.connect-table .child .dtr-title:after {
  content: ":";
}
.connect-table .child .dtr-data {
  display: flex;
  gap: 6px;
  margin: 0 0 8px 0;
}
.connect-table .child .dtr-details li {
  display: flex;
  gap: 6px;
  align-items: flex-start;
}
.connect-table .action-btn-col {
  width: 32px !important;
}
.connect-table .connect-switch {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  /*> label {
      &::after {
          top: 3px;
          left: 3px;
      }
  }*/
}

/* ============================================= */
/* ==== Datatable Mobile Sub Area Plus Icon ==== */
/* ============================================= */
@media screen and (max-width: 1150px) {
  table.datatable tr:not(.child):not(.parent) td:first-child::before {
    content: "\eb53";
    font-family: lineicons !important;
    margin-right: 3px;
    background-color: #11a853;
    color: #fff;
    padding: 4px;
    font-size: 9px;
    border-radius: 50%;
  }
  table.datatable tr:not(.child):is(.parent) td:first-child::before {
    content: "\eb2c";
    font-family: lineicons !important;
    margin-right: 3px;
    background-color: #DF3023;
    color: #fff;
    padding: 4px;
    font-size: 9px;
    border-radius: 50%;
  }
}
/* ================================== */
/* ==== Customer Table CUSTOMIZE ==== */
/* ================================== */
.customer-table tbody {
  vertical-align: inherit;
}

/* ==================================== */
/* ==== Connect Table Search Input ==== */
/* ==================================== */
@media screen and (min-width: 230px) and (max-width: 992px) {
  .datatables_length,
  .datatables_filter {
    margin-bottom: 8px;
    text-align: left !important;
  }
}
/* ====================================================== */
/* ==== Connect Table Action Buttons List Responsive ==== */
/* ====================================================== */
.datatable-action-btn-td {
  display: flex;
  gap: 6px;
}

@media screen and (min-width: 230px) and (max-width: 768px) {
  .datatable-action-btn-td {
    display: none !important;
  }
}
/* ================================== */
/* ==== Connect Table Pagination ==== */
/* ================================== */
.datatables_wrapper .pagination {
  gap: 8px;
}
.datatables_wrapper .paginate_button.page-item a {
  color: #475569;
  font-weight: 500;
  border: none;
  padding: 8px 16px;
  border-radius: 8px;
  font-size: 14px;
  background: none;
  outline: none;
}
.datatables_wrapper .paginate_button.page-item a:hover:not(.active) {
  background: #f1f5f9;
  color: #ef4869;
}
.datatables_wrapper .paginate_button.page-item a:focus, .datatables_wrapper .paginate_button.page-item a:active {
  border: none;
  outline: none;
  box-shadow: none;
}
.datatables_wrapper .paginate_button.page-item.active a {
  background: #ef4869;
  color: #fff;
}
.datatables_wrapper .paginate_button.page-item.active a:hover {
  background: #d51a4c;
  color: #fff;
}
.datatables_wrapper .paginate_button.page-item.disabled a {
  opacity: 0.5;
  pointer-events: none;
}
.datatables_wrapper .paginate_button.page-item.previous a,
.datatables_wrapper .paginate_button.page-item.next a {
  background: none;
  border: none;
  border-radius: 8px;
  padding: 8px 12px;
  font-size: 14px;
}
.datatables_wrapper .paginate_button.page-item.previous a:hover,
.datatables_wrapper .paginate_button.page-item.next a:hover {
  background: #f1f5f9;
}

.connect-card {
  background: #fff;
  padding: 18px 22px;
  border-radius: 12px;
}
.connect-card:not(.no-shadow) {
  box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;
}
.connect-card .right {
  display: flex;
  gap: 5px;
}
.connect-card.outline-secondary {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
}
.connect-card > .content {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-wrap: wrap;
}
.connect-card > .content .title, .connect-card .title {
  font-size: 18px;
  font-weight: 600;
  color: #1e293b;
}
.connect-card > .content .description, .connect-card .description {
  font-size: 12px;
  font-weight: 400;
  color: #64748b;
  line-height: 24px;
  margin: 8px 0 16px 0;
}
.connect-card .categories-list {
  display: flex;
  flex-direction: column;
  -ms-flex-direction: column;
  gap: 6px;
  margin: 12px 0 16px 0;
}
.connect-card .categories-list .item {
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-direction: row;
  gap: 12px;
  padding: 6px 10px;
  border-radius: 6px;
  color: #64748b;
  font-size: 16px;
  font-weight: 500;
}
.connect-card .categories-list .item:is(.active) {
  background: #fff0f1;
  color: #e03e64;
}
.connect-card .categories-list .item:is(.active):hover {
  background: #fee6e9;
  color: #e03e64;
}
.connect-card .categories-list .item > i {
  font-size: 17px;
}
.connect-card .categories-list .item:hover {
  background: #f1f5f9;
  color: #475569;
}
.connect-card .categories-list .item > .content {
  gap: 10px;
  display: flex;
  align-items: center;
}
.connect-card .categories-list .item > .action {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 4px;
}
.connect-card > .customer-list {
  display: flex;
  justify-content: space-between;
  flex-direction: column;
  -ms-flex-direction: column;
  gap: 12px;
  margin: 12px 0 16px 0;
}
.connect-card > .customer-list .item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 3px;
}
.connect-card > .customer-list .item .customer-info {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
}
.connect-card > .customer-list .item .customer-info .avatar img {
  border-radius: 50%;
}
.connect-card > .customer-list .item .customer-info .info {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  flex-direction: column;
  -ms-flex-direction: column;
  gap: 6px;
}
.connect-card > .customer-list .item .customer-info .name {
  font-weight: 500;
  color: #475569;
  font-size: 16px;
}
.connect-card > .customer-list .item .customer-info .sub-info {
  font-weight: 400;
  color: #94a3b8;
  font-size: 14px;
}
.connect-card > .customer-list .item .action {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 5px;
}

/* Homepage Settings */
.home-meeting-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.home-meeting-list .item {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  background: #f1f5f9;
  padding: 12px 16px;
  border-radius: 8px;
}
.home-meeting-list .item .action {
  display: flex;
  gap: 4px;
  align-items: center;
  justify-content: flex-end;
}

.ec-week-view article.ec-event:hover {
  background: #45e389 !important;
}

.ec-week-view .ec-day-head {
  font-size: 14px;
}

@media screen and (min-width: 230px) and (max-width: 768px) {
  .ec-title {
    font-size: 14px !important;
  }
}
@media (min-width: 230px) and (max-width: 992px) {
  .connect-card {
    padding: 16px;
  }
  .connect-card > .content {
    flex-direction: column;
    flex-wrap: wrap;
  }
  .connect-card > .content .right:not(.no-scroll-mobile) {
    overflow-x: scroll;
    width: 100%;
    display: flex;
    gap: 6px;
  }
  .connect-card > .content .title, .connect-card .title {
    font-size: 20px;
  }
  .connect-card > .content .description, .connect-card .description {
    font-size: 13px;
  }
}
.connect-no-data-card {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  text-align: center;
  border: 2px solid #e2e8f0;
  background: #f8fafc;
  padding: 60px;
  border-radius: 12px;
  gap: 40px;
}
.connect-no-data-card > .content {
  width: 40%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  text-align: center;
  gap: 12px;
}
.connect-no-data-card > .content > .connect-description {
  text-align: center;
}
.connect-no-data-card > .media {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  text-align: center;
}
.connect-no-data-card > .media img {
  max-width: 60%;
  text-align: center;
}

@media screen and (min-width: 230px) and (max-width: 767px) {
  .connect-no-data-card {
    padding: 20px 15px;
    gap: 30px;
  }
  .connect-no-data-card > .content {
    width: 95%;
    gap: 2px;
  }
  .connect-no-data-card > .content > .connect-description {
    margin-bottom: 15px;
  }
  .connect-no-data-card > .media img {
    max-width: 40%;
  }
  .ec-day-head > .ec-day-side {
      visibility: hidden;
  }
}
@media screen and (min-width: 768px) and (max-width: 992px) {
    .ec-day-head > .ec-day-side {
        visibility: hidden;
    }
  .connect-no-data-card {
    padding: 30px 25px;
    gap: 36px;
  }
  .connect-no-data-card > .content {
    width: 70%;
    gap: 6px;
  }
  .connect-no-data-card > .media img {
    max-width: 60%;
  }
}
@media screen and (min-width: 992px) and (max-width: 1199px) {
    .ec-day-head > .ec-day-side {
        visibility: hidden;
    }
  .connect-no-data-card {
    padding: 30px 25px;
    gap: 36px;
  }
  .connect-no-data-card > .content {
    width: 70%;
    gap: 6px;
  }
  .connect-no-data-card > .media img {
    max-width: 60%;
  }
}
@media screen and (min-width: 1200px) and (max-width: 1400px) {
    .ec-day-head > .ec-day-side {
        visibility: hidden;
    }
}
.mobile-navigation-bar-wrapper {
  padding: 0;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 10;
}

.connect-mobile-navigation-bar {
  border-radius: 15px 15px 0 0;
  background: #e03e64;
  width: 100%;
  align-items: center;
  justify-content: space-around;
  flex-direction: row;
  padding: 0px;
  text-align: center;
  white-space: nowrap;
  gap: 3px;
  display: none;
}
.connect-mobile-navigation-bar .item {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  padding: 8px 12px;
  border-radius: 8px;
  gap: 12px;
}
.connect-mobile-navigation-bar .item:focus, .connect-mobile-navigation-bar .item:hover, .connect-mobile-navigation-bar .item:active {
  background: #e03e64;
}
.connect-mobile-navigation-bar .item.active {
  background: #ef4869;
}
.connect-mobile-navigation-bar .item.active span {
  display: block;
  color: #fff;
}
.connect-mobile-navigation-bar .item i {
  font-size: 16px;
  color: #fff;
}
.connect-mobile-navigation-bar .item span {
  display: none;
  font-size: 14px;
  color: #fff;
  font-weight: 500;
}

@media only screen and (min-width: 230px) and (max-width: 767px) {
  .connect-mobile-navigation-bar {
    display: flex;
    padding: 13px 8px;
  }
  .connect-mobile-navigation-bar .item i {
    font-size: 15px;
  }
  .connect-mobile-navigation-bar .item span {
    font-size: 12px;
    font-weight: 500;
  }
  .mobile-navigation-bar-page-padding {
    padding-bottom: 120px;
  }
}
@media only screen and (min-width: 768px) {
  .mobile-navigation-bar-page-padding {
    padding-bottom: 80px;
  }
}
/* ================================== */
/* === Connect Nav Tab Customize ==== */
/* ================================== */
.connect-nav-tab.nav-pills {
  gap: 10px;
}
.connect-nav-tab.nav-pills .nav-link {
  background: #f1f5f9;
  color: #475569;
  font-weight: 500;
}
.connect-nav-tab.nav-pills .nav-link.active {
  background: #475569 !important;
  color: #fff !important;
}

.connect-pricing {
  /*min-height: 600px;*/
  display: flex;
  justify-content: space-between;
  flex-direction: column;
  background: #fff;
  border-radius: 12px;
  box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;
}
.connect-pricing.free {
  border: none;
}
.connect-pricing.pro {
  border: 3px solid #ef4869;
}
.connect-pricing > .header {
  border-radius: 12px 12px 0 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 20px;
}
.connect-pricing > .header:is(.free) {
  background: #f8fafc;
}
.connect-pricing > .header:is(.free) .title {
  text-align: center;
  color: #1e293b;
  font-size: 32px;
  font-weight: 700;
}
.connect-pricing > .header:is(.free) .price {
  font-size: 24px;
  font-weight: 600;
  color: #1e293b;
  text-align: center;
}
.connect-pricing > .header:is(.pro) {
  border-radius: 12px 12px 0 0;
  background: #fff0f1;
}
.connect-pricing > .header:is(.pro) .title {
  text-align: center;
  color: #b71a49;
  font-size: 32px;
  font-weight: 700;
}
.connect-pricing > .header:is(.pro) .price {
  font-size: 24px;
  font-weight: 600;
  color: #b71a49;
  text-align: center;
}
.connect-pricing > .list, .connect-pricing .action {
  padding: 20px 30px;
}
.connect-pricing > .list .item, .connect-pricing .action .item {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 14px;
}
.connect-pricing > .list .item i, .connect-pricing .action .item i {
  font-size: 20px;
  color: #11a853;
}
.connect-pricing > .list .item span, .connect-pricing .action .item span {
  font-size: 16px;
  color: #475569;
}

@media screen and (min-width: 230px) and (max-width: 768px) {
  .connect-pricing {
    height: auto;
    display: flex;
    justify-content: flex-start;
    flex-direction: column;
  }
  .connect-pricing > .list .item i {
    font-size: 16px;
    color: #11a853;
  }
  .connect-pricing > .list .item span {
    font-size: 14px;
    color: #475569;
  }
  .connect-pricing > .list, .connect-pricing .action {
    padding: 20px 20px;
  }
}
.form-control {
  background: #f8fafc;
  padding: 8px 12px;
  border: 2px solid #e2e8f0;
  color: #64748b;
}
.form-control:disabled {
  background: #f3f4f6;
  border-color: #f3f4f6;
  color: #9ca3af;
  user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  pointer-events: none;
}
.form-control:focus, .form-control:active {
  color: #334155;
  border-color: #f77389;
  background: #fff;
  outline: none;
  box-shadow: none;
}

.input-group > .input-group-text {
  border: 2px solid #e2e8f0;
  border-right: none;
  background: #fff;
  color: #475569;
}

.form-label {
  color: #1e293b;
  font-size: 15px;
  font-weight: 400;
}

/*===========================*/
/*==== Select2 Customize ====*/
/*===========================*/
/*.select2-search__field {
    background:$slate50!important;
    padding:8px 12px!important;
    border:2px solid $slate200!important;
    color:$slate500!important;
    &:disabled {
        background:$gray100!important;
        border-color:$gray100!important;
        color:$gray400!important;
        user-select:none!important;
        -webkit-user-select:none!important;
        -ms-user-select:none!important;
        pointer-events: none!important;
    }
    &:focus, &:active {
        color:$slate700!important;
        border-color:$color700!important;
        background:$white!important;
        outline: none!important;
        box-shadow:none!important;
    }
}*/
.select2-selection__choice > .select2-selection__choice__display {
  font-size: 16px;
}

@media screen and (min-width: 230px) and (max-width: 992px) {
  .select2-selection__choice > .select2-selection__choice__display {
    font-size: 13px;
  }
}
.select2-container--bootstrap-5 .select2-selection--single .select2-selection__rendered {
  margin-top: -1px;
}

.select2-container--bootstrap-5 .select2-selection {
  background: #f8fafc;
  border: 2px solid #e2e8f0;
  color: #64748b;
}
.select2-container--bootstrap-5 .select2-selection:focus, .select2-container--bootstrap-5 .select2-selection:active {
  color: #334155;
  border-color: #f77389;
  background: #fff;
  outline: none;
  box-shadow: none;
}

.select2-container--bootstrap-5.select2-container--focus .select2-selection, .select2-container--bootstrap-5.select2-container--open .select2-selection {
  color: #334155;
  border-color: #f77389;
  background: #fff;
  outline: none;
  box-shadow: none;
}

.select2-container--bootstrap-5 .select2-selection--multiple .select2-selection__rendered .select2-selection__choice {
  color: #fff0f1;
  background: #ef4869;
  border: 1px solid #ef4869;
}

.select2-container--bootstrap-5 .select2-selection--multiple .select2-selection__rendered .select2-selection__choice .select2-selection__choice__remove {
  background: transparent url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e") 50%/0.75rem auto no-repeat;
}

.select2-container--bootstrap-5 .select2-dropdown {
  border: 2px solid #f77389;
}

.select2-container--bootstrap-5 .select2-dropdown .select2-results__options .select2-results__option {
  color: #475569;
}

.select2-container--bootstrap-5 .select2-dropdown .select2-results__options .select2-results__option.select2-results__option--selected, .select2-container--bootstrap-5 .select2-dropdown .select2-results__options .select2-results__option[aria-selected=true]:not(.select2-results__option--highlighted) {
  color: #ef4869;
  background: #fff0f1;
}

.select2-container--bootstrap-5 .select2-dropdown .select2-results__options .select2-results__option.select2-results__option--highlighted {
  color: #ef4869;
  background: #fff0f1;
}

/* ========================= */
/* ==== Global Settings ==== */
/* ========================= */
.connect-title {
  font-weight: 600;
  font-size: 22px;
  color: #1e293b;
  margin-bottom: 8px;
}
.connect-title.xs-text {
  font-size: 14px;
}
.connect-title.sm-text {
  font-size: 16px;
}
.connect-title.md-text {
  font-size: 18px;
}
.connect-title.xl-text {
  font-size: 20px;
}
.connect-title.xxl-text {
  font-size: 22px;
}

.connect-description {
  font-weight: 400;
  font-size: 15px;
  line-height: 24px;
  color: #475569;
}

@media only screen and (min-width: 230px) and (max-width: 768px) {
  .connect-title {
    font-size: 18px;
  }
  .connect-title.xs-text {
    font-size: 13px;
  }
  .connect-title.sm-text {
    font-size: 15px;
  }
  .connect-title.md-text {
    font-size: 16px;
  }
  .connect-title.xl-text {
    font-size: 18px;
  }
  .connect-title.xxl-text {
    font-size: 20px;
  }
  .connect-description {
    font-size: 13px;
    line-height: 18px;
  }
}
/* =========================== */
/* ==== Badge Components ==== */
/* =========================== */
.connect-badge {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  -ms-flex-direction: row;
  flex-direction: row;
  gap: 6px;
  padding: 3px 6px;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.3px;
  border-radius: 4px;
  background: #e03e64;
  color: #fff;
}
.connect-badge.outline {
  background: #fdced5;
  color: #e03e64;
}
.connect-badge.success {
  background: #118444;
  color: #fff;
}
.connect-badge.error {
  background: #DF3023;
  color: #fff;
}
.connect-badge.warning {
  background: #E5AD43;
  color: #fff;
}
.connect-badge.info {
  background: #2E93EA;
  color: #fff;
}
.connect-badge.success-outline {
  background: #b9f9d3;
  color: #118444;
}
.connect-badge.error-outline {
  background: #FFE1E2;
  color: #C51407;
}
.connect-badge.warning-outline {
  background: #FFF0D3;
  color: #BE861C;
}
.connect-badge.info-outline {
  background: #C0E9FD;
  color: #1F78D6;
}

/* ==== # End Badge Components ==== */
/* =============================== */
/* ==== Breadcrumb Components ==== */
/* =============================== */
.connect-breadcrumb {
  position: relative;
  display: flex;
  flex-direction: row;
}
.connect-breadcrumb:is(.bg) {
  background: #e2e8f0;
  border: 1px solid #cbd5e1;
  color: #475569;
  border-radius: 8px;
  padding: 12px 20px;
  width: max-content;
}
.connect-breadcrumb a {
  color: #94a3b8;
  text-decoration: none;
}
.connect-breadcrumb a:hover {
  color: #475569;
}
.connect-breadcrumb > ul {
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: row;
  gap: 10px;
}
.connect-breadcrumb > ul > li {
  font-size: 15px;
  font-weight: 500;
  display: flex;
  gap: 6px;
  align-items: center;
}
.connect-breadcrumb > ul > li .active {
  color: #64748b;
}
.connect-breadcrumb > ul > li:not(:last-child)::after {
  content: "\ea5c";
  font-weight: 600;
  font-family: lineicons !important;
  font-size: 14px;
  color: #64748b;
}

@media only screen and (min-width: 230px) and (max-width: 768px) {
  .connect-breadcrumb > ul {
    gap: 4px;
  }
  .connect-breadcrumb > ul > li {
    font-size: 13px;
  }
  .connect-breadcrumb > ul > li:not(:last-child)::after {
    font-size: 12px;
  }
}
/* ==== # End Breadrumb Components ==== */
/* ========================== */
/* ==== Alert Components ==== */
/* ========================== */
.connect-alert {
  padding: 24px 16px;
  background: #e2e8f0;
  color: #1e293b;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  -ms-flex-direction: row;
  flex-direction: row;
  gap: 12px;
}
.connect-alert > i {
  font-size: 20px;
}
.connect-alert.success {
  background: #b9f9d3;
  color: #136839;
}
.connect-alert.error {
  background: #FFE1E2;
  color: #C51407;
}
.connect-alert.warning {
  background: #FFF0D3;
  color: #9B680A;
}
.connect-alert.info {
  background: #DBF2FE;
  color: #1F78D6;
}
.connect-alert.primary {
  background: #334155;
  color: #f8fafc;
}
.connect-alert.success-primary {
  background: #136839;
  color: #fff;
}
.connect-alert.error-primary {
  background: #C51407;
  color: #fff;
}
.connect-alert.warning-primary {
  background: #9B680A;
  color: #fff;
}
.connect-alert.info-primary {
  background: #1F78D6;
  color: #fff;
}/*# sourceMappingURL=connect-app.css.map */