@charset "UTF-8";
/*!
* Burq.io Application
* Copyright 2023 Burq.io Application
*/
/*
  © 2022 Burq.io.
  User may not copy, modify, distribute, or re-bundle or otherwise make available this code;
*/
/*
	© 2022 Burq.io.
	User may not copy, modify, distribute, or re-bundle or otherwise make available this code;
*/
/* This function is used for font type PX to Em*/
@import "../css/helpers/prism.css";
@font-face {
  font-family: "popins";
  src: url("../../../../../fonts/poppins-regular-webfont.eot");
  src: url("../../../../../fonts/poppins-regular-webfont.eot?#iefix") format("embedded-opentype"), url("../../../../../fonts/poppins-regular-webfont.woff") format("woff"), url("../../../../../fonts/poppins-regular-webfont.ttf") format("truetype"), url("../../../../../fonts/poppins-regular-webfont.svg#popinspopins") format("svg");
  font-style: normal;
  font-weight: normal;
  speak: none;
  font-variant: normal;
  text-transform: none;
}
/*$clr-h2 : $mine-shaft;
$clr-h3 : $mine-shaft;
$clr-h4 : $primary;
*/
/*
Extra small xs Small to large phone < 600px

Small sm Small to medium tablet 600px > < 960px

Medium md Large tablet to laptop 960px > < 1280px

Large lg Desktop 1280px > < 1920px

Extra Large xl HD and 4k 1920px > < 2560px

Extra Extra Large xx 4k + and ultra-wide > = 2560px**/
/* This function is used for font type PX to Em*/
/* This function is used for font type PX to Em*/
@font-face {
  font-family: "app_icons";
  src: url("../../../../../assets/fonts/icomoon.eot");
  src: url("../../../../../assets/fonts/icomoon.eot?#iefix") format("embedded-opentype"), url("../../../../../assets/fonts/icomoon.woff") format("woff"), url("../../../../../assets/fonts/icomoon.ttf") format("truetype"), url("../../../../../assets/fonts/icomoon.svg#app_iconsapp_icons") format("svg");
  font-style: normal;
  font-weight: normal;
  speak: none;
  font-variant: normal;
  text-transform: none;
}
[class^=icon-], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: "app_icons" !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
}

.icon-Concatenate:before {
  content: "\e948";
}

.icon-Expression:before {
  content: "\e949";
}

.icon-actions-icons:before {
  content: "\e912";
  color: #737373;
}

.icon-add:before {
  content: "\e90e";
}

.icon-add-one:before {
  content: "\e90c";
}

.icon-analytics:before {
  content: "\e900";
  color: #666;
}

.icon-analytics-selected:before {
  content: "\e920";
  color: #666;
}

.icon-applications:before {
  content: "\e924";
  color: #666;
}

.icon-applications-selected:before {
  content: "\e925";
  color: #666;
}

.icon-arrow:before {
  content: "\e921";
  color: #3673ed;
}

.icon-arrow-right:before {
  content: "\e926";
  color: #3673ed;
}

.icon-button-arrow-right:before {
  content: "\e919";
}

.icon-close:before {
  content: "\e917";
}

.icon-common-dot:before {
  content: "\e905";
  color: #d8111e;
}

.icon-custom-icon-1:before {
  content: "\e94a";
}

.icon-delete:before {
  content: "\e906";
}

.icon-disabled-user:before {
  content: "\e94d";
}

.icon-down-arrow:before {
  content: "\e901";
  color: #3673ed;
}

.icon-download:before {
  content: "\e907";
}

.icon-drop-list:before {
  content: "\e94b";
}

.icon-dropdown-close:before {
  content: "\e913";
  color: #737373;
}

.icon-duplicate:before {
  content: "\e908";
}

.icon-duplicate1:before {
  content: "\e914";
}

.icon-edit:before {
  content: "\e91a";
}

.icon-filter:before {
  content: "\e927";
}

.icon-form-field-info:before {
  content: "\e947";
  color: #989898;
}

.icon-grid-layout:before {
  content: "\e909";
}

.icon-health-card-illustration:before {
  content: "\e90f";
}

.icon-home:before {
  content: "\e928";
  color: #666;
}

.icon-home-selected:before {
  content: "\e929";
}

.icon-integrations:before {
  content: "\e92a";
  color: #666;
}

.icon-integrations-selected:before {
  content: "\e922";
}

.icon-integrations-selected1:before {
  content: "\e92b";
  color: #666;
}

.icon-list:before {
  content: "\e923";
}

.icon-listing:before {
  content: "\e90d";
}

.icon-logo .path1:before {
  content: "\e92c";
  color: rgb(227, 56, 56);
}

.icon-logo .path2:before {
  content: "\e92d";
  margin-left: -3.6455078125em;
  color: rgb(255, 255, 255);
}

.icon-logo .path3:before {
  content: "\e92e";
  margin-left: -3.6455078125em;
  color: rgb(255, 255, 255);
}

.icon-logo .path4:before {
  content: "\e92f";
  margin-left: -3.6455078125em;
  color: rgb(255, 255, 255);
}

.icon-logo .path5:before {
  content: "\e930";
  margin-left: -3.6455078125em;
  color: rgb(51, 51, 64);
}

.icon-logo .path6:before {
  content: "\e931";
  margin-left: -3.6455078125em;
  color: rgb(51, 51, 64);
}

.icon-logo .path7:before {
  content: "\e932";
  margin-left: -3.6455078125em;
  color: rgb(51, 51, 64);
}

.icon-logo .path8:before {
  content: "\e933";
  margin-left: -3.6455078125em;
  color: rgb(51, 51, 64);
}

.icon-logo .path9:before {
  content: "\e934";
  margin-left: -3.6455078125em;
  color: rgb(51, 51, 64);
}

.icon-logo .path10:before {
  content: "\e935";
  margin-left: -3.6455078125em;
  color: rgb(227, 56, 56);
}

.icon-logo .path11:before {
  content: "\e936";
  margin-left: -3.6455078125em;
  color: rgb(227, 56, 56);
}

.icon-logo .path12:before {
  content: "\e937";
  margin-left: -3.6455078125em;
  color: rgb(227, 56, 56);
}

.icon-market-place:before {
  content: "\e938";
  color: #666;
}

.icon-market-place-selected:before {
  content: "\e939";
  color: #666;
}

.icon-more:before {
  content: "\e93a";
}

.icon-more-details:before {
  content: "\e91c";
}

.icon-more-info:before {
  content: "\e91d";
  color: #989898;
}

.icon-next-actions-type-2 .path1:before {
  content: "\e90a";
  color: rgb(230, 230, 230);
}

.icon-next-actions-type-2 .path2:before {
  content: "\e90b";
  margin-left: -1em;
  color: rgb(255, 255, 255);
}

.icon-notification:before {
  content: "\e911";
}

.icon-notification-with-number .path1:before {
  content: "\e93b";
  color: rgb(51, 51, 51);
}

.icon-notification-with-number .path2:before {
  content: "\e93c";
  margin-left: -1.03125em;
  color: rgb(255, 0, 0);
}

.icon-refresh:before {
  content: "\e93d";
}

.icon-refresh-history:before {
  content: "\e91b";
}

.icon-refresh-type2:before {
  content: "\e918";
}

.icon-required-field:before {
  content: "\e91e";
}

.icon-reset-password:before {
  content: "\e94e";
}

.icon-row-delete:before {
  content: "\e91f";
}

.icon-search:before {
  content: "\e93e";
}

.icon-search1:before {
  content: "\e915";
  color: #7a7a7a;
}

.icon-setting:before {
  content: "\e93f";
  color: #666;
}

.icon-setting-selected:before {
  content: "\e940";
  color: #666;
}

.icon-simple:before {
  content: "\e94c";
}

.icon-small-gray-left-arrow:before {
  content: "\e902";
  color: #989898;
}

.icon-small-gray-right-arrow:before {
  content: "\e903";
  color: #989898;
}

.icon-small-left-arrow-active:before {
  content: "\e904";
  color: #3673ed;
}

.icon-small-right-arrow-active:before {
  content: "\e910";
  color: #3673ed;
}

.icon-syc:before {
  content: "\e941";
}

.icon-system-health:before {
  content: "\e942";
  color: #3ea40c;
}

.icon-transactions:before {
  content: "\e943";
  color: #666;
}

.icon-transactions-selected:before {
  content: "\e944";
  color: #666;
}

.icon-upload:before {
  content: "\e916";
}

.icon-user-setup:before {
  content: "\e945";
  color: #666;
}

.icon-user-setup-selected:before {
  content: "\e946";
  color: #666;
}

/*
  © 2022 Burq.io.
  User may not copy, modify, distribute, or re-bundle or otherwise make available this code;
*/
/*
	© 2022 Burq.io.
	User may not copy, modify, distribute, or re-bundle or otherwise make available this code;
*/
/* This function is used for font type PX to Em*/
@font-face {
  font-family: "popins";
  src: url("../../../../../fonts/poppins-regular-webfont.eot");
  src: url("../../../../../fonts/poppins-regular-webfont.eot?#iefix") format("embedded-opentype"), url("../../../../../fonts/poppins-regular-webfont.woff") format("woff"), url("../../../../../fonts/poppins-regular-webfont.ttf") format("truetype"), url("../../../../../fonts/poppins-regular-webfont.svg#popinspopins") format("svg");
  font-style: normal;
  font-weight: normal;
  speak: none;
  font-variant: normal;
  text-transform: none;
}
/*$clr-h2 : $mine-shaft;
$clr-h3 : $mine-shaft;
$clr-h4 : $primary;
*/
/*
Extra small xs Small to large phone < 600px

Small sm Small to medium tablet 600px > < 960px

Medium md Large tablet to laptop 960px > < 1280px

Large lg Desktop 1280px > < 1920px

Extra Large xl HD and 4k 1920px > < 2560px

Extra Extra Large xx 4k + and ultra-wide > = 2560px**/
.mud-paper {
  border-radius: 0;
}

.mud-button {
  font-size: 1rem;
}

.mud-button-outlined-size-medium.button-icon-add {
  padding: 7px;
  border: 1px solid #D9D9D9;
  background: #ffffff;
}
.mud-button-outlined-size-medium.button-icon-add .mud-icon-size-medium {
  font-size: 16px;
  color: #333333;
}
.mud-button-outlined-size-medium.button-icon-more {
  padding: 10px;
  border-radius: 999px;
  border: 1px solid #D9D9D9;
  background: #ffffff;
}
.mud-button-outlined-size-medium.button-icon-more .mud-icon-size-medium {
  font-size: 12px;
}
.mud-button-outlined-size-medium.button-Carousel-moveable {
  padding: 0;
  border-radius: 999px;
  border-color: #ffffff;
}
.mud-button-outlined-size-medium.button-Carousel-moveable:hover {
  border: 1px solid #D9D9D9;
  background: #ffffff;
}
.mud-button-outlined-size-medium.button-Carousel-moveable .mud-icon-size-medium {
  font-size: 36px;
}
.mud-button-outlined-size-medium.button-icon-more-type2 {
  padding: 4px;
  border-radius: 999px;
  border: 1px solid #E6E6E6;
  background: #E6E6E6;
}
.mud-button-outlined-size-medium.button-icon-more-type2 .mud-icon-size-medium {
  font-size: 12px;
}
.mud-button-outlined-size-medium.button-icon-more-type2 .mud-icon-size-medium:before {
  color: #fff;
}

.mud-button-outlined.mud-button-outlined-tertiary {
  border-color: #D9D9D9;
}

/*.mud-drawer{
    background-color: #fff;
}*/
.mud-drawer-header {
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
}

.mud-chip.chip-has-icon {
  width: 60px;
  max-height: 48px;
}
.mud-chip.chip-has-icon img {
  width: 100%;
}
.mud-chip.mud-chip-size-medium.chip-type1 {
  font-weight: 500;
  font-size: 0.875rem;
  line-height: 1;
  padding: 16px 16px;
  border-radius: 8px;
  height: auto;
}
.mud-chip.mud-chip-size-medium.chip-type1.mud-chip-outlined {
  border-color: #D9D9D9;
}
.mud-chip.mud-chip-color-primary.mud-chip-selected {
  background-color: #3673ED;
  color: #fff;
  border-color: #3673ED;
}
.mud-chip.mud-chip-color-primary.mud-chip-selected:hover:not(.mud-disabled), .mud-chip.mud-chip-color-primary.mud-chip-selected:focus-visible:not(.mud-disabled) {
  background-color: #3673ED;
  color: #fff;
  border-color: #3673ED;
}

.mud-table.has-row-select .mud-table-root .mud-table-head .mud-table-row .mud-table-cell:first-child {
  width: 1rem;
}
.mud-table.has-row-click .mud-table-root .mud-table-body .mud-table-row:hover {
  background: #F1F5FE;
  cursor: pointer;
}

button {
  @apply rounded-full bg-gray-900 text-center py-2 px-4 text-white;
}

.main-application-logo {
  width: 7.1875rem;
  margin: 1.25rem;
}

.app-wrapper {
  height: 100vh;
}

.app-body-drawer {
  height: 100%;
  position: relative;
  overflow: hidden;
}

.left-drawer {
  border-radius: 0px 12px 12px 0px;
  padding: 20px 0;
  margin: 64px 0 0 0;
  height: calc(100% - 64px) !important;
}
.left-drawer .mud-drawer-content {
  display: flex;
  justify-content: space-between;
}
.left-drawer.mud-drawer-mini {
  overflow-x: hidden;
}

.loading-wrapper {
  position: fixed;
  width: 100%;
  height: 100%;
  text-align: center;
  display: flex;
  justify-content: center;
  align-content: center;
  background: url("../../../../../../../assets/svg/main-background.svg") no-repeat center;
}
.loading-wrapper .inner {
  flex: 1;
  display: flex;
  height: 100%;
}

/* Application footer */
.app-footer {
  text-align: center;
  border-top: solid 1px #D9D9D9;
  padding: 0 24px;
  min-width: 564px;
  margin: 24px 0 0 0;
  padding: 24px 0 0 0;
}
.app-footer .footer-content {
  font-size: 14px;
  font-weight: 400;
  padding: 8px 0 0 0;
}
.app-footer .footer-content .txt-powered {
  margin: 6px 0 12px 0;
  font-size: 10px;
}
.app-footer .footer-content .txt-product-details {
  margin: 8px 0 0 0;
  display: inline-block;
}
.app-footer .footer-content a {
  color: #DC143B;
}

.line-type-one {
  background-color: #D9D9D9;
  height: 1px;
  width: 100%;
  margin: 4px 0;
}

.app-tabs .mud-tabs-toolbar {
  border-bottom: 1px solid #D9D9D9;
}
.app-tabs .mud-tabs-toolbar .mud-tabs-toolbar-inner {
  min-height: 44px;
}
.app-tabs .mud-tab {
  color: #808080;
  font-weight: 400;
  font-size: 0.75rem;
  line-height: 1.5;
  text-transform: none;
  letter-spacing: normal;
  min-height: 44px;
}
.app-tabs .mud-tab.mud-tab-active {
  color: #1C1C1C;
  font-weight: 600;
}
.app-tabs .mud-tab-slider {
  background: rgb(242, 115, 126);
  background: linear-gradient(90deg, rgb(242, 115, 126) 0%, rgb(114, 138, 243) 100%);
}
.app-tabs .mud-tab-slider.mud-tab-slider-horizontal {
  height: 3px;
}
.app-tabs.has-scroll .mud-tabs-panels {
  height: calc(100vh - 286px);
  overflow-y: auto;
  /*padding-right: 12px;*/
}

.paper-type-1 {
  background: #ffffff;
  border: 1px solid #E6E6E6;
  border-radius: 16px;
  padding: 24px 20px;
}

.paper-type-2 {
  background: #ffffff;
  border: 1px solid #E6E6E6;
  border-radius: 12px;
  padding: 12px 16px;
  overflow: hidden;
}
.paper-type-2.has-full-height {
  height: calc(100vh - 180px);
}

.mud-expansion-panels .mud-expand-panel.expansion-panel-type-1 {
  border: solid 1px #D9D9D9;
  border-radius: 8px;
  margin-bottom: 16px;
  box-shadow: 0px 4px 10px rgba(115, 115, 115, 0.06);
}
.mud-expansion-panels .mud-expand-panel.expansion-panel-type-1 .mud-expand-panel-header {
  flex-direction: row-reverse;
  padding: 12px 28px;
}
.mud-expansion-panels .mud-expand-panel.expansion-panel-type-1 .mud-expand-panel-header .mud-icon-root {
  margin-right: 16px;
}
.mud-expansion-panels .mud-expand-panel.expansion-panel-type-1:last-child {
  border: solid 1px #D9D9D9;
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
}
.mud-expansion-panels .mud-expand-panel.expansion-panel-type-1.mud-panel-expanded .mud-expand-panel-header {
  border-bottom: solid 1px #D9D9D9;
  margin-bottom: 16px;
}
.mud-expansion-panels .mud-expand-panel.expansion-panel-type-1.inner-mb-0 .mud-expand-panel-header {
  margin-bottom: 0;
}

.common-inner-heading {
  background: #F5F5F5;
  padding: 10px 24px;
  margin-bottom: 24px;
}
.common-inner-heading .mud-typography-body2 {
  font-weight: 500;
  font-size: 0.8125rem;
  line-height: 1.5;
  color: #181818;
}
.common-inner-heading.full-width {
  margin-left: -24px;
  margin-right: -24px;
}

.navigation-drawer {
  background: #F5F5F5;
}

.main-navigation {
  height: 80%;
  overflow-y: auto;
}
.main-navigation .mud-nav-item {
  font-size: 0.875rem;
  color: #666666;
  margin-bottom: 10px;
}
.main-navigation .mud-nav-item .mud-nav-link {
  height: 2.5rem;
  padding: 8px 20px;
  justify-items: center;
  align-items: center;
  position: relative;
}
.main-navigation .mud-nav-item .mud-nav-link .mud-nav-link-text {
  display: flex;
  align-items: center;
  margin: 0;
  font-weight: 500;
  letter-spacing: 0.2px;
}
.main-navigation .mud-nav-item .mud-nav-link .mud-nav-link-text .menu-icon {
  font-size: 1.875rem;
  margin-right: 8px;
}
.main-navigation .mud-nav-item .mud-nav-link:hover:not(.mud-nav-link-disabled) {
  background-color: #ffffff;
}
.main-navigation .mud-nav-item .mud-nav-link.active:not(.mud-nav-link-disabled) {
  color: #333333;
  background-color: #ffffff;
}
.main-navigation .mud-nav-item .mud-nav-link.active:not(.mud-nav-link-disabled):before {
  position: absolute;
  content: "";
  left: 0;
  height: 100%;
  width: 4px;
  background: rgb(114, 138, 243);
  background: linear-gradient(0deg, rgb(114, 138, 243) 0%, rgb(242, 115, 126) 100%);
}
.main-navigation .mud-nav-item .mud-nav-link.active:not(.mud-nav-link-disabled) .mud-nav-link-text {
  font-weight: 600 !important;
}
.main-navigation .mud-nav-item .mud-nav-link.active:not(.mud-nav-link-disabled) .menu-icon {
  color: #333333;
}
.main-navigation .mud-nav-item .mud-nav-link.active .menu-icon:before {
  color: #666;
}
.main-navigation .mud-nav-item .mud-nav-link.active .icon-home:before {
  content: "\e929";
}
.main-navigation .mud-nav-item .mud-nav-link.active .icon-integrations:before {
  content: "\e922";
}
.main-navigation .mud-nav-item .mud-nav-link.active .icon-transactions:before {
  content: "\e944";
}
.main-navigation .mud-nav-item .mud-nav-link.active .icon-applications:before {
  content: "\e925";
}
.main-navigation .mud-nav-item .mud-nav-link.active .icon-user-setup:before {
  content: "\e946";
}
.main-navigation .mud-nav-item .mud-nav-link.active .icon-analytics:before {
  content: "\e920";
}
.main-navigation .mud-nav-item .mud-nav-link.active .icon-market-place:before {
  content: "\e939";
}
.main-navigation .mud-nav-item .mud-nav-link.active .icon-setting:before {
  content: "\e940";
}
.btn-main-menu-opener {
  width: 60px;
  margin: 0;
  height: 60px;
  position: relative;
  z-index: 10000;
  bottom: 0;
  right: 0;
}

.application-header-bar {
  box-shadow: 0px 4px 40px rgba(0, 0, 0, 0.06);
}
.application-header-bar .mud-container {
  padding: 0;
}
.application-header-bar .notification-block .icon-notification {
  position: relative;
  font-size: 2rem;
}
.application-header-bar .notification-block .icon-notification .dot {
  opacity: 0;
}
.application-header-bar .notification-block.has-notification .dot {
  position: absolute;
  width: 0.5rem;
  height: 0.5rem;
  background-color: #FF0000;
  opacity: 1;
  right: 0.4375rem;
  border-radius: 62.4375rem;
  top: 0.375rem;
}
.application-header-bar .logo-with-avatar {
  /* Auto layout */
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  padding: 0 0.75rem;
  gap: 0.3125rem;
  width: 10.130625rem;
  height: 38px;
  background: #ffffff;
  border: 1px solid #D9D9D9;
  border-radius: var(--mud-default-borderradius);
}
.application-header-bar .logo-with-avatar .logo-avatar {
  width: 6.25rem;
}
.application-header-bar .logo-with-avatar .avatar {
  width: 1.875rem;
  height: 1.875rem;
}

.inner-main-header {
  margin-top: 0;
}

.header-actions-wrapper {
  display: flex;
  width: 100%;
  height: 100%;
  justify-content: end;
  align-items: center;
}

.app-main-header {
  margin-top: 0;
}

.breadcrumb-block .mud-breadcrumbs {
  padding: 0;
  font-size: 0.75em;
  line-height: 1.75;
  font-weight: 400;
}
.breadcrumb-block .mud-breadcrumbs a {
  color: #333;
}
.breadcrumb-block .mud-breadcrumbs .mud-breadcrumb-separator {
  padding-left: 8px;
  padding-right: 8px;
}
.breadcrumb-block .mud-breadcrumbs .mud-disabled a {
  color: #989898;
}

.header-actions-wrapper {
  display: flex;
  width: 100%;
  height: 100%;
  justify-content: end;
  align-items: center;
}

/*$table-boder-color: $palette-border-color-one;
$table-header-background-color: #F5F5F5;*/
.mud-table-root .mud-table-head .mud-table-row .mud-table-cell {
  background-color: #F5F5F5;
  font-weight: 600;
  padding-top: 8px;
  padding-bottom: 8px;
  font-size: 0.8125rem;
  vertical-align: top;
  line-height: 1.5;
}
.mud-table-root .mud-table-body .mud-table-cell {
  padding-top: 9.2px;
  padding-bottom: 9.2px;
  height: 44px;
  font-size: 0.8125rem;
}
.mud-table-root .mud-table-body:last-child .mud-table-row:last-child .mud-table-cell {
  border-bottom: solid 1px #D9D9D9;
}

.mud-table.no-header-border .mud-table-head .mud-table-cell {
  border: none !important;
}

.mud-expansion-panels.row-details-wrapper {
  border: solid 1px #D9D9D9;
  overflow: hidden;
  border-radius: 0;
}
.mud-expansion-panels.row-details-wrapper .mud-expand-panel .mud-expand-panel-header {
  min-height: 2.375rem;
  padding-bottom: 0;
  padding-top: 0;
  background: #F5F5F5;
  margin: 0 !important;
}

.has-table-row-details .mud-table-container {
  padding: 10px 20px;
  background-color: #edeaea;
}
.has-table-row-details .mud-table-container .mud-table-root .mud-table-cell {
  line-height: 2;
  height: 34px;
  font-size: 0.725rem;
  padding-top: 4px;
  padding-bottom: 4px;
}
.has-table-row-details .mud-table-container .mud-table-root .mud-table-head .mud-table-row .mud-table-cell {
  background: #e3e3e3;
  padding-top: 6px;
  padding-bottom: 6px;
}
.has-table-row-details .mud-table-container .mud-table-root .mud-table-row .mud-table-cell {
  background: #ffffff;
}

.icon-button-secondary {
  border: 1px solid #E6E6E6;
  width: 40px;
  height: 40px;
}
.icon-button-secondary.icon-color-primary-black .mud-icon-root:before {
  color: #333333;
}
.icon-button-secondary .mud-icon-size-medium {
  font-size: 1.375rem;
}
.icon-button-secondary.no-border {
  border-color: transparent;
}
.icon-button-secondary.mud-icon-size-small {
  padding: 0;
  margin: 0;
  width: 1.75rem;
  height: 1.75rem;
}

.table-icon-button-secondary {
  border: none !important;
  padding: 0 !important;
  width: 30px;
  height: 30px;
}
.table-icon-button-secondary.icon-color-primary-black .mud-icon-root:before {
  color: #333333;
}
.table-icon-button-secondary .mud-icon-size-medium {
  font-size: 1.375rem;
}

.button-secondary {
  border: 1px solid #E6E6E6;
  font-size: 1rem;
  color: #333333;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1;
  padding-top: 8px;
  padding-bottom: 8px;
}
.button-secondary .mud-icon-size-medium {
  font-size: 1.375rem;
}

.mud-button {
  text-transform: none;
}

.icon-button-list-view .mud-icon-root {
  margin-left: -4px;
}

.mud-button-filled-size-medium {
  font-weight: 400;
}

input::file-selector-button {
  border: 1px solid #E6E6E6;
  font-size: 1rem;
  color: #333333;
  background-color: transparent;
  letter-spacing: normal;
  font-weight: 400;
  line-height: 1;
  padding: 8px 16px;
  border-radius: 4px;
  cursor: pointer;
}
input::file-selector-button:hover {
  background: #3673ED;
  color: #ffffff;
}

.form-label {
  color: #333333;
}

.mud-input {
  font-size: 0.875rem;
  line-height: 21px;
  background: #F7F7F7;
}
.mud-input.mud-input-outlined .mud-input-outlined-border {
  border: 1px solid #D9D9D9;
  border-radius: 4px;
}
.mud-input.mud-input-outlined.mud-input-adorned-end {
  padding-right: 8px;
  padding-inline-end: 8px;
}

.mud-input > input.mud-input-root-outlined.mud-input-root-margin-dense,
div.mud-input-slot.mud-input-root-outlined.mud-input-root-margin-dense {
  padding: 14px 12px;
}

.form-data-display {
  color: #333333;
  font-size: 0.9375rem;
  font-weight: 500;
  line-height: 2;
  margin-top: 4px;
}

.mud-picker-inline .mud-input > input.mud-input-root-outlined {
  padding: 14px 14px;
}

.mud-input-control.has-join:after {
  content: "";
  height: 2px;
  width: 50px;
  background: #D9D9D9;
  position: absolute;
  top: 21px;
  right: -49px;
  z-index: 0;
}

.mud-list-item-text .mud-typography {
  font-size: 14px !important;
  font-weight: 400;
  line-height: 1;
}

.login-wrapper {
  width: 100%;
  height: 100vh;
  text-align: center;
  display: flex;
  justify-content: center;
  align-content: center;
  background: url("../../../../../../../assets/svg/main-background.svg") no-repeat center;
}
.login-wrapper .inner {
  flex: 1;
  display: flex;
  flex-direction: row;
}
.login-wrapper .inner .vedio-wrapper {
  display: flex;
}
.login-wrapper .inner .content {
  display: flex;
  flex-direction: column;
  min-width: 476px;
  width: 476px;
  padding: 0 96px 0 66px;
  background: #FFFFFF;
  height: 100%;
  align-self: flex-end;
  overflow: hidden;
  text-align: left;
  align-items: center;
  justify-content: space-between;
  flex: 1;
}
.login-wrapper .inner .content img {
  width: 152.72px;
  margin: 76px 0 16px 0;
}
.login-wrapper .inner .content h1 {
  font-weight: 400;
  font-size: 2em;
  line-height: 56px;
}
.login-wrapper .inner .content h6 {
  font-weight: 400;
  font-size: 1.125em;
  line-height: 27px;
  margin-bottom: 28px;
}
.login-wrapper .inner .content .form-block {
  text-align: left;
}
.login-wrapper .inner .content .remember-me .mud-typography {
  font-size: 0.75rem;
  color: #989898;
}
.login-wrapper .inner .content .remember-me .mud-button-root {
  padding: 0 4px 0 0;
}
.login-wrapper .inner .content .forgot-password {
  font-size: 0.75rem;
  padding: 0;
  font-weight: normal;
}
.login-wrapper .inner .login-footer {
  text-align: center;
  align-self: center;
  color: #989898;
  margin-bottom: 56px;
}
.login-wrapper .inner .login-footer .mud-button {
  font-size: 0.875rem;
}

.terms-text {
  color: #989898;
}
.terms-text .mud-link {
  font-size: 0.875rem;
  color: #333333 !important;
  text-decoration: none;
}

.main-data-info-wrapper {
  border-top: 1px solid #D9D9D9;
  padding-top: 20px;
  padding-top: 20px;
  margin-left: -24px;
  margin-right: -12px;
  padding-left: 24px;
  padding-right: 12px;
}

.header-home {
  margin: 0 0 12px 0;
}

.connectors-info-wrapper {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  /* padding: ($base-space*3) 0;*/
  gap: 8px;
  width: 100%;
  flex: none;
  order: 1;
  flex-grow: 0;
}

.create-new-block-one {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  padding: 24px 12px 16px;
  gap: 32px;
  width: auto;
  border-radius: 12px;
  flex: auto;
  order: 1;
  align-self: stretch;
  flex-grow: 1;
  background: #D9D9D9;
  box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
  background: url("../../../../../assets/svg/new-workspace-background-color.svg") center center no-repeat;
  background-size: 150%;
  position: relative;
}
.create-new-block-one:before {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  background: url("../../../../../assets/svg/dashboard-create-new-workspace-background.svg") center right no-repeat;
  background-size: contain;
  right: 0;
  top: 0;
}
.create-new-block-one .create-new_header {
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  flex: none;
  order: 0;
  display: flex;
  flex-grow: 1;
  width: 55%;
}
.create-new-block-one .create-new_header .heading {
  flex: auto;
  order: 0;
  align-self: stretch;
  flex-grow: 1;
  line-height: 24px;
}
.create-new-block-one .create-new_footer {
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  flex: none;
  order: 0;
  display: flex;
  flex-grow: 0;
  width: 100%;
  min-height: 60px;
}
.create-new-block-one .create-new_footer .button-box {
  flex: auto;
  order: 0;
  display: flex;
  align-items: center;
  flex-grow: 1;
}
.create-new-block-one .create-new_footer .button-box .text-label {
  margin-left: 8px;
  font-weight: 500;
}

.create-new-block-two {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  width: auto;
  border-radius: 12px;
  flex: auto;
  order: 1;
  align-self: stretch;
  flex-grow: 1;
  box-shadow: 0px 1px 4px rgba(58, 58, 58, 0.08);
  background: linear-gradient(70.69deg, #CCD6FF 0%, #FEECED 29.69%, #FFE7E9 43.75%, #FFADB5 100%);
  text-align: center;
  padding: 16px 40px 16px;
  min-height: 194px;
}
.create-new-block-two .heading {
  line-height: 24px;
}
.create-new-block-two .button-box {
  flex: auto;
  order: 0;
  display: flex;
  align-items: center;
  flex-grow: 1;
}
.create-new-block-two .button-box .text-label {
  margin-left: 8px;
  font-weight: 500;
}

.dashboard-tabs-wrapper .mud-tabs-toolbar-wrapper {
  width: 100%;
  border-bottom: 1px solid #D9D9D9;
}
.dashboard-tabs-wrapper .mud-tabs-toolbar-wrapper .d-inline-block {
  width: 33.33% !important;
}
.dashboard-tabs-wrapper .mud-tab.home-dashboard-tab-item {
  color: #808080;
}
.dashboard-tabs-wrapper .mud-tab.home-dashboard-tab-item .tab-type-dot {
  filter: invert(54%) sepia(0%) saturate(0%) hue-rotate(344deg) brightness(93%) contrast(90%);
}
.dashboard-tabs-wrapper .mud-tab.home-dashboard-tab-item .label-chip {
  width: 26px;
  height: 25px;
  background: #E6E6E6;
  border-radius: 50px;
  font-weight: 500;
  font-size: 12px;
  line-height: 24px;
  text-align: center;
  margin: 0 4px;
}
.dashboard-tabs-wrapper .mud-tab.home-dashboard-tab-item .text-label {
  color: #808080;
  font-weight: 400;
  font-size: 0.75rem;
  line-height: 15px;
  text-transform: none;
  letter-spacing: normal;
}
.dashboard-tabs-wrapper .mud-tab.home-dashboard-tab-item.mud-tab-active .text-label {
  color: #1C1C1C;
  font-weight: 600;
}
.dashboard-tabs-wrapper .mud-tab.home-dashboard-tab-item.mud-tab-active .label-chip {
  width: 28px;
  height: 28px;
  overflow: hidden;
  font-weight: 600;
  font-size: 16px;
  line-height: 29px;
  letter-spacing: 0;
}
.dashboard-tabs-wrapper .mud-tab.home-dashboard-tab-item.tab-failure-transaction.mud-tab-active .tab-type-dot {
  filter: invert(16%) sepia(97%) saturate(5977%) hue-rotate(351deg) brightness(86%) contrast(96%);
}
.dashboard-tabs-wrapper .mud-tab.home-dashboard-tab-item.tab-failure-transaction.mud-tab-active .label-chip {
  background-color: #F5E9EA;
  color: #D8111E;
}
.dashboard-tabs-wrapper .mud-tab.home-dashboard-tab-item.tab-pending-transaction.mud-tab-active .tab-type-dot {
  filter: invert(63%) sepia(83%) saturate(1943%) hue-rotate(4deg) brightness(104%) contrast(97%);
}
.dashboard-tabs-wrapper .mud-tab.home-dashboard-tab-item.tab-pending-transaction.mud-tab-active .label-chip {
  background-color: #FEF1D7;
  color: #F5A504;
}
.dashboard-tabs-wrapper .mud-tab.home-dashboard-tab-item.tab-success-transaction.mud-tab-active .tab-type-dot {
  filter: invert(50%) sepia(92%) saturate(2037%) hue-rotate(65deg) brightness(92%) contrast(91%);
}
.dashboard-tabs-wrapper .mud-tab.home-dashboard-tab-item.tab-success-transaction.mud-tab-active .label-chip {
  background-color: #EEFDE7;
  color: #3EA40C;
}

.data-info_header {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  margin-bottom: 20px;
}

.application-health-meter {
  border-radius: 12px;
  background: pink;
  min-height: 283px;
  padding: 12px 16px;
  background: #ffffff;
  box-shadow: 0px 26px 40px rgba(58, 58, 58, 0.08);
}
.application-health-meter.health-excellent {
  background: linear-gradient(258.02deg, #3EA40C -84.59%, #D6ECCC -29.19%, #FFFFFF 77.97%, #FFFFFF 112.4%);
}
.application-health-meter.health-excellent h2, .application-health-meter.health-excellent .icon-system-health:before {
  color: #3EA40C;
}
.application-health-meter.health-average {
  background: linear-gradient(258.02deg, #F5A504 -84.59%, #FEE5B4 -29.19%, #FFFFFF 77.97%, #FFFFFF 112.4%);
}
.application-health-meter.health-average h2, .application-health-meter.health-average .icon-system-health:before {
  color: #F5A504;
}
.application-health-meter.health-bad {
  background: linear-gradient(258.02deg, #E33838 -84.59%, #F6C0C0 -29.19%, #FFFFFF 77.97%, #FFFFFF 112.4%);
}
.application-health-meter.health-bad h2, .application-health-meter.health-bad .icon-system-health:before {
  color: #E33838;
}
.application-health-meter .mud-typography-body2 {
  line-height: 1.3125em;
}
.application-health-meter .health-meter_top-block {
  min-height: 104px;
  display: flex;
  justify-items: center;
  align-items: center;
}
.application-health-meter .health-meter_top-block .health-heart-element {
  text-align: center;
}
.application-health-meter .health-meter_top-block .health-heart-element .icon-system-health {
  font-size: 4.875em;
}
.application-health-meter .health-meter_bottom-block {
  min-height: 120px;
  display: flex;
  justify-items: center;
  align-items: center;
}
.application-health-meter .health-meter_bottom-block img {
  max-width: 100%;
}

.dashboard-connector-block .connector-info-details-block {
  width: 25%;
}

.connections-details-wrapper {
  border-radius: 16px;
}
.connections-details-wrapper .mud-table {
  width: 100%;
  border-radius: 0;
}

.home-total-numbers-details {
  padding: 0 12px;
}
.home-total-numbers-details .mud-typography-body1 {
  color: #9CA0A8;
  font-weight: 500;
}
.home-total-numbers-details .mud-typography-h3 {
  font-weight: 500;
  font-size: 42px;
  line-height: 63px;
}
@media (max-width: 1280px) {
  .home-total-numbers-details {
    padding: 0 0px;
  }
}

.connections-details-inner-block {
  display: flex;
  flex-direction: column;
  height: 100%;
}
.connections-details-inner-block .home-connections-detail-header {
  width: 100%;
  margin-bottom: 16px;
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 0 12px;
}
.connections-details-inner-block .home-connections-detail-header img {
  border-radius: 999px;
  width: 44px;
  margin-right: 12px;
}
.connections-details-inner-block .home-connections-detail-header h3 {
  display: inline-flex;
}
@media (max-width: 1280px) {
  .connections-details-inner-block .home-connections-detail-header {
    padding: 0 0px;
  }
}

.connection-data-block {
  height: 340px;
}
@media (max-width: 1280px) {
  .connection-data-block {
    height: 600px;
  }
}

.mud-carousel-swipe {
  margin-bottom: -12px;
}

.moveable-prevoius {
  position: absolute;
  left: 10%;
  bottom: 0;
}
.moveable-prevoius .mud-icon-size-medium {
  font-size: 2.25rem;
}
@media (min-width: 1280px) {
  .moveable-prevoius {
    left: 37%;
  }
}

.moveable-next {
  position: absolute;
  right: 10%;
  bottom: 0;
}
.moveable-next .mud-icon-size-medium {
  font-size: 2.25rem;
}
@media (min-width: 1280px) {
  .moveable-next {
    right: 37%;
  }
}

.mud-table-cell .icon-common-dot {
  font-size: 8px;
}
.mud-table-cell .icon-common-dot.has-info:before {
  color: #3EA40C;
}
.mud-table-cell .icon-common-dot.has-debug:before {
  color: #F5A504;
}
.mud-table-cell .icon-common-dot.has-error:before {
  color: #D8111E;
}
.mud-table-cell .icon-common-dot.has-offline:before {
  color: #D8111E;
}
.mud-table-cell .icon-common-dot.has-online:before {
  color: #3EA40C;
}
.mud-table-cell .icon-common-dot.has-success:before {
  color: #3EA40C;
}
.mud-table-cell .icon-common-dot.has-quened:before {
  color: #F5A504;
}
.mud-table-cell .icon-common-dot.has-new:before {
  color: #1890FF;
}
.mud-table-cell .icon-common-dot.has-failure:before {
  color: #D8111E;
}
.mud-table-cell .icon-common-dot.has-enabled:before {
  color: #3EA40C;
}
.mud-table-cell .icon-common-dot.has-disabled:before {
  color: #D8111E;
}

.mud-table-root .mud-table-head .mud-table-row .mud-table-cell {
  border-top: solid 1px #D9D9D9;
}

.connection-datatable .mud-table-root .mud-table-row .mud-table-cell {
  padding-top: 26px;
}

.apps-info-details-block {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  padding: 24px 12px 16px;
  gap: 32px;
  width: auto;
  background: #F1F5FE;
  border-radius: 12px;
  flex: auto;
  order: 1;
  align-self: stretch;
  flex-grow: 1;
}
.apps-info-details-block .apps-info-details_header {
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  flex: none;
  order: 0;
  display: flex;
  flex-grow: 1;
  width: 100%;
  min-height: 62px;
}
.apps-info-details-block .apps-info-details_header .heading {
  flex: auto;
  order: 0;
  align-self: stretch;
  flex-grow: 1;
  line-height: 24px;
}
.apps-info-details-block .apps-info-details_header .heading img {
  height: 3.625rem;
}
.apps-info-details-block .apps-info-details_header .icon-more {
  font-size: 1.625em;
}
.apps-info-details-block .apps-info-details_footer {
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-end;
  flex: none;
  order: 0;
  display: flex;
  flex-grow: 0;
  width: 100%;
  min-height: 60px;
}
.apps-info-details-block .apps-info-details_footer .numbers-box {
  order: 0;
  flex-grow: 1;
  display: flex;
  position: relative;
  flex-direction: column;
  position: relative;
}
.apps-info-details-block .apps-info-details_footer .numbers-box.has-breaker:before {
  content: "";
  height: 100%;
  width: 1px;
  background-color: #bbb;
  position: absolute;
  left: -8px;
}
.apps-info-details-block .apps-info-details_footer .numbers-box .text-number {
  font-size: 1.25rem;
  color: #3673ED;
  line-height: 1.125em;
  font-weight: 600;
  margin-right: 8px;
}
.apps-info-details-block .apps-info-details_footer .numbers-box .text-number.color-offline {
  color: #D8111E;
}
.apps-info-details-block .apps-info-details_footer .numbers-box .text-label {
  margin-top: 4px;
  font-weight: 500;
  font-size: 0.75rem;
}

.seacrh-textfeild .mud-input {
  background-color: #F7F7F7;
  border-radius: 8px;
}
.seacrh-textfeild .mud-input > input.mud-input-root-outlined {
  padding-bottom: 14px;
  padding-top: 14px;
  padding-left: 14px;
  font-size: 0.875em;
}
.seacrh-textfeild .mud-input .mud-input-outlined-border {
  border-color: #F7F7F7;
}
.seacrh-textfeild .mud-input .mud-icon-size-medium {
  font-size: 1.09375rem;
}
.workspace-card-block {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  padding: 20px 12px 16px;
  width: auto;
  background: #fff;
  flex: auto;
  order: 1;
  align-self: stretch;
  flex-grow: 1;
  border-bottom: 1px solid #D9D9D9;
  cursor: pointer;
}
.workspace-card-block.selected, .workspace-card-block:hover, .workspace-card-block.selected:hover {
  border-radius: 4px;
  background: #F5F5F5;
}
.workspace-card-block.selected .heading, .workspace-card-block:hover .heading, .workspace-card-block.selected:hover .heading {
  font-weight: 600;
}
.workspace-card-block.selected .button-more, .workspace-card-block:hover .button-more, .workspace-card-block.selected:hover .button-more {
  background: #ffffff;
}
.workspace-card-block:hover .heading {
  font-weight: 400;
}
.workspace-card-block .workspace-card_content {
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  flex: none;
  order: 0;
  display: flex;
  flex-grow: 1;
  width: 100%;
}
.workspace-card-block .workspace-card_content .heading {
  display: flex;
  align-self: center;
  font-size: 1em;
}
.workspace-card-block .workspace-card_content .button-more {
  padding: 4px;
  margin-left: 8px;
}
.workspace-card-block .workspace-card_content .icon-more {
  font-size: 1.625rem;
}

.table-icon-transformation {
  font-size: 2.375em;
}

.text-icon-wrap {
  white-space: nowrap;
  display: flex;
  align-self: center;
  align-items: center;
  justify-content: center;
}
.text-icon-wrap img {
  margin-right: 4px;
}

.mapping-row {
  display: flex;
  width: 100%;
}
.mapping-row .col-1 {
  width: 46%;
}
.mapping-row .col-3 {
  width: 12.5%;
}
.mapping-row .mud-paper {
  display: flex;
}
.mapping-row .mud-input-input-control {
  width: 40%;
}
.mapping-row .mud-input-input-control .mud-input-outlined-border {
  border-right: none;
  border-radius: 4px 0 0 4px;
}
.mapping-row .mud-select {
  width: 59%;
  margin-left: -4px;
}
.mapping-row .mud-select .mud-select-input .mud-input-slot {
  color: #1890FF;
  font-style: italic;
}
.mapping-row .mud-select .mud-input-outlined-border {
  border-left: none;
  border-radius: 0 4px 4px 0;
}
.mapping-row .mud-select.has-join:after {
  content: "";
  height: 2px;
  width: 50px;
  background: #D9D9D9;
  position: absolute;
  top: 21px;
  right: -49px;
  z-index: 0;
}

.select-has-icon .mud-select-input {
  display: flex !important;
  align-items: center;
}

.workspace-header {
  background: #F5F5F5;
  padding: 10px 24px;
  margin-bottom: 24px;
}
.workspace-header .mud-typography-body2 {
  font-weight: 500;
  font-size: 0.8125rem;
  line-height: 1.5;
  color: #181818;
}

.workspace-activity-wrapper {
  margin-bottom: 24px;
}
.workspace-activity-wrapper .activity-header {
  display: flex;
  align-items: center;
  flex-direction: row;
  width: 100%;
  justify-content: space-between;
  margin-bottom: 6px;
}
.workspace-activity-wrapper .activity-header .mud-typography-body1 {
  display: flex;
  flex: auto;
  white-space: nowrap;
  align-items: center;
  color: #989898;
}
.workspace-activity-wrapper .activity-header .mud-typography-body1:after {
  content: "";
  width: 100%;
  height: 1px;
  background: #D9D9D9;
  display: flex;
  margin-left: 7px;
  margin-right: 8px;
}
.workspace-activity-wrapper .activity-log-content .log-date {
  font-weight: 500;
  font-size: 0.9375rem;
  line-height: 22px;
  padding: 10px 16px;
}
.workspace-activity-wrapper .activity-log-content .log-info {
  background: #F5F5F5;
  padding: 14px 16px;
}
.workspace-activity-wrapper .activity-log-content .log-info .mud-typography-body2 {
  font-weight: 400;
  font-size: 0.8125rem;
  line-height: 1.5;
  color: #181818;
}

/*  */
/*.workspace-header {
    background: #F5F5F5;
    padding: ($base-space*2.5) ($base-space*6);
    margin-bottom: ($base-space*6);

    .mud-typography-body2 {
        font-weight: 500;
        font-size: rem(13);
        line-height: 1.5;
        color: #181818;
    }
}
*/
.datapacket-json-wrapper {
  margin-bottom: 24px;
}
.datapacket-json-wrapper .activity-header {
  display: flex;
  align-items: center;
  flex-direction: row;
  width: 100%;
  justify-content: space-between;
  margin-bottom: 20px;
  margin-top: 24px;
}
.datapacket-json-wrapper .activity-header .mud-typography-body1 {
  display: flex;
  flex: auto;
  white-space: nowrap;
  align-items: center;
}
.datapacket-json-wrapper .activity-header .mud-typography-body1 .activity-header__heading {
  display: flex;
  flex-direction: column;
}
.datapacket-json-wrapper .activity-header .mud-typography-body1 .activity-header__heading .base-date {
  color: #333;
  font-size: 0.9375rem;
  font-weight: 500;
}
.datapacket-json-wrapper .activity-header .mud-typography-body1 .activity-header__heading .date {
  font-size: 0.75rem;
  color: #989898;
}
.datapacket-json-wrapper .activity-header .mud-typography-body1:after {
  content: "";
  width: 100%;
  height: 1px;
  background: #D9D9D9;
  display: flex;
  margin-left: 7px;
  margin-right: 8px;
}
.datapacket-json-wrapper .activity-log-content .log-date {
  font-weight: 500;
  font-size: 0.9375rem;
  line-height: 22px;
  padding: 10px 16px;
}
.datapacket-json-wrapper .activity-log-content .log-info {
  background: #F5F5F5;
  padding: 14px 16px;
}
.datapacket-json-wrapper .activity-log-content .log-info .mud-typography-body2 {
  font-weight: 400;
  font-size: 0.8125rem;
  line-height: 1.5;
  color: #181818;
}

.json-viewers {
  background: #F5F5F5;
  display: flex;
  font-size: 14px;
  font-weight: 400;
  padding: 12px;
  overflow: auto;
}
.json-viewers.height-type1 {
  max-height: 247px;
  min-height: 247px;
}

.connection-config-container {
  padding: 24px;
}
.connection-config-container .connection-config-wrapper {
  padding: 24px;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.config-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 24px;
}
.config-header .config-title {
  font-weight: 600;
  color: #1976d2;
  margin: 0;
}
.config-header .config-header-actions {
  display: flex;
  align-items: center;
  gap: 16px;
}
.config-header .config-header-actions .advanced-toggle {
  margin-right: 8px;
}

.config-content {
  display: flex;
  gap: 24px;
  min-height: 600px;
}
.config-content .config-sidebar {
  width: 250px;
  flex-shrink: 0;
}
.config-content .config-sidebar .sidebar__nav-menu {
  border-radius: 8px;
  padding: 8px;
}
.config-content .config-sidebar .sidebar__nav-menu .sidebar__nav-link {
  border-radius: 6px;
  margin-bottom: 4px;
  transition: all 0.2s ease;
}
.config-content .config-sidebar .sidebar__nav-menu .sidebar__nav-link:hover {
  background-color: rgb(232, 235, 242);
}
.config-content .config-sidebar .sidebar__nav-menu .sidebar__nav-link.sidebar__nav-link--active {
  background-color: rgba(30, 125, 219, 0.078);
}
.config-content .config-main {
  flex: 1;
  padding-left: 24px;
}

.config-section__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}
.config-section__title {
  font-weight: 600;
  color: #333;
  margin: 0;
}
.config-section__divider {
  margin: 16px 0 24px 0;
}
.config-section__test-btn {
  margin-left: 16px;
  transition: all 0.2s ease;
}
.config-section__test-btn:hover:not(:disabled) {
  transform: translateY(-1px);
}
.config-section__test-btn .ml-2 {
  margin-left: 8px;
}
.config-section__field {
  margin-top: 20px !important;
}
.config-section__connection-name .mud-input-control {
  border-left: 4px solid #1976d2;
  padding-left: 12px;
  background-color: #f8f9fa;
}
.config-section__connection-name .mud-input-control:focus-within {
  background-color: #ffffff;
  border-left-color: #1565c0;
}

.config-section__parameter-row {
  display: flex;
  align-items: flex-end;
  gap: 16px;
  margin-bottom: 16px;
}
.config-section__parameter-key {
  flex: 1;
}
.config-section__parameter-value {
  flex: 2;
}
.config-section__parameter-delete {
  flex-shrink: 0;
  height: 40px;
  width: 40px;
  min-height: 40px;
  min-width: 40px;
  margin-left: 8px;
}
.config-section__parameter-delete .mud-button-root {
  height: 100%;
  width: 100%;
  border-radius: 50%;
  background-color: #f44336;
  color: white;
}
.config-section__parameter-delete .mud-button-root:hover {
  background-color: #d32f2f;
  transform: scale(1.1);
  transition: all 0.2s ease;
}
.config-section__parameter-delete .mud-button-root .mud-icon-root {
  color: white;
  font-size: 18px;
}
.config-section__add-btn {
  margin-top: 16px;
  border: 2px dashed #1976d2;
  background-color: #f8f9fa;
  transition: all 0.2s ease;
}
.config-section__add-btn:hover {
  background-color: #e3f2fd;
  border-color: #1565c0;
  transform: translateY(-1px);
}
.config-section__add-btn .mud-button-label {
  font-weight: 500;
}
.config-section__empty-state {
  text-align: center;
  padding: 32px 24px;
  color: #666;
  font-style: italic;
  background-color: #f8f9fa;
  border-radius: 8px;
  border: 2px dashed #e0e0e0;
  margin: 16px 0;
}
.config-section__empty-state i {
  display: block;
  margin-bottom: 12px;
  font-size: 48px !important;
  color: #ccc !important;
}
.config-section__empty-state div {
  font-size: 14px;
  line-height: 1.4;
  margin-top: 8px;
}
.config-section__empty-state .icon-empty-http:before,
.config-section__empty-state .icon-empty-settings:before {
  font-size: 48px;
  color: #ccc;
}
.config-section__body-content {
  font-family: "Consolas", "Monaco", "Courier New", monospace;
}
.config-section__body-content .mud-input-text-area {
  font-family: inherit;
}

.config-footer {
  display: flex;
  justify-content: flex-end;
  gap: 16px;
  padding-top: 16px;
}
.config-footer .config-btn__save {
  color: #ffffff !important;
  background: linear-gradient(45deg, #1976d2, #42a5f5);
  transition: all 0.3s ease;
}
.config-footer .config-btn__save:hover:not(:disabled) {
  background: linear-gradient(45deg, rgb(19.5744680851, 92.3914893617, 164.4255319149), #42a5f5);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(20, 86, 220, 0.3);
}
.config-footer .config-btn__save:disabled {
  color: #ffffff !important;
  background: linear-gradient(45deg, #1890FF, rgb(75, 168.5064935065, 255)) !important;
  opacity: 0.7;
  cursor: not-allowed;
}

@media (max-width: 1024px) {
  .config-content {
    flex-direction: column;
  }
  .config-content .config-sidebar {
    width: 100%;
  }
  .config-content .config-sidebar .mud-nav-menu {
    display: flex;
    overflow-x: auto;
  }
  .config-content .config-sidebar .mud-nav-menu .mud-nav-link {
    white-space: nowrap;
    margin-right: 8px;
    margin-bottom: 0;
  }
  .config-content .config-main {
    padding-left: 0;
    padding-top: 16px;
  }
}
@media (max-width: 768px) {
  .connection-config-container {
    padding: 16px;
  }
  .config-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }
  .config-header .config-header-actions {
    width: 100%;
    justify-content: space-between;
  }
  .config-section__parameter-row {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
    padding: 16px;
  }
  .config-section__parameter-row .config-section__parameter-delete {
    align-self: center;
    margin-top: 8px;
    margin-left: 0;
    height: 44px;
    width: 44px;
    min-height: 44px;
    min-width: 44px;
  }
  .config-section__parameter-row .config-section__parameter-delete .mud-button-root {
    height: 100%;
    width: 100%;
  }
  .config-footer {
    flex-direction: column-reverse;
  }
  .config-footer .config-btn__save,
  .config-footer .cancel-btn {
    width: 100%;
  }
}
.mud-progress-linear {
  margin: 24px 0;
}

.mud-input-error .mud-input-text {
  border-color: #f44336;
}

.connection-config-wrapper .mud-paper {
  box-shadow: none;
}
.connection-config-wrapper .mud-switch .mud-switch-label {
  font-weight: 500;
}
.connection-config-wrapper .mud-nav-link {
  padding: 12px 16px;
}
.connection-config-wrapper .mud-nav-link .mud-nav-link-text {
  font-weight: 500;
}
.connection-config-wrapper .mud-nav-link .mud-nav-link-icon {
  margin-right: 12px;
}

.icon-connection-security:before {
  content: "\e947";
  color: #1976d2;
}

.icon-connection-http:before {
  content: "\e912";
  color: #1976d2;
}

.icon-connection-settings:before {
  content: "\e93f";
  color: #1976d2;
}

.icon-connection-code:before {
  content: "\e949";
  color: #1976d2;
}

.icon-connection-test:before {
  content: "\e921";
  color: #1976d2;
}

.icon-connection-add:before {
  content: "\e90e";
  color: #1976d2;
}

.icon-connection-delete:before {
  content: "\e906";
  color: #f44336;
}

.icon-empty-http:before {
  content: "\e912";
  color: #ccc;
}

.icon-empty-settings:before {
  content: "\e93f";
  color: #ccc;
}

.connection-config-icons .icon-connection-security,
.connection-config-icons .icon-connection-http,
.connection-config-icons .icon-connection-settings,
.connection-config-icons .icon-connection-code {
  font-size: 18px;
}
.connection-config-icons .icon-connection-test,
.connection-config-icons .icon-connection-add {
  font-size: 16px;
}
.connection-config-icons .icon-connection-delete {
  font-size: 16px;
}
.connection-config-icons .icon-empty-http,
.connection-config-icons .icon-empty-settings {
  font-size: 48px;
}

.config-sidebar .mud-nav-link .icon-connection-security,
.config-sidebar .mud-nav-link .icon-connection-http,
.config-sidebar .mud-nav-link .icon-connection-settings,
.config-sidebar .mud-nav-link .icon-connection-code {
  margin-right: 12px;
  font-size: 24px !important;
}
.config-sidebar .mud-nav-link.nav-link-active .icon-connection-security,
.config-sidebar .mud-nav-link.nav-link-active .icon-connection-http,
.config-sidebar .mud-nav-link.nav-link-active .icon-connection-settings,
.config-sidebar .mud-nav-link.nav-link-active .icon-connection-code {
  color: #1976d2 !important;
}

.config-header-actions .icon-connection-test {
  margin-right: 8px;
}

.config-section__add-btn .icon-connection-add {
  margin-right: 8px;
}

.config-section__parameter-delete .mud-button-root .icon-connection-delete {
  color: white !important;
  font-size: 16px !important;
}

.config-section__empty-state .icon-empty-http,
.config-section__empty-state .icon-empty-settings {
  margin-bottom: 12px;
  display: block;
  font-size: 48px !important;
  color: #ccc !important;
}

.advanced-mode .config-section .config-section__field.advanced-field {
  background-color: #f8f9fa;
  padding: 16px;
  border-radius: 8px;
  border-left: 4px solid #1976d2;
}

.auth-basic .config-section__field {
  border-left: 4px solid #4caf50;
}

.auth-bearer .config-section__field {
  border-left: 4px solid #ff9800;
}

.auth-oauth1 .config-section__field,
.auth-oauth2 .config-section__field {
  border-left: 4px solid #9c27b0;
}

.auth-jwt .config-section__field {
  border-left: 4px solid #f44336;
}

.auth-apikey .config-section__field {
  border-left: 4px solid #2196f3;
}

.config-section {
  animation: fadeInUp 0.3s ease-out;
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.config-section__test-btn {
  position: relative;
}
.config-section__test-btn.testing .mud-button-label::after {
  content: "";
  position: absolute;
  right: -20px;
  top: 50%;
  transform: translateY(-50%);
  width: 12px;
  height: 12px;
  border: 2px solid #1976d2;
  border-top: 2px solid transparent;
  border-radius: 50%;
  animation: spin 1s linear infinite;
}

@keyframes spin {
  0% {
    transform: translateY(-50%) rotate(0deg);
  }
  100% {
    transform: translateY(-50%) rotate(360deg);
  }
}
/* Apps components */
.connector-info-details-block {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  padding: 24px 12px 16px;
  gap: 32px;
  width: auto;
  background: #F1F5FE;
  border-radius: 12px;
  flex: auto;
  order: 1;
  align-self: stretch;
  flex-grow: 1;
}
.connector-info-details-block .connector-info-details_header {
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  flex: none;
  order: 0;
  display: flex;
  flex-grow: 1;
  width: 100%;
  min-height: 62px;
}
.connector-info-details-block .connector-info-details_header .heading {
  flex: auto;
  order: 0;
  align-self: stretch;
  flex-grow: 1;
  line-height: 24px;
}
.connector-info-details-block .connector-info-details_header .icon-more {
  font-size: 1.625em;
}
.connector-info-details-block .connector-info-details_container {
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  flex: none;
  order: 0;
  display: flex;
  flex-grow: 1;
  width: 100%;
  min-height: 62px;
}
.connector-info-details-block .connector-info-details_container .heading {
  flex: auto;
  order: 0;
  align-self: stretch;
  flex-grow: 1;
  line-height: 24px;
}
.connector-info-details-block .connector-info-details_container .icon-more {
  font-size: 1.625em;
}
.connector-info-details-block .connector-info-details_footer {
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-end;
  flex: none;
  order: 0;
  display: flex;
  flex-grow: 0;
  width: 100%;
  min-height: 60px;
}
.connector-info-details-block .connector-info-details_footer .numbers-box {
  order: 0;
  flex-grow: 1;
  display: flex;
  align-items: center;
}
.connector-info-details-block .connector-info-details_footer .numbers-box .text-number {
  font-size: 1.75rem;
  color: #3673ED;
  line-height: 1.25em;
  font-weight: 600;
  margin-right: 8px;
}
.connector-info-details-block .connector-info-details_footer .numbers-box .text-label {
  font-weight: 500;
}
.connector-info-details-block.has-width {
  width: 25%;
}
.connector-info-details-block:hover {
  box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.1);
}

/* Market place */
.market-all-category-list {
  font-weight: 400;
  font-size: 0.875em;
  line-height: 21px;
  color: #989898;
}
.market-all-category-list .mud-list-item {
  padding-top: 4px;
  padding-bottom: 4px;
}
.market-all-category-list .mud-list-item.mud-list-item-clickable:focus:not(.mud-selected-item), .market-all-category-list .mud-list-item.mud-selected-item, .market-all-category-list .mud-list-item.mud-primary-text, .market-all-category-list .mud-list-item.mud-primary-hover, .market-all-category-list .mud-list-item:hover {
  background: none !important;
  color: #D8111E !important;
}
.market-all-category-list .mud-list-item.mud-list-item-clickable:focus:not(.mud-selected-item) .mud-typography-body1, .market-all-category-list .mud-list-item.mud-selected-item .mud-typography-body1, .market-all-category-list .mud-list-item.mud-primary-text .mud-typography-body1, .market-all-category-list .mud-list-item.mud-primary-hover .mud-typography-body1, .market-all-category-list .mud-list-item:hover .mud-typography-body1 {
  font-weight: 500;
}

.category-details {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}

.category-item {
  width: 134px;
  height: 100px;
  background: #ffffff;
  border: 1px solid #CCD6FF;
  box-shadow: 0px 4px 40px rgba(0, 0, 0, 0.06);
  border-radius: 4px;
  margin-right: 12px;
  margin-bottom: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.category-item img {
  width: 80%;
}

/* Tailwind Utlity Styles */
.container {
  width: 100%;
}

@media (min-width: 640px) {
  .container {
    max-width: 640px;
  }
}
@media (min-width: 768px) {
  .container {
    max-width: 768px;
  }
}
@media (min-width: 1024px) {
  .container {
    max-width: 1024px;
  }
}
@media (min-width: 1280px) {
  .container {
    max-width: 1280px;
  }
}
@media (min-width: 1536px) {
  .container {
    max-width: 1536px;
  }
}
.collapse {
  visibility: collapse;
}

.static {
  position: static;
}

.m-0 {
  margin: 0px;
}

.mx-4 {
  margin-left: 1rem;
  margin-right: 1rem;
}

.my-2 {
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
}

.my-4 {
  margin-top: 1rem;
  margin-bottom: 1rem;
}

.my-7 {
  margin-top: 1.75rem;
  margin-bottom: 1.75rem;
}

.mb-1 {
  margin-bottom: 0.25rem;
}

.mb-2 {
  margin-bottom: 0.5rem;
}

.mb-3 {
  margin-bottom: 0.75rem;
}

.mb-4 {
  margin-bottom: 1rem;
}

.mb-6 {
  margin-bottom: 1.5rem;
}

.ml-0 {
  margin-left: 0px;
}

.ml-2 {
  margin-left: 0.5rem;
}

.ml-3 {
  margin-left: 0.75rem;
}

.ml-6 {
  margin-left: 1.5rem;
}

.ml-auto {
  margin-left: auto;
}

.mr-0 {
  margin-right: 0px;
}

.mr-1 {
  margin-right: 0.25rem;
}

.mr-2 {
  margin-right: 0.5rem;
}

.mr-3 {
  margin-right: 0.75rem;
}

.mr-4 {
  margin-right: 1rem;
}

.mr-auto {
  margin-right: auto;
}

.mt-0 {
  margin-top: 0px;
}

.mt-1 {
  margin-top: 0.25rem;
}

.mt-2 {
  margin-top: 0.5rem;
}

.mt-3 {
  margin-top: 0.75rem;
}

.mt-4 {
  margin-top: 1rem;
}

.mt-6 {
  margin-top: 1.5rem;
}

.mt-8 {
  margin-top: 2rem;
}

.flex {
  display: flex;
}

.inline-flex {
  display: inline-flex;
}

.table {
  display: table;
}

.hidden {
  display: none;
}

.w-10 {
  width: 2.5rem;
}

.w-12 {
  width: 3rem;
}

.w-14 {
  width: 3.5rem;
}

.w-16 {
  width: 4rem;
}

.w-2 {
  width: 0.5rem;
}

.w-4 {
  width: 1rem;
}

.w-40 {
  width: 10rem;
}

.w-22 {
  width: 6rem;
}

.w-28 {
  width: 8rem;
}

.w-56 {
  width: 14rem;
}

.w-72 {
  width: 18rem;
}

.w-full {
  width: 100%;
}

.transform {
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.cursor-pointer {
  cursor: pointer;
}

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

.items-center {
  align-items: center;
}

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

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

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

.overflow-y-auto {
  overflow-y: auto;
}

.whitespace-nowrap {
  white-space: nowrap;
}

.p-0 {
  padding: 0px;
}

.px-2 {
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}

.px-4 {
  padding-left: 1rem;
  padding-right: 1rem;
}

.py-4 {
  padding-top: 1rem;
  padding-bottom: 1rem;
}

.pb-1 {
  padding-bottom: 0.25rem;
}

.pb-4 {
  padding-bottom: 1rem;
}

.pl-0 {
  padding-left: 0px;
}

.pl-4 {
  padding-left: 1rem;
}

.pl-6 {
  padding-left: 1.5rem;
}

.pr-1 {
  padding-right: 0.25rem;
}

.pr-1\.5 {
  padding-right: 0.375rem;
}

.pr-6 {
  padding-right: 1.5rem;
}

.pt-0 {
  padding-top: 0px;
}

.pt-1 {
  padding-top: 0.25rem;
}

.pt-4 {
  padding-top: 1rem;
}

.pt-5 {
  padding-top: 1.25rem;
}

.pt-6 {
  padding-top: 1.5rem;
}

.text-center {
  text-align: center;
}

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

.capitalize {
  text-transform: capitalize;
}

.filter {
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}

.transition {
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

/*.abc {
    @apply h-full;
    @apply static;
}

*/
body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-family: "Poppins", "Helvetica", "Arial", "sans-serif";
  overflow-y: auto;
}