@charset "UTF-8";
/*
    Global styles go here. You can define variables, mixins, functions, etc.
*/
@import './resources/fonts/Inter/style.css';
@import './resources/fonts/NotoSansArabic/style.css';
@import './resources/grid-layout/react-grid-layout.css';
@import './resources/grid-layout/react-resizable.css';
@import url("https://uxp.s3.amazonaws.com/packages/leaflet-1.6.0/leaflet.css");
@font-face {
  font-family: "Satoshi";
  font-style: normal;
  font-weight: 300; /* Light */
  src: local("Satoshi Light"), url("resources/fonts/Satoshi/Satoshi-Light.woff") format("woff");
}
@font-face {
  font-family: "Satoshi";
  font-style: italic;
  font-weight: 300;
  src: local("Satoshi Light Italic"), url("resources/fonts/Satoshi/Satoshi-LightItalic.woff") format("woff");
}
@font-face {
  font-family: "Satoshi";
  font-style: normal;
  font-weight: 400; /* Regular */
  src: local("Satoshi Regular"), url("resources/fonts/Satoshi/Satoshi-Regular.woff") format("woff");
}
@font-face {
  font-family: "Satoshi";
  font-style: italic;
  font-weight: 400;
  src: local("Satoshi Italic"), url("resources/fonts/Satoshi/Satoshi-Italic.woff") format("woff");
}
@font-face {
  font-family: "Satoshi";
  font-style: normal;
  font-weight: 500; /* Medium */
  src: local("Satoshi Medium"), url("resources/fonts/Satoshi/Satoshi-Medium.woff") format("woff");
}
@font-face {
  font-family: "Satoshi";
  font-style: italic;
  font-weight: 500;
  src: local("Satoshi Medium Italic"), url("resources/fonts/Satoshi/Satoshi-MediumItalic.woff") format("woff");
}
@font-face {
  font-family: "Satoshi";
  font-style: normal;
  font-weight: 700; /* Bold */
  src: local("Satoshi Bold"), url("resources/fonts/Satoshi/Satoshi-Regular.woff") format("woff");
}
@font-face {
  font-family: "Satoshi";
  font-style: italic;
  font-weight: 700;
  src: local("Satoshi Bold Italic"), url("resources/fonts/Satoshi/Satoshi-BoldItalic.woff") format("woff");
}
@font-face {
  font-family: "Satoshi";
  font-style: normal;
  font-weight: 900; /* Black */
  src: local("Satoshi Black"), url("resources/fonts/Satoshi/Satoshi-Regular.woff") format("woff");
}
@font-face {
  font-family: "Satoshi";
  font-style: italic;
  font-weight: 900;
  src: local("Satoshi Black Italic"), url("resources/fonts/Satoshi/Satoshi-Regular.woff") format("woff");
}
.line-clamp {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.line-clamp-1 {
  line-clamp: 1;
  -webkit-line-clamp: 1;
}

.line-clamp-2 {
  line-clamp: 2;
  -webkit-line-clamp: 2;
}

.line-clamp-3 {
  line-clamp: 3;
  -webkit-line-clamp: 3;
}

* {
  font-family: "Inter", "Noto Sans Arabic", sans-serif !important;
  box-sizing: border-box;
}
*::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
*::-webkit-scrollbar-track {
  background: var(--portalBGColor);
}
*::-webkit-scrollbar-thumb {
  border-radius: 10px;
  background-color: var(--primaryTextColor);
  border: 4px solid transparent;
  background-clip: padding-box;
}
*::-webkit-scrollbar-thumb:hover {
  border: 0;
}
*:focus-visible {
  outline: 2px solid var(--focusRingColor);
  outline-offset: 2px;
  border-radius: inherit;
}

html {
  /* 
   - set base font size here and use media queries to set different sizes for responsiveness ans scallability. 
   - use releative sizes for rest of the styles like rem, em(with caution), %, vh, vw etc. 
  */
  font-size: 13px;
}

html,
body,
#root {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  background-color: var(--portalHeaderBGColor);
}

.uxpcore_header__container {
  width: 100%;
  height: 100%;
  background-color: inherit;
  display: flex;
  justify-content: space-between;
}
.uxpcore_header__left {
  width: auto;
  display: flex;
  justify-content: flex-start;
}
.uxpcore_header__logo_container {
  width: 16rem;
  height: 100%;
  padding: 1.1rem;
  padding-inline-start: 0;
}
.uxpcore_header__logo_link {
  display: block;
  width: 100%;
  height: 100%;
  cursor: pointer;
}
.uxpcore_header__logo {
  width: 100%;
  height: 100%;
  background-position: start center;
  background-repeat: no-repeat;
  background-size: contain;
}
.uxpcore_header__middle {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  display: flex;
  justify-content: flex-start;
}
.uxpcore_header__right {
  width: auto;
  display: flex;
  justify-content: flex-end;
  padding-inline-end: 1rem;
}

/*
    header item container 
*/
.uxpcore_headeritem__container {
  width: auto;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.5rem;
}

/*
    sidebar toggle button
*/
.uxpcore_sidebartogglebtn__container {
  width: 8rem;
  height: auto;
  min-height: 5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  cursor: pointer;
  transition: all 200ms ease-in-out;
}
.uxpcore_sidebartogglebtn__container--expandedsidebar:before {
  content: "";
  position: absolute;
  width: 60%;
  height: 1px;
  background: var(--portalHeaderTextColor);
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
}
.uxpcore_sidebartogglebtn__menuicon {
  width: 2.2rem;
  height: 2.2rem;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2.2rem;
}

.uxpcore_headernavigation__container {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  color: var(--portalHeaderTextColor);
  outline: none;
  min-width: 0;
  overflow: hidden;
}
.uxpcore_headernavigation__separator {
  width: auto;
  height: auto;
  padding: 0 0.5rem;
  flex-shrink: 0;
}
.uxpcore_headernavigation__itemswrapper {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex: 1;
  min-width: 0;
  overflow: hidden;
}
.uxpcore_headernavigation__itemwrap {
  flex-shrink: 0;
}
.uxpcore_headernavigation__itemwrap--hidden {
  display: none;
}
.uxpcore_headernavigation__overflowbtn {
  flex-shrink: 0;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.5rem 0.7rem;
  border-radius: 2rem;
  color: var(--portalHeaderTextColor);
  font-size: 1.2rem;
}
.uxpcore_headernavigation__overflowbtn:hover {
  background-color: var(--navChildHoverBGColor);
  color: var(--navChildHoverTextColor);
}

.uxpcore_headernavigationbutton__container {
  position: relative;
  border-radius: 2rem;
  font-size: 1rem;
  color: var(--portalHeaderTextColor);
  text-decoration: none;
  cursor: pointer;
  transition: all 200ms ease-in-out;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
}
.uxpcore_headernavigationbutton__container:hover {
  background-color: var(--navChildHoverBGColor);
  color: var(--navChildHoverTextColor);
}
.uxpcore_headernavigationbutton__container--active {
  background-color: var(--navChildSelectedBGColor);
  color: var(--navChildSelectedTextColor);
}
.uxpcore_headernavigationbutton__container--has-children {
  padding-inline-end: 1rem;
}
.uxpcore_headernavigationbutton__container--parent .uxpcore_headernavigationbutton__linkcontainer {
  text-transform: uppercase;
  font-weight: var(--fontWeightBlack);
}
.uxpcore_headernavigationbutton__container--parent:hover {
  background-color: var(--navChildHoverBGColor);
  color: var(--navChildHoverTextColor);
}
.uxpcore_headernavigationbutton__linkcontainer {
  color: inherit;
  text-decoration: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.uxpcore_headernavigationbutton__linkcontainer:active, .uxpcore_headernavigationbutton__linkcontainer:focus, .uxpcore_headernavigationbutton__linkcontainer:visited, .uxpcore_headernavigationbutton__linkcontainer:hover {
  text-decoration: none;
}
.uxpcore_headernavigationbutton__linklabel {
  padding: 0.6rem 1rem;
  max-width: 14rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.uxpcore_headernavigationbutton__linklabel--hastogglebutton {
  padding: 0.6rem 0.4rem 0.6rem 1rem;
}
.uxpcore_headernavigationbutton__togglebutton {
  width: 1rem;
  height: 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.uxpcore_headernavigationbutton__togglebutton svg {
  width: 100% !important;
  height: 100% !important;
}
.uxpcore_headernavigationbuttonpopup__container {
  position: relative;
  width: auto;
  height: auto;
}
.uxpcore_headernavigationbuttonpopup__container ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.uxpcore_headernavigationbuttonpopup__container .uxpcore_dropdown__container,
.uxpcore_headernavigationbuttonpopup__container .uxpcore_dropdown__trigger {
  display: block;
  width: 100%;
}
.uxpcore_headernavigationbuttonpopup__linkcontainer {
  width: 100%;
  color: var(--primaryTextColor);
  text-decoration: none;
  font-weight: var(--fontWeightMedium);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.5rem;
}
.uxpcore_headernavigationbuttonpopup__linkcontainer a {
  text-decoration: none;
  color: inherit;
}
.uxpcore_headernavigationbuttonpopup__linkcontainer a:hover, .uxpcore_headernavigationbuttonpopup__linkcontainer a:visited, .uxpcore_headernavigationbuttonpopup__linkcontainer a:active, .uxpcore_headernavigationbuttonpopup__linkcontainer a:focus {
  text-decoration: none;
}
.uxpcore_headernavigationbuttonpopup__linkcontainer:active, .uxpcore_headernavigationbuttonpopup__linkcontainer:focus, .uxpcore_headernavigationbuttonpopup__linkcontainer:hover, .uxpcore_headernavigationbuttonpopup__linkcontainer:visited {
  text-decoration: none;
}
.uxpcore_headernavigationbuttonpopup__linkcontainer:hover {
  background-color: var(--navChildHoverBGColor);
  color: var(--navChildHoverTextColor);
}
.uxpcore_headernavigationbuttonpopup__linkcontainer li {
  padding: 0.5rem 1rem;
  white-space: nowrap;
}
.uxpcore_headernavigationbuttonpopup__linkcontainer--active {
  background-color: var(--navChildSelectedBGColor);
  color: var(--navChildSelectedTextColor);
}
.uxpcore_headernavigationbuttonpopup__linkcontainer--parentlabel {
  font-size: 0.8rem;
  opacity: 0.6;
  text-decoration: underline;
  text-transform: uppercase;
}
.uxpcore_headernavigationbuttonpopup__linkcontainer--parentlabel:hover {
  background-color: var(--primaryBGColor);
  text-decoration: underline;
}
.uxpcore_headernavigationbuttonpopup__linklabel {
  flex: 1;
  text-decoration: none;
  color: inherit;
}
.uxpcore_headernavigationbuttonpopup__linklabel:hover, .uxpcore_headernavigationbuttonpopup__linklabel:visited, .uxpcore_headernavigationbuttonpopup__linklabel:active, .uxpcore_headernavigationbuttonpopup__linklabel:focus {
  text-decoration: none;
}
.uxpcore_headernavigationbuttonpopup__childtoggle {
  width: 1.5rem;
  height: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.uxpcore_headernavigationbuttonpopup__childtoggle svg {
  width: 100% !important;
  height: 100% !important;
}
.uxpcore_headernavigationbuttonpopup__linkselectedicon {
  width: 2rem;
  height: 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.uxpcore_headernavigationbuttonpopup__linkselectedicon svg {
  width: 100%;
  height: 100%;
}

.uxpcore_sidebar__wrapper {
  width: 100%;
  height: 100%;
  position: relative;
  transition: all 100ms ease-in-out;
}
.uxpcore_sidebar__wrapper--collapsed {
  width: 1rem;
}
.uxpcore_sidebar__topshape {
  width: 3rem;
  height: 3rem;
  background-color: var(--portalHeaderBGColor);
  flex-shrink: 0;
  clip-path: path("M 0 0 H 50 Q 0 0 0 50 Z");
  position: absolute;
  top: 0;
  inset-inline-end: 0;
  translate: 100% 0;
}
[dir=rtl] .uxpcore_sidebar__topshape {
  translate: -100% 0;
  clip-path: path("M 50 0 H 0 Q 50 0 50 50 Z");
}
.uxpcore_sidebar__container {
  width: 100%;
  height: 100%;
  padding: 0;
  color: var(--portalHeaderTextColor);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.uxpcore_sidebar__body {
  flex: 1;
  overflow-y: auto;
  min-height: 0;
  margin: 0;
  padding: 0.5rem 0 2rem 0;
  -ms-overflow-style: none;
  /* IE and Edge */
  scrollbar-width: none;
  /* Firefox */
}
.uxpcore_sidebar__body::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}
.uxpcore_sidebar__body .uxpcore_dropdown__container {
  display: block;
}
.uxpcore_sidebar__body .uxpcore_dropdown__container .uxpcore_dropdown__trigger {
  display: flex;
}
.uxpcore_sidebar__footer {
  flex-shrink: 0;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 2rem 0 0.3rem 0;
  position: relative;
}
.uxpcore_sidebar__footer:before {
  content: "";
  position: absolute;
  width: 60%;
  height: 1px;
  background: var(--portalHeaderTextColor);
  left: 50%;
  top: 1.5rem;
  transform: translateX(-50%);
}
.uxpcore_sidebar__actionbutton {
  width: 100%;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.8rem;
}
.uxpcore_sidebar__searchbutton, .uxpcore_sidebar__marketplacebutton {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.65rem;
  background-color: transparent;
  cursor: pointer;
  color: var(--portalHeaderTextColor);
  text-decoration: none;
  font-size: inherit;
}
.uxpcore_sidebar__searchbutton:hover, .uxpcore_sidebar__marketplacebutton:hover {
  scale: 1.15;
}
.uxpcore_sidebar__customtools {
  width: 100%;
  height: auto;
  padding: 0.65rem 0.7rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

@keyframes draw-border {
  0% {
    height: 0;
  }
  100% {
    height: 100%;
  }
}
.uxpcore_sidebarlink__linkwrapper {
  width: auto;
  height: auto;
  text-decoration: none;
  color: var(--portalHeaderTextColor);
  padding: 0;
  margin: 0;
  outline: none;
}
.uxpcore_sidebarlink__linkwrapper:active, .uxpcore_sidebarlink__linkwrapper:visited, .uxpcore_sidebarlink__linkwrapper:focus, .uxpcore_sidebarlink__linkwrapper:hover {
  text-decoration: none;
}
.uxpcore_sidebarlink__container {
  width: 100%;
  height: auto;
  cursor: pointer;
  color: var(--portalHeaderTextColor);
  padding: 0.7rem;
  box-sizing: border-box;
  border-radius: 0.8rem 0.3rem 0.3rem 0.8rem;
  position: relative;
  overflow: hidden;
  transition: all 300ms ease-in-out;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
[dir=rtl] .uxpcore_sidebarlink__container {
  border-radius: 0.3rem 0.8rem 0.8rem 0.3rem;
}
.uxpcore_sidebarlink__container:hover {
  background-color: var(--portalSidebarHoverBGColor);
}
.uxpcore_sidebarlink__container--childlink {
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  color: var(--primaryTextColor);
  border-radius: 0;
}
.uxpcore_sidebarlink__container--childlink .uxpcore_sidebarlink__text {
  text-align: start;
  padding-inline-start: 0.5rem;
}
.uxpcore_sidebarlink__container--childlink .uxpcore_sidebarlink__iconcontainer {
  width: 2rem;
  height: 2rem;
  padding: 0.3rem;
}
.uxpcore_sidebarlink__container--childlink .uxpcore_sidebarlink__icon {
  filter: brightness(0) saturate(100%) drop-shadow(0 0 0 var(--primaryTextColor));
  mix-blend-mode: screen;
}
.uxpcore_sidebarlink__container--childlink:hover {
  background-color: var(--navChildHoverBGColor);
  color: var(--navChildHoverTextColor);
}
.uxpcore_sidebarlink__container--grouplabel {
  cursor: default;
  opacity: 0.55;
  pointer-events: none;
}
.uxpcore_sidebarlink__container--active {
  background-color: var(--portalSidebarSelectedBGColor);
}
.uxpcore_sidebarlink__container--active::before {
  content: "";
  position: absolute;
  top: 0;
  inset-inline-start: 0;
  width: 0.2rem;
  background-color: var(--portalHeaderTextColor);
  animation: draw-border 300ms ease-in-out forwards;
}
.uxpcore_sidebarlink__container--active.uxpcore_sidebarlink__container--childlink {
  background-color: var(--navChildSelectedBGColor);
  color: var(--navChildSelectedTextColor) !important;
}
.uxpcore_sidebarlink__container--active.uxpcore_sidebarlink__container--childlink::before {
  display: none;
}
.uxpcore_sidebarlink__text {
  width: 100%;
  font-size: 0.85rem;
  text-align: center;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
  word-break: break-word;
  word-break: normal;
  overflow-wrap: normal;
}
.uxpcore_sidebarlink__iconcontainer {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.65rem;
  background-color: transparent;
  font-size: 1.4rem;
}
.uxpcore_sidebarlink__icon {
  width: 100%;
  height: 100%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  position: relative;
  filter: brightness(0) saturate(100%) drop-shadow(0 0 0 var(--portalHeaderTextColor));
  mix-blend-mode: screen;
}

.uxpcore_sidebaritemgroup__container {
  width: auto;
  height: auto;
  position: relative;
}
.uxpcore_sidebaritemgroup__content {
  width: auto;
  height: auto;
  max-height: 80vh;
  max-width: 20rem;
  min-width: 15rem;
  overflow-y: auto;
  overflow-x: hidden;
  -ms-overflow-style: none;
  /* IE and Edge */
  scrollbar-width: none;
  /* Firefox */
}
.uxpcore_sidebaritemgroup__content::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}
.uxpcore_sidebaritemgroup__group {
  width: 100%;
  height: auto;
  margin-bottom: 1rem;
}
.uxpcore_sidebaritemgroup__group--no-children {
  margin-bottom: 0 !important;
}
.uxpcore_sidebaritemgroup__grouplabel {
  width: 100%;
  height: auto;
  font-size: 1.1rem;
  font-weight: var(--fontWeightBlack);
  text-transform: uppercase;
}
.uxpcore_sidebaritemgroup__groupitems .uxpcore_sidebarlink__container {
  padding-inline-start: 1.8rem;
}

.uxpcore_baselayout__container {
  width: 100%;
  height: 100vh;
  display: flex;
  flex-direction: column;
  position: relative;
  overflow: hidden;
}
.uxpcore_baselayout__header {
  width: 100%;
  height: 5rem;
  background-color: var(--portalHeaderBGColor);
  color: var(--portalHeaderTextColor);
  position: relative;
  flex-shrink: 0;
}
.uxpcore_baselayout__body {
  /* Fills remaining space */
  flex: 1 1 auto;
  /* Prevents flex child from growing beyond available space */
  min-height: 0;
  /* Enables scrolling if content is taller */
  overflow: auto;
  width: 100%;
  position: relative;
  background-color: var(--portalHeaderBGColor);
  display: flex;
  transition: all 200ms cubic-bezier(0.02, 1.43, 0.55, 1) 1.25ms;
}
.uxpcore_baselayout__footer {
  width: 100%;
  height: 1px;
  position: relative;
  flex-shrink: 0;
}
.uxpcore_baselayout__sidebar {
  width: 8rem;
  position: relative;
  flex-shrink: 0;
  background-color: var(--portalHeaderBGColor);
  color: var(--portalHeaderTextColor);
  transition: width 200ms ease-in-out;
}
.uxpcore_baselayout__content {
  flex: 1;
  /* Important for proper flex item sizing */
  min-width: 0;
  /* Scroll if content overflows */
  overflow: auto;
  position: relative;
  border-radius: 0;
  background-color: var(--portalBGColor);
  transition: all 200ms ease-in-out;
  border-start-start-radius: 3rem;
}

.uxpcore_baselayout__container--expandedsidebar .uxpcore_baselayout__body {
  padding: 0;
}
.uxpcore_baselayout__container--expandedsidebar .uxpcore_baselayout__sidebar {
  width: 8rem;
}

.uxpcore_baselayout__container:not(.uxpcore_baselayout__container--expandedsidebar) .uxpcore_baselayout__sidebar {
  width: 1rem;
}

.uxpcore_baselayout__content .uxpcore_configuredview__container {
  border-radius: inherit;
}
.uxpcore_baselayout__content .uxpcore_configuredview__container .uxpcore_remotecomponent__container {
  border-radius: inherit;
}
.uxpcore_baselayout__content .uxpcore_configuredview__container .uxpcore_remotecomponent__container > div {
  width: 100%;
  height: 100%;
}

.uxpcore_userprofile__container {
  width: auto;
  height: auto;
  position: relative;
}
.uxpcore_userprofile__button {
  width: auto;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  border-radius: 50%;
  padding: 2px;
}
.uxpcore_userprofile__button .uxpcore_profileimage__container {
  border: 2px solid var(--borderColor);
}
.uxpcore_userprofile__panel {
  width: 20rem;
  height: auto;
  background-color: var(--primaryBGColor);
  color: var(--primaryTextColor);
  border: 1px solid var(--borderColor);
  border-radius: 0.5rem;
  overflow: hidden;
}
.uxpcore_userprofile__header {
  width: 100%;
  height: auto;
  padding: 0.75rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid var(--borderColor);
}
.uxpcore_userprofile__profile-image {
  width: auto;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0.75rem;
}
.uxpcore_userprofile__username {
  font-weight: var(--fontWeightSemibold);
  color: var(--primaryTextColor);
}
.uxpcore_userprofile__details {
  padding: 0.75rem;
  width: 100%;
}
.uxpcore_userprofile__details-cell {
  padding: 0.5rem 0.25rem;
  color: var(--primaryTextColor);
}
.uxpcore_userprofile__details-cell--label {
  font-weight: var(--fontWeightBold);
}
.uxpcore_userprofile__details-cell--value {
  text-align: right;
}
.uxpcore_userprofile__lang-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  cursor: pointer;
  color: var(--primaryTextColor);
  font-size: 0.875rem;
}
.uxpcore_userprofile__lang-pill .uxpcore_dropdown_indicator__container {
  color: var(--secondaryTextColor);
  font-size: 0.75rem;
}
.uxpcore_userprofile__footer {
  width: 100%;
  display: flex;
  border-top: 1px solid var(--borderColor);
}
.uxpcore_userprofile__footer-btn {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.875rem 0.5rem;
  font-size: 0.875rem;
  font-weight: var(--fontWeightMedium);
  cursor: pointer;
  border: none;
  outline: none;
  text-decoration: none;
  background-color: transparent;
  color: var(--primaryTextColor);
  transition: background-color 0.15s ease;
}
.uxpcore_userprofile__footer-btn:hover {
  text-decoration: none;
  color: var(--primaryTextColor);
}
.uxpcore_userprofile__footer-btn--profile {
  border-right: 1px solid var(--borderColor);
}
.uxpcore_userprofile__footer-btn--profile:hover {
  background-color: var(--hoverColor, rgba(0, 0, 0, 0.05));
}
.uxpcore_userprofile__footer-btn--logout {
  color: var(--dangerColor, #e53935);
  font-weight: var(--fontWeightSemibold);
}
.uxpcore_userprofile__footer-btn--logout:hover {
  background-color: var(--dangerBGColor, rgba(229, 57, 53, 0.08));
}
.uxpcore_userprofile__menu {
  border-bottom: 1px solid var(--borderColor);
  padding: 0.375rem 0;
}
.uxpcore_userprofile__menu-item {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  width: 100%;
  padding: 0.5rem 0.75rem;
  color: var(--primaryTextColor);
  font-size: 0.875rem;
  cursor: pointer;
  text-decoration: none;
}
.uxpcore_userprofile__menu-item:hover {
  background-color: var(--hoverColor, rgba(0, 0, 0, 0.05));
  color: var(--primaryTextColor);
  text-decoration: none;
}
.uxpcore_userprofile__menu-item-icon {
  width: 1rem;
  height: 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: var(--secondaryTextColor);
}

.uxpcore_divider {
  width: 100%;
  position: relative;
  border: 1px solid var(--borderColor);
}

.uxpcore_errorpage__container {
  width: 100%;
  height: 100%;
  background-color: transparent;
  display: flex;
  align-items: center;
  justify-content: center;
}
.uxpcore_errorpage__container .uxp-button {
  margin: 0;
}
.uxpcore_errorpage__overlay {
  width: auto;
  min-width: max(30%, 25rem);
  height: auto;
  min-height: max(40%, 35rem);
  padding: 2rem;
  border-radius: 1rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: var(--secondaryBGColor);
  backdrop-filter: blur(150px);
  -webkit-backdrop-filter: blur(150px);
  border: 1px solid var(--borderColor);
  color: var(--portalHeaderTextColor);
}
.uxpcore_errorpage__icon {
  width: 5rem;
  height: 5rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.uxpcore_errorpage__icon svg {
  width: 100% !important;
  height: 100% !important;
}
.uxpcore_errorpage__message {
  width: auto;
  height: auto;
  display: flex;
  align-items: center;
  flex-direction: column;
}
.uxpcore_errorpage__title {
  padding: 1rem;
  font-size: 2rem;
  font-weight: var(--fontWeightBlack);
  text-align: center;
}
.uxpcore_errorpage__subtitle {
  font-size: 1.3rem;
  padding: 1.5rem;
  text-align: center;
}

.uxpcore_permissionbanner__container {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1000;
  background-color: var(--toastWarningBGColor);
  color: var(--toastWarningTextColor);
  padding: 0.75rem 1rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  font-size: 1.083rem;
}

.uxpcore_permissionbanner__btn {
  background-color: var(--alertWarningConfirmButtonBGColor);
  border: 1px solid var(--alertWarningBorderColor);
  color: var(--alertWarningConfirmButtonTextColor);
  padding: 0.417rem 0.833rem;
  border-radius: 0.333rem;
  cursor: pointer;
  white-space: nowrap;
  font-size: 1.083rem;
}
.uxpcore_permissionbanner__btn:hover {
  background-color: var(--alertWarningConfirmButtonHoverBGColor);
}

.uxpcore_notificationcenter__trigger {
  position: relative;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}
.uxpcore_notificationcenter__trigger .uxpcore_profileimage__container {
  border-radius: 50%;
  transition: background 150ms ease;
}
.uxpcore_notificationcenter__trigger .uxpcore_profileimage__container:hover {
  background: var(--portalSidebarHoverBGColor) !important;
}
.uxpcore_notificationcenter__badge {
  position: absolute;
  top: -0.3rem;
  inset-inline-end: -0.3rem;
  min-width: 1.5rem;
  height: 1.5rem;
  border-radius: 999px;
  background: var(--badgeBGColor);
  color: var(--badgeTextColor);
  font-size: 0.85rem;
  font-weight: var(--fontWeightBold);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 0.3rem;
  pointer-events: none;
  line-height: 1;
  border: 2px solid var(--portalHeaderBGColor);
}
.uxpcore_notificationcenter__panel-wrapper {
  padding: 0 !important;
  min-width: 0 !important;
}
.uxpcore_notificationcenter__panel {
  width: 34rem;
  max-width: 92vw;
  display: flex;
  flex-direction: column;
  background: var(--primaryBGColor);
  color: var(--primaryTextColor);
  overflow: hidden;
}
.uxpcore_notificationcenter__panel-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1.2rem 1.2rem 1rem 1.2rem;
  border-bottom: 1px solid var(--borderColor);
  flex-shrink: 0;
  gap: 0.6rem;
  min-width: 0;
}
.uxpcore_notificationcenter__panel-title {
  font-weight: var(--fontWeightBold);
  font-size: 1.2rem;
  color: var(--primaryTextColor);
  flex-shrink: 0;
}
.uxpcore_notificationcenter__panel-header-actions {
  display: flex;
  align-items: center;
  gap: 0.2rem;
  min-width: 0;
}
.uxpcore_notificationcenter__panel-header-actions .uxpcore_searchbox {
  border-radius: 2rem;
}
.uxpcore_notificationcenter__panel-header-actions .uxpcore_searchbox .uxpcore_input__prefix {
  padding: 0 0.5rem !important;
}
.uxpcore_notificationcenter__panel-header-actions .uxpcore_searchbox .uxpcore_input__input {
  padding: 0.4rem !important;
}
.uxpcore_notificationcenter__panel-header-actions .uxpcore_button.uxpcore_button--icon-only {
  border-radius: 2rem;
  background-color: transparent;
  border-color: transparent;
}
.uxpcore_notificationcenter__tabs {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.8rem 1rem;
  overflow-x: auto;
  flex-shrink: 0;
  border-bottom: 1px solid var(--borderColor);
  -ms-overflow-style: none;
  /* IE and Edge */
  scrollbar-width: none;
  /* Firefox */
}
.uxpcore_notificationcenter__tabs::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}
.uxpcore_notificationcenter__tab {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.35rem 0.5rem;
  border-radius: 999px;
  border: 1px solid var(--borderColor);
  background: transparent;
  color: var(--secondaryTextColor);
  cursor: pointer;
  font-size: 1.1rem;
  white-space: nowrap;
  flex-shrink: 0;
  transition: background 150ms ease, border-color 150ms ease, color 150ms ease;
}
.uxpcore_notificationcenter__tab:hover {
  background: var(--highlightBGColor);
  color: var(--highlightTextColor);
  border-color: var(--highlightTextColor);
}
.uxpcore_notificationcenter__tab--active {
  background: var(--selectedBGColor);
  border-color: var(--selectedTextColor);
  color: var(--selectedTextColor);
  font-weight: var(--fontWeightSemibold);
}
.uxpcore_notificationcenter__tab-icon {
  font-size: 1.1rem;
  display: flex;
  align-items: center;
  opacity: 0.8;
}
.uxpcore_notificationcenter__tab-count {
  background: var(--badgeBGColor);
  color: var(--badgeTextColor);
  border-radius: 999px;
  font-size: 0.85rem;
  font-weight: var(--fontWeightBold);
  min-width: 1.6rem;
  height: 1.6rem;
  padding: 0 0.35rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}
.uxpcore_notificationcenter__list {
  flex: 1;
  overflow-y: auto;
  max-height: 38rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  padding: 0.5rem !important;
}
.uxpcore_notificationcenter__list::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
.uxpcore_notificationcenter__list::-webkit-scrollbar-track {
  background: var(--portalBGColor);
}
.uxpcore_notificationcenter__list::-webkit-scrollbar-thumb {
  border-radius: 10px;
  background-color: var(--primaryTextColor);
  border: 4px solid transparent;
  background-clip: padding-box;
}
.uxpcore_notificationcenter__list::-webkit-scrollbar-thumb:hover {
  border: 0;
}
.uxpcore_notificationcenter__list .uxpcore_datalist__item {
  margin: 0.5rem 0;
}
.uxpcore_notificationcenter__item {
  background: var(--primaryBGColor);
  border-radius: 0.5rem;
  padding: 0.7rem 0.8rem;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  border-inline-start: 4px solid var(--borderColor);
  border-top: 1px solid var(--borderColor);
  border-bottom: 1px solid var(--borderColor);
  border-inline-end: 1px solid var(--borderColor);
  transition: opacity 200ms ease;
}
.uxpcore_notificationcenter__item--critical {
  border-inline-start-color: var(--dangerButtonBGColor);
}
.uxpcore_notificationcenter__item--high {
  border-inline-start-color: var(--warningButtonBGColor);
}
.uxpcore_notificationcenter__item--medium {
  border-inline-start-color: var(--infoButtonBGColor);
}
.uxpcore_notificationcenter__item--low {
  border-inline-start-color: var(--disabledBGColor);
}
.uxpcore_notificationcenter__item--read {
  opacity: 0.5;
}
.uxpcore_notificationcenter__item--clickable {
  cursor: pointer;
}
.uxpcore_notificationcenter__item--clickable:hover {
  background: var(--secondaryBGColor);
}
.uxpcore_notificationcenter__item-header {
  display: flex;
  align-items: center;
  gap: 0.6rem;
}
.uxpcore_notificationcenter__item-severity {
  font-size: 0.85rem;
  font-weight: var(--fontWeightBold);
  text-transform: uppercase;
  border-radius: 3px;
  padding: 0.15rem 0.5rem;
  letter-spacing: 0.04em;
  flex-shrink: 0;
}
.uxpcore_notificationcenter__item-severity--critical {
  color: var(--alertErrorTextColor);
  background: var(--alertErrorBGColor);
}
.uxpcore_notificationcenter__item-severity--high {
  color: var(--alertWarningTextColor);
  background: var(--alertWarningBGColor);
}
.uxpcore_notificationcenter__item-severity--medium {
  color: var(--alertInfoTextColor);
  background: var(--alertInfoBGColor);
}
.uxpcore_notificationcenter__item-severity--low {
  color: var(--inactiveStatusTextColor);
  background: var(--inactiveStatusBGColor);
}
.uxpcore_notificationcenter__item-time {
  font-size: 0.9rem;
  color: var(--disabledTextColor);
  margin-inline-start: auto;
  white-space: nowrap;
  flex-shrink: 0;
}
.uxpcore_notificationcenter__item-header .uxpcore_button.uxpcore_button--icon-only {
  width: 2.2rem;
  height: 2.2rem;
  min-width: 2.2rem;
  border: 1px solid transparent !important;
  background: transparent;
  border-radius: 0.4rem;
  padding: 0;
  transition: background 150ms ease, border-color 150ms ease;
}
.uxpcore_notificationcenter__item-header .uxpcore_button.uxpcore_button--icon-only:hover:not(.uxpcore_button--disabled) {
  background: var(--secondaryBGColor);
  border-color: var(--borderColor) !important;
}
.uxpcore_notificationcenter__item-message {
  margin: 0;
  font-size: 1rem;
  line-height: 1.5;
  color: var(--primaryTextColor);
  word-break: break-word;
}
.uxpcore_notificationcenter__item-message--clamped {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
.uxpcore_notificationcenter__item-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  justify-content: flex-end;
}
.uxpcore_notificationcenter__item-actions .uxpcore_button {
  border-radius: 999px;
}
.uxpcore_notificationcenter__footer {
  padding: 0.6rem 1.2rem;
  border-top: 1px solid var(--borderColor);
  flex-shrink: 0;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 0.6rem;
}

.uxpcore_notificationcenter__severity-filter-dropdown .uxpcore_select__search {
  display: none;
}
.uxpcore_notificationcenter__severity-filter-dropdown .uxpcore_select__option--select-all {
  display: none;
}
.uxpcore_notificationcenter__severity-filter-dropdown .uxpcore_select__option-content {
  padding: 0.3rem 0.6rem;
  font-size: 0.85rem;
}
.uxpcore_notificationcenter__severity-filter-dropdown .uxp-form-checkbox label::before,
.uxpcore_notificationcenter__severity-filter-dropdown .uxp-form-checkbox label::after {
  width: 1rem;
  height: 1rem;
}
.uxpcore_notificationcenter__severity-filter-dropdown .uxp-form-checkbox label {
  font-size: 0.85rem;
  padding-inline-start: 1.4rem;
}
.uxpcore_notificationcenter__severity-filter-dropdown .uxpcore_select__dropdown-footer {
  display: none;
}

.uxpcore_expandabletext__container {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}
.uxpcore_expandabletext__toggle {
  display: inline-block;
  color: var(--linkColor);
  font-size: 1rem;
  font-weight: var(--fontWeightMedium);
  cursor: pointer;
  user-select: none;
  transition: color 150ms ease;
}
.uxpcore_expandabletext__toggle:hover {
  color: var(--linkHoverColor);
}

.uxpcore_configuredview__container {
  width: 100%;
  height: 100%;
  position: relative;
}
.uxpcore_configuredview__not_found {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.uxpcore_dashboardview__container {
  width: 100%;
  height: 100%;
  padding: 0.5rem 0 0.5rem 0.5rem;
  overflow: hidden;
  border-radius: inherit;
}

.uxpcore_uiview__container {
  width: 100%;
  height: 100%;
  position: relative;
}

.uxpcore_dashboardtitle__container {
  width: auto;
  height: auto;
  font-size: 1.35rem;
  text-transform: uppercase;
}

.uxpcore_dashboardeditbtn__container {
  position: fixed;
  bottom: 20px;
  right: 20px;
  opacity: 0.7;
  cursor: pointer;
  padding: 10px;
  background-color: transparent;
}
.uxpcore_dashboardeditbtn__container:hover {
  opacity: 1;
}
.uxpcore_dashboardeditbtn__container:hover .uxpcore_dashboardeditbtn__button {
  max-width: 300px;
}
.uxpcore_dashboardeditbtn__button {
  background-color: var(--portalHeaderBGColor);
  color: var(--portalHeaderTextColor);
  text-decoration: none;
  border-radius: 60px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  width: auto;
  max-width: 40px;
  transition: max-width 200ms cubic-bezier(0.02, 1.43, 0.55, 1);
  box-shadow: 2px 2px 12px 6px rgba(123, 121, 121, 0.49);
}
.uxpcore_dashboardeditbtn__icon {
  font-size: 14px;
  margin-right: 15px;
  padding: 0px 13px;
  display: flex;
  align-items: center;
}
.uxpcore_dashboardeditbtn__label {
  white-space: nowrap;
  padding-right: 15px;
}

.uxpcore_usersite__image {
  width: 4rem;
  height: 4rem;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  border-radius: 0.8rem;
  cursor: pointer;
  border: 1px solid var(--portalHeaderTextColor);
}

.uxpcore_devuiview__container {
  width: 100%;
  height: 100%;
  position: relative;
}
.uxpcore_devuiview__error {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0.6;
}

.react-resizable-handle {
  width: 2.5rem !important;
  height: 2.5rem !important;
  background-color: var(--secondaryBGColor);
  border-radius: 0.5rem;
  border: 1px solid var(--borderColor);
  opacity: 0;
}

.uxpcore_dashboard__wrapper {
  width: 100%;
  height: 100%;
}
.uxpcore_dashboard__wrapper--scroll {
  overflow-x: auto;
  overflow-y: auto;
}
.uxpcore_dashboard__wrapper--edit {
  background-color: rgba(0, 0, 0, 0.4);
}
.uxpcore_embeddeddashboard__overlay-wrapper .uxpcore_dashboard__wrapper--edit {
  background-color: transparent;
}
.uxpcore_embeddeddashboard__overlay-wrapper .uxpcore_dashboard__wrapper--edit::before {
  content: "";
  position: fixed;
  inset: 0;
  background-color: rgba(0, 0, 0, 0.4);
  z-index: 0;
  pointer-events: none;
}
.uxpcore_dashboard__container {
  width: 100%;
  min-height: 100%;
  height: inherit;
  background-color: transparent;
  overflow: auto;
}
.uxpcore_dashboard__container--edit .react-resizable-handle {
  opacity: 1;
  z-index: 1000 !important;
}
.uxpcore_dashboard__container--edit .react-resizable-handle:hover {
  background-color: var(--selectedBGColor);
}
.uxpcore_dashboard__container--bounded {
  overflow: hidden;
  height: 100%;
}
.uxpcore_dashboard__container--bounded .react-grid-layout {
  height: 100% !important;
}
.uxpcore_dashboard__container--breakpoint-override {
  margin: 0 auto;
  transition: width 0.3s ease, max-width 0.3s ease;
}
.uxpcore_dashboard__container--vertical {
  overflow-y: auto;
  overflow-x: hidden;
}
.uxpcore_dashboard__container--horizontal {
  overflow: visible;
  height: 100%;
  min-height: unset;
}
.uxpcore_dashboard__container--overlay {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  min-height: unset;
  overflow: visible;
  pointer-events: none;
  background: transparent;
}
.uxpcore_dashboard__container--overlay .uxpcore_dashboard__layout {
  pointer-events: none;
}
.uxpcore_dashboard__container--overlay .uxpcore_dashboard__layout-item {
  pointer-events: auto;
}
.uxpcore_dashboard__container--gridlines {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.08) 1px, transparent 1px), linear-gradient(to bottom, rgba(255, 255, 255, 0.08) 1px, transparent 1px);
  background-size: calc(var(--gridCellWidth) + var(--gridMarginX)) calc(var(--gridCellHeight) + var(--gridMarginY));
  background-position: var(--gridPaddingX) var(--gridPaddingY);
}
.uxpcore_dashboard__background-renderer {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  pointer-events: auto;
  overflow: hidden;
}
.uxpcore_dashboard__layout-item {
  background-color: transparent;
  padding: var(--layoutItemPadding);
  margin: 0;
  box-sizing: border-box;
  display: block;
  overflow: hidden;
  font-family: "Inter", "Noto Sans Arabic", sans-serif !important;
}
.uxpcore_dashboard__layout-item * {
  font-family: "Inter", "Noto Sans Arabic", sans-serif !important;
}
.uxpcore_dashboard__layout-content {
  position: relative;
  background-color: transparent;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  overflow: hidden;
  border-radius: 0.5rem;
}
.uxpcore_dashboard__spacer {
  width: 100%;
  height: 100%;
  background-color: transparent;
  border-radius: 0.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.uxpcore_dashboard__placeholder {
  width: 100%;
  height: 100%;
  background-color: var(--secondaryButtonBGColor);
  color: var(--secondaryButtonBorderColor);
  border: 2px dashed var(--secondaryButtonBorderColor);
  border-radius: 0.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
}
.uxpcore_dashboard__placeholder:hover {
  border-color: var(--secondaryButtonHoverBorderColor);
  color: var(--secondaryButtonHoverBorderColor);
  background-color: var(--secondaryButtonHoverBGColor);
}
.uxpcore_dashboard__placeholder-icon-container {
  width: 60%;
  aspect-ratio: 1;
  background-color: transparent;
  display: flex;
  align-items: center;
  justify-content: center;
}
.uxpcore_dashboard__placeholder-icon {
  width: 100%;
  height: 100%;
}
.uxpcore_dashboard__placeholder-icon svg {
  width: 100%;
  height: 100%;
}
.uxpcore_dashboard__placeholder:hover .uxpcore_dashboard__placeholder-icon {
  opacity: 0.8;
}
.uxpcore_dashboard__placeholder--message {
  background-color: var(--primaryBGColor);
  color: var(--primaryTextColor);
  border: none;
  cursor: default;
}
.uxpcore_dashboard__placeholder--message:hover {
  background-color: var(--primaryBGColor);
}
.uxpcore_dashboard__placeholder-message-container {
  width: 90%;
  text-align: center;
  font-size: 1rem;
  padding: 1rem;
  color: var(--primaryTextColor);
}
.uxpcore_dashboard__save-status {
  position: fixed;
  bottom: 1.5rem;
  left: 50%;
  transform: translateX(-50%);
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  padding: 0.35rem 0.875rem;
  border-radius: 1rem;
  font-size: 0.75rem;
  font-weight: var(--fontWeightMedium);
  pointer-events: none;
  z-index: 999;
  background: var(--secondaryBGColor);
  border: 0.0625rem solid var(--borderColor);
  color: var(--primaryTextColor);
  box-shadow: 0 0.125rem 0.5rem var(--boxShadowColor);
  animation: dashboard-save-status-in 0.15s ease-out;
}
@keyframes dashboard-save-status-in {
  from {
    opacity: 0;
    transform: translateX(-50%) translateY(0.5rem);
  }
  to {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
  }
}
.uxpcore_dashboard__save-status--saved {
  border-color: var(--successButtonBorderColor);
  color: var(--successButtonBGColor);
}
.uxpcore_dashboard__save-status--error {
  border-color: var(--dangerButtonBorderColor);
  color: var(--dangerButtonBGColor);
}
.uxpcore_dashboard__save-status-spinner {
  display: inline-block;
  width: 0.625rem;
  height: 0.625rem;
  border: 0.125rem solid var(--borderColor);
  border-top-color: var(--accentColor);
  border-radius: 50%;
  animation: dashboard-save-spin 0.7s linear infinite;
  flex-shrink: 0;
}
@keyframes dashboard-save-spin {
  to {
    transform: rotate(360deg);
  }
}

.uxpcore_embeddeddashboard__overlay-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.uxpcore_embeddeddashboard__overlay-wrapper .uxpcore_dashboard__wrapper {
  position: relative;
  z-index: 1;
  pointer-events: none;
}

.uxpcore_modal.uxpcore_widgetdrawer__drawer .uxpcore_modal__panel {
  margin: auto;
  position: absolute;
  top: 30px;
  bottom: 30px;
  left: 30px;
  right: 30px;
  color: var(--primaryTextColor);
  background-color: var(--portalBGColor);
}
.uxpcore_modal.uxpcore_widgetdrawer__drawer .uxpcore_modal__panel .uxpcore_modal__header {
  display: none;
  border-bottom: none;
}
.uxpcore_modal.uxpcore_widgetdrawer__drawer .uxpcore_modal__panel .uxpcore_modal__header .uxpcore_modal__title {
  text-transform: uppercase;
  font-weight: var(--fontWeightBold);
}
.uxpcore_modal.uxpcore_widgetdrawer__drawer .uxpcore_modal__panel .uxpcore_modal__body {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  margin-bottom: 0;
  padding: 0;
}
.uxpcore_modal.uxpcore_widgetdrawer__preview-modal .uxpcore_modal__panel {
  min-width: 60rem !important;
}
.uxpcore_modal.uxpcore_widgetdrawer__preview-modal .uxpcore_modal__panel .uxpcore_modal__header {
  padding: 1rem !important;
}
.uxpcore_modal.uxpcore_widgetdrawer__preview-modal .uxpcore_modal__panel .uxpcore_modal__body {
  padding: 0 !important;
  margin: 0 !important;
}
.uxpcore_modal.uxpcore_widgetdrawer__loading-modal .uxpcore_modal__backdrop {
  background-color: rgba(0, 0, 0, 0.7);
  backdrop-filter: blur(4px);
}
.uxpcore_modal.uxpcore_widgetdrawer__loading-modal .uxpcore_modal__panel {
  width: auto;
  height: auto;
  min-width: 35rem;
  min-height: 25rem;
  background: linear-gradient(135deg, var(--portalBGColor) 0%, var(--portalHeaderBGColor) 100%);
  border-radius: 1.5rem;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
}
.uxpcore_modal.uxpcore_widgetdrawer__loading-modal .uxpcore_modal__panel .uxpcore_modal__header {
  display: none;
}
.uxpcore_modal.uxpcore_widgetdrawer__loading-modal .uxpcore_modal__panel .uxpcore_modal__body {
  padding: 0;
  margin: 0;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}

.uxpcore_widgetdrawer__container {
  width: 100%;
  height: 100%;
  display: flex;
}
.uxpcore_widgetdrawer__sidebar {
  width: 21rem;
  min-height: 0;
  flex-grow: 1;
  flex-shrink: 0;
  overflow-y: auto;
  overflow-x: hidden;
  background-color: var(--widgetDrawerSidebarBGColor);
  color: var(--portalHeaderTextColor);
  padding: 5rem 0 2rem 0;
  -ms-overflow-style: none;
  /* IE and Edge */
  scrollbar-width: none;
  /* Firefox */
}
.uxpcore_widgetdrawer__sidebar::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}
.uxpcore_widgetdrawer__filters__section {
  margin-bottom: 2rem;
}
.uxpcore_widgetdrawer__filters__section:last-child {
  margin-bottom: 0;
}
.uxpcore_widgetdrawer__filters__section-title {
  font-size: 0.75rem;
  font-weight: var(--fontWeightBold);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--portalHeaderTextColor);
  padding: 0 1rem 0.5rem;
  opacity: 0.7;
}
.uxpcore_widgetdrawer__filters__option {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.75rem 1rem;
  cursor: pointer;
  transition: all 200ms ease;
}
.uxpcore_widgetdrawer__filters__option:hover {
  background-color: rgba(255, 255, 255, 0.05);
}
.uxpcore_widgetdrawer__filters__option--selected {
  background-color: rgba(255, 255, 255, 0.15);
  font-weight: var(--fontWeightSemibold);
}
.uxpcore_widgetdrawer__filters__option-label {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  font-size: 0.95rem;
}
.uxpcore_widgetdrawer__filters__option-label svg {
  width: 1.2rem;
  height: 1.2rem;
  opacity: 0.8;
}
.uxpcore_widgetdrawer__filters__option-count {
  padding: 0.25rem 0.6rem;
  min-width: 2rem;
  font-size: 0.85rem;
  border-radius: 1rem;
  background-color: rgba(255, 255, 255, 0.2);
  text-align: center;
}
.uxpcore_widgetdrawer__filters__option-icon-bg {
  width: 1.2rem;
  height: 1.2rem;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  opacity: 0.8;
}
.uxpcore_widgetdrawer__category {
  margin-bottom: 5px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  transition: all 300ms ease-in-out;
  cursor: pointer;
  padding: 0 10px;
  position: relative;
}
.uxpcore_widgetdrawer__category:hover, .uxpcore_widgetdrawer__category--selected {
  background-color: rgba(255, 255, 255, 0.1);
}
.uxpcore_widgetdrawer__category-icon {
  width: 100%;
  height: 100%;
}
.uxpcore_widgetdrawer__category-icon--fa {
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}
.uxpcore_widgetdrawer__category-icon--bg {
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}
.uxpcore_widgetdrawer__category-icon-container {
  width: 2rem;
  aspect-ratio: 1;
}
.uxpcore_widgetdrawer__category-label {
  padding: 1rem;
}
.uxpcore_widgetdrawer__category-count {
  margin: auto;
  margin-right: 0;
  padding: 0.5rem;
  min-width: 2rem;
  min-height: 1.2rem;
  font-size: 0.9rem;
  border-radius: 5rem;
  background-color: rgba(255, 255, 255, 0.2);
  text-align: center;
}
.uxpcore_widgetdrawer__body {
  flex-grow: 1;
  width: 100%;
  display: flex;
  flex-direction: column;
}
.uxpcore_widgetdrawer__header {
  width: 100%;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1.5rem 1.5rem 1rem 1.5rem;
  flex-shrink: 0;
  border-bottom: 1px solid var(--borderColor);
}
.uxpcore_widgetdrawer__header-title {
  font-size: 1rem;
  font-weight: var(--fontWeightBold);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--primaryTextColor);
}
.uxpcore_widgetdrawer__toolbar {
  width: 100%;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  padding: 1.5rem 1.5rem 0 1.5rem;
  flex-shrink: 0;
  gap: 1rem;
}
.uxpcore_widgetdrawer__toolbar-left, .uxpcore_widgetdrawer__toolbar-right {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  gap: 0.75rem;
}
.uxpcore_widgetdrawer__toolbar-left {
  justify-content: flex-start;
  flex: 1;
}
.uxpcore_widgetdrawer__toolbar-left .uxp-search-box-container {
  flex: 1;
  max-width: 30rem;
}
.uxpcore_widgetdrawer__toolbar-left .uxp-search-box-container .search-box-container input {
  min-width: 100%;
}
.uxpcore_widgetdrawer__toolbar-right {
  justify-content: flex-end;
}
.uxpcore_widgetdrawer__toolbar-right .uxp-button {
  margin: 0;
  white-space: nowrap;
}
.uxpcore_widgetdrawer__counts {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  font-size: 0.85rem;
  color: var(--secondaryTextColor);
  padding: 1rem 1.5rem;
  flex-shrink: 0;
  flex-wrap: wrap;
}
.uxpcore_widgetdrawer__count-item {
  white-space: nowrap;
}
.uxpcore_widgetdrawer__count-item:first-child {
  font-weight: var(--fontWeightSemibold);
  color: var(--primaryTextColor);
}
.uxpcore_widgetdrawer__selected-count {
  display: flex;
  align-items: center;
  margin: 0 10px;
}
.uxpcore_widgetdrawer__selected-count-icon {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 50%;
}
.uxpcore_widgetdrawer__selected-count-text {
  text-transform: uppercase;
  font-size: 11px;
  white-space: nowrap;
  padding: 0 5px;
}
.uxpcore_widgetdrawer__content {
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.uxpcore_widgetdrawer__content-header {
  width: 100%;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem;
}
.uxpcore_widgetdrawer__content-title {
  flex-shrink: 0;
  text-transform: capitalize;
}
.uxpcore_widgetdrawer__content-result-count {
  flex-shrink: 0;
  text-align: right;
}
.uxpcore_widgetdrawer__content-body {
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
}
.uxpcore_widgetdrawer__loading-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 4rem;
  text-align: center;
}
.uxpcore_widgetdrawer__loading-icon {
  width: 8rem;
  height: 8rem;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 2rem;
  font-size: 6rem;
  color: var(--portalHeaderTextColor);
  animation: spin 1.5s linear infinite;
}
@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
.uxpcore_widgetdrawer__loading-icon svg {
  filter: drop-shadow(0 4px 12px rgba(0, 0, 0, 0.2));
}
.uxpcore_widgetdrawer__loading-message {
  font-size: 1.6rem;
  font-weight: var(--fontWeightSemibold);
  color: var(--primaryTextColor);
  margin-bottom: 1rem;
  animation: fadeInUp 0.5s ease-out;
  min-height: 2.5rem;
}
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.uxpcore_widgetdrawer__loading-submessage {
  font-size: 1.2rem;
  color: var(--secondaryTextColor);
  opacity: 0.8;
  animation: pulse 2s ease-in-out infinite;
}
@keyframes pulse {
  0%, 100% {
    opacity: 0.6;
  }
  50% {
    opacity: 1;
  }
}
.uxpcore_widgetdrawer__notification {
  width: 100%;
  text-align: center;
  padding: 20px;
}
.uxpcore_widgetdrawer__end-of-content {
  opacity: 0.5;
  font-size: 12px;
  color: var(--portalHeaderTextColor);
}
.uxpcore_widgetdrawer__no-widgets {
  opacity: 0.7;
  font-size: 14px;
  color: var(--portalHeaderTextColor);
}
.uxpcore_widgetdrawer__items {
  width: 100%;
  height: auto;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(22rem, 1fr));
  gap: 1rem;
  padding: 1.5rem;
}
.uxpcore_widgetdrawer__tile {
  width: 100%;
  height: auto;
  overflow: hidden;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 1rem;
  border-radius: 0.5rem;
  border: 1px solid var(--widgetDrawerTileBorderColor);
  background-color: var(--widgetDrawerTileBGColor);
  position: relative;
  transition: all 200ms ease;
  padding: 0.5rem;
  cursor: pointer;
}
.uxpcore_widgetdrawer__tile:hover {
  border-color: rgba(255, 255, 255, 0.5);
  background-color: var(--widgetDrawerTileHoverBGColor);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}
.uxpcore_widgetdrawer__tile--selected {
  border-color: rgba(255, 255, 255, 0.7);
  background-color: var(--widgetDrawerTileSelectedBGColor);
}
.uxpcore_widgetdrawer__tile-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 0.3rem;
  min-height: auto;
}
.uxpcore_widgetdrawer__tile-checkbox {
  position: absolute;
  top: 0.5rem;
  left: 0.5rem;
  z-index: 1;
}
.uxpcore_widgetdrawer__tile-badge {
  padding: 0.15rem 0.4rem;
  font-size: 0.6rem;
  font-weight: var(--fontWeightSemibold);
  text-transform: uppercase;
  border-radius: 0.25rem;
  letter-spacing: 0.03em;
  flex-shrink: 0;
  width: fit-content;
  margin-bottom: 0.3rem;
}
.uxpcore_widgetdrawer__tile-badge--added {
  background-color: rgba(var(--successColor-rgb, 76, 175, 80), 0.15);
  color: var(--successColor, #4caf50);
}
.uxpcore_widgetdrawer__tile-badge--installed {
  background-color: rgba(var(--infoColor-rgb, 33, 150, 243), 0.15);
  color: var(--infoColor, #2196f3);
}
.uxpcore_widgetdrawer__tile-badge--not-installed {
  background-color: rgba(158, 158, 158, 0.2);
  color: rgba(200, 200, 200, 0.9);
}
.uxpcore_widgetdrawer__tile-icon-wrapper {
  width: 5rem;
  height: 5rem;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: rgba(255, 255, 255, 0.1);
  border-radius: inherit;
}
.uxpcore_widgetdrawer__tile-icon {
  width: 100% !important;
  height: 100% !important;
  padding: 0.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: inherit;
}
.uxpcore_widgetdrawer__tile-icon .uxpcore_icon__img {
  width: 100%;
  height: 100%;
  background-size: cover;
  border-radius: inherit;
}
.uxpcore_widgetdrawer__tile-icon.uxpcore_icon svg {
  width: 50%;
  height: 50%;
}
.uxpcore_widgetdrawer__tile-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  min-width: 13rem;
}
.uxpcore_widgetdrawer__tile-title {
  font-size: 0.9rem;
  font-weight: var(--fontWeightSemibold);
  line-height: 1.3;
  color: var(--primaryTextColor);
}
.uxpcore_widgetdrawer__tile-description {
  font-size: 0.8rem;
  line-height: 1.4;
  color: var(--secondaryTextColor);
  opacity: 0.8;
}
.uxpcore_widgetdrawer__tile-actions {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.5rem;
  flex-shrink: 0;
  width: 2.5rem;
}
.uxpcore_widgetdrawer__tile-actions .uxp-button {
  flex: 1;
  min-width: 0;
  min-height: 0;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.uxpcore_widgetdrawer__item {
  width: max(18%, 15rem);
  height: auto;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  border-radius: 0.5rem;
  border: 1px solid transparent;
  position: relative;
  transition: all 300ms ease-in-out;
  padding: 1rem;
}
.uxpcore_widgetdrawer__item-thumbnail {
  width: 12rem;
  height: 12rem;
  position: relative;
  border-radius: 0.5rem;
  background-color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  margin-bottom: 1rem;
  cursor: pointer;
  border: 2px solid var(--borderColor);
  transition: transform 200ms ease-in-out;
}
.uxpcore_widgetdrawer__item-thumbnail:hover {
  transform: scale(1.05);
}
.uxpcore_widgetdrawer__item-indicator {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 20px;
  aspect-ratio: 1;
  border-radius: 50px;
  background-color: var(--secondaryBGColor);
  border: 1px solid var(--borderColor);
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  z-index: 1;
}
.uxpcore_widgetdrawer__item-indicator:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  translate: -50% -50%;
  width: 50%;
  height: 50%;
  border-radius: 5rem;
  background-color: var(--borderColor);
}
.uxpcore_widgetdrawer__item-icon {
  width: 6rem !important;
  height: 6rem !important;
}
.uxpcore_widgetdrawer__item-name {
  font-size: 12px;
  font-weight: var(--fontWeightBold);
  line-height: 1.5;
  text-align: center;
  margin-bottom: 5px;
}
.uxpcore_widgetdrawer__item-description {
  font-size: 11px;
  line-height: 1.5;
  opacity: 0.7;
  text-align: center;
  margin-bottom: 10px;
}
.uxpcore_widgetdrawer__item-buttons {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}
.uxpcore_widgetdrawer__flag {
  width: 150px;
  height: auto;
  position: absolute;
  text-align: center;
  padding: 4px;
  font-size: 9px;
  text-transform: uppercase;
  top: 20px;
  left: 30px;
  translate: -50%;
  rotate: -45deg;
  display: flex;
  align-items: center;
  justify-content: center;
}
.uxpcore_widgetdrawer__flag--installed {
  background-color: var(--toastSuccessBGColor);
  color: var(--toastSuccessTextColor);
}
.uxpcore_widgetdrawer__flag--not-installed {
  background-color: var(--toastInfoBGColor);
  color: var(--toastInfoTextColor);
}
.uxpcore_widgetdrawer__flag--used {
  background-color: var(--secondaryBGColor);
  color: var(--secondaryTextColor);
}
.uxpcore_widgetdrawer__preview-container {
  display: flex;
  gap: 20px;
  padding: 20px;
}
.uxpcore_widgetdrawer__preview-widget {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--portalBGColor);
  border-radius: 10px;
  overflow: hidden;
}
.uxpcore_widgetdrawer__preview-inner {
  transform-origin: center;
}
.uxpcore_widgetdrawer__preview-details {
  flex-grow: 1;
  display: flex;
  flex-direction: column;
}
.uxpcore_widgetdrawer__preview-info {
  flex-grow: 1;
}
.uxpcore_widgetdrawer__preview-name {
  font-size: 18px;
  font-weight: var(--fontWeightBold);
  margin-bottom: 10px;
}
.uxpcore_widgetdrawer__preview-categories {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-bottom: 10px;
}
.uxpcore_widgetdrawer__preview-category {
  padding: 4px 8px;
  background-color: var(--secondaryBGColor);
  color: var(--secondaryTextColor);
  border-radius: 4px;
  font-size: 10px;
  text-transform: uppercase;
}
.uxpcore_widgetdrawer__preview-description {
  font-size: 13px;
  line-height: 1.5;
  opacity: 0.8;
  margin-bottom: 10px;
}
.uxpcore_widgetdrawer__preview-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}
.uxpcore_widgetdrawer__preview-tag {
  padding: 4px 8px;
  background-color: var(--portalBGColor);
  border-radius: 4px;
  font-size: 10px;
}
.uxpcore_widgetdrawer__preview-actions {
  padding-top: 2rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

.uxpcore_widgetdrawer__item--selected .uxpcore_widgetdrawer__item-thumbnail {
  border: 2px solid var(--portalHeaderBGColor);
}
.uxpcore_widgetdrawer__item--selected .uxpcore_widgetdrawer__item-indicator {
  border: 1px solid var(--portalHeaderBGColor);
}
.uxpcore_widgetdrawer__item--selected .uxpcore_widgetdrawer__item-indicator:before {
  background-color: var(--portalHeaderBGColor);
}

.uxpcore_dashboard__editoverlay {
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.3);
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1000;
  border-radius: 8px;
}
.uxpcore_dashboard__editoverlay--container .uxpcore_dashboard__toolbar {
  top: unset;
  bottom: 0;
  right: auto;
  left: 50%;
  transform: translateX(-50%);
}
.uxpcore_dashboard__editoverlay--clickthrough {
  pointer-events: none;
  background-color: transparent;
}
.uxpcore_dashboard__editoverlay--clickthrough .uxpcore_dashboard__toolbar {
  pointer-events: auto;
}
.uxpcore_dashboard__toolbar {
  width: auto;
  height: auto;
  position: absolute;
  top: 0;
  right: 0;
  background-color: transparent;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.5rem;
  padding: 0.5rem;
}
.uxpcore_dashboard__infodropdown {
  padding: 0.75rem;
  width: 25rem;
  max-width: 25rem;
  height: auto;
  overflow: hidden;
}
.uxpcore_dashboard__infotable {
  width: 100%;
  table-layout: auto;
  border-collapse: collapse;
}
.uxpcore_dashboard__infotable td {
  padding: 0.5rem 0.75rem;
  vertical-align: middle;
}
.uxpcore_dashboard__infotable td.name {
  font-weight: var(--fontWeightSemibold);
  font-size: 1rem;
  color: var(--primaryTextColor);
  padding: 0.75rem;
  border-bottom: 1px solid var(--borderColor);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  cursor: pointer;
}
.uxpcore_dashboard__infotable td.label {
  font-size: 0.75rem;
  text-transform: uppercase;
  color: var(--secondaryTextColor);
  font-weight: var(--fontWeightMedium);
  padding-top: 0.75rem;
  padding-bottom: 0.25rem;
  opacity: 0.7;
}
.uxpcore_dashboard__infotable td.value {
  width: 100%;
  max-width: 0;
  overflow: hidden;
  padding-right: 0.5rem;
}
.uxpcore_dashboard__infotable td.value div {
  font-size: 0.875rem;
  color: var(--primaryTextColor);
  padding: 0.5rem 0.75rem;
  background-color: var(--secondaryBGColor);
  border-radius: 6px;
  border: 1px solid var(--borderColor);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%;
}
.uxpcore_dashboard__infotable td.action {
  width: 3rem;
  min-width: 3rem;
  max-width: 3rem;
  text-align: right;
  vertical-align: middle;
  padding-left: 0;
}
.uxpcore_dashboard__compactmenu {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.uxpcore_dashboard__iconbuttonrow {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.25rem;
  justify-content: flex-end;
}
.uxpcore_dashboard__menuseparator {
  width: 100%;
  height: 1px;
  background-color: var(--borderColor);
  margin: 0.25rem 0;
}

.uxpcore_dashboard__configmodal .uxpcore_modal__panel {
  min-width: 30rem !important;
  max-width: 95vw;
}
.uxpcore_dashboard__configmodal--default .uxpcore_modal__panel {
  width: 30rem !important;
  min-width: unset !important;
  max-width: unset !important;
}
.uxpcore_dashboard__configdesignerlink {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2rem;
  text-align: center;
}
.uxpcore_dashboard__noconfig {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 3rem 2rem;
  text-align: center;
}
.uxpcore_dashboard__noconfig p {
  font-size: 0.875rem;
  color: var(--secondaryTextColor);
  margin: 0;
}

.uxpcore_dashboard__widgetplaceholder {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  background-color: var(--secondaryBGColor);
  z-index: 99;
  border-radius: 0.5rem;
}
.uxpcore_dashboard__configplaceholder {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.5rem;
  overflow: hidden;
  isolation: isolate;
  border: 1px solid var(--borderColor);
}
.uxpcore_dashboard__configplaceholder-content {
  width: 100%;
  height: 100%;
  background-position: center center;
  background-size: cover;
  overflow: hidden;
  border-radius: inherit;
  display: flex;
  align-items: center;
  justify-content: center;
}
.uxpcore_dashboard__configplaceholder-details {
  width: 80%;
  height: 80%;
  overflow-y: auto;
  padding: 10px;
  margin: 0px;
  border-radius: inherit;
  z-index: 1;
  background-color: rgba(255, 255, 255, 0.2);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  -ms-overflow-style: none;
  /* IE and Edge */
  scrollbar-width: none;
  /* Firefox */
}
.uxpcore_dashboard__configplaceholder-details::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}
.uxpcore_dashboard__configplaceholder-details p {
  margin: 0.5rem;
}
.uxpcore_dashboard__configplaceholder-widget-name {
  font-weight: var(--fontWeightBold);
  font-size: 1.5rem;
  text-align: center;
}
.uxpcore_dashboard__configplaceholder-addon-name {
  font-weight: var(--fontWeightMedium);
  font-size: 1.1rem;
  text-align: center;
}
.uxpcore_dashboard__configplaceholder-message {
  line-height: 1.5;
  text-align: center;
}
.uxpcore_dashboard__configplaceholder-actions {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.5rem;
}

.uxpcore_dashboard__configplaceholder--addon .uxpcore_dashboard__configplaceholder-details {
  backdrop-filter: blur(50);
  -webkit-backdrop-filter: blur(50px);
  width: 100%;
  height: 100%;
}

.modal-container.uxpcore_dashboard__adminmenu__modal .modal-panel {
  min-width: unset;
  min-height: 25rem;
  max-width: unset;
  max-height: unset;
  width: 60rem;
}
.modal-container.uxpcore_dashboard__adminmenu__modal .modal-panel .modal-header .modal-title {
  font-size: 1.3rem;
}
.modal-container.uxpcore_dashboard__adminmenu__modal .modal-panel .modal-body {
  padding: 0;
  margin: 0;
  height: auto;
}

.uxpcore_dashboard__adminmenu__content {
  padding: 20px;
  max-height: 70vh;
  overflow-y: auto;
  -ms-overflow-style: none;
  /* IE and Edge */
  scrollbar-width: none;
  /* Firefox */
}
.uxpcore_dashboard__adminmenu__content::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}
.uxpcore_dashboard__adminmenu__note {
  width: 100%;
  height: auto;
  padding: 15px;
  border-radius: 10px;
  background-color: rgba(0, 102, 255, 0.0784313725);
  font-size: 14px;
  font-weight: var(--fontWeightBold);
  margin-bottom: 10px;
  color: var(--primaryTextColor);
}
.uxpcore_dashboard__adminmenu__section {
  width: 100%;
  height: auto;
  padding: 15px;
  margin-bottom: 10px;
}
.uxpcore_dashboard__adminmenu__section-title {
  width: 100%;
  height: auto;
  font-weight: var(--fontWeightBold);
  font-size: 14px;
  color: var(--primaryTextColor);
}
.uxpcore_dashboard__adminmenu__section-description {
  padding: 10px 0;
  font-size: 12px;
  padding-left: 30px;
  color: var(--primaryTextColor);
}
.uxpcore_dashboard__adminmenu__section-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: 10px;
}
.uxpcore_dashboard__adminmenu__section-actions > .uxp-button {
  background-color: #0066ff;
  color: white;
  margin: 0;
}

[dir=rtl] .uxpcore_dashboard__adminmenu__section-description {
  padding-left: 0;
  padding-right: 30px;
}
[dir=rtl] .uxpcore_dashboard__adminmenu__section-actions {
  justify-content: flex-start;
}

.uxpcore_dashboardsettingsmodal__actions--spread {
  justify-content: space-between;
}
.uxpcore_dashboardsettingsmodal__actions--spread a {
  text-decoration: none;
}
.uxpcore_dashboardsettingsmodal__danger-item-text .uxpcore_checkbox-wrapper {
  margin-top: 0.5rem;
}

.uxpcore_dashboardconfigpanel {
  position: fixed;
  inset-inline-end: 1rem;
  top: 1rem;
  z-index: 1000;
  background-color: var(--primaryBGColor);
  border: 1px solid var(--borderColor);
  border-radius: 10rem;
  max-width: 90vw;
}
.uxpcore_dashboardconfigpanel__row {
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 0.3rem;
  gap: 0.3rem;
}
.uxpcore_dashboardconfigpanel__handle {
  flex-shrink: 0;
  cursor: grab;
}
.uxpcore_dashboardconfigpanel__handle:active {
  cursor: grabbing;
}
.uxpcore_dashboardconfigpanel__handle .uxpcore_button {
  border-radius: 50% !important;
}
.uxpcore_dashboardconfigpanel__select.uxpcore_select {
  display: inline-block;
}
.uxpcore_dashboardconfigpanel__select .uxpcore_select__custom-trigger {
  display: flex;
  align-items: center;
  cursor: pointer;
}
.uxpcore_dashboardconfigpanel__select .uxpcore_button {
  border-radius: 10rem;
  white-space: nowrap;
  max-width: 10rem;
}
.uxpcore_dashboardconfigpanel__select .uxpcore_button__text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 8rem;
  font-size: 0.9rem;
}

.uxpcore_dashboardsettingsmodal .uxpcore_modal__panel {
  width: 45rem !important;
  min-width: unset !important;
  max-width: 95vw;
}
.uxpcore_dashboardsettingsmodal__body {
  display: flex;
  flex-direction: column;
  padding: 0.25rem 0;
}
.uxpcore_dashboardsettingsmodal__section {
  border-bottom: 1px solid var(--borderColor);
}
.uxpcore_dashboardsettingsmodal__section:last-child {
  border-bottom: none;
}
.uxpcore_dashboardsettingsmodal__section--danger {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding: 1rem 0 0.25rem;
}
.uxpcore_dashboardsettingsmodal__collapse.uxpcore_collapse__container {
  border: none;
  border-radius: 0;
  background: transparent;
}
.uxpcore_dashboardsettingsmodal__collapse .uxpcore_collapse__header {
  padding: 0.85rem 0;
  font-size: 0.8rem;
  font-weight: var(--fontWeightSemibold);
  color: var(--primaryTextColor);
}
.uxpcore_dashboardsettingsmodal__collapse .uxpcore_collapse__content {
  padding-bottom: 1rem;
}
.uxpcore_dashboardsettingsmodal__collapse-content {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}
.uxpcore_dashboardsettingsmodal__description {
  font-size: 0.82rem;
  color: var(--secondaryTextColor);
  margin: 0;
  line-height: 1.4;
}
.uxpcore_dashboardsettingsmodal__section-label {
  font-size: 0.72rem;
  font-weight: var(--fontWeightBold);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--primaryTextColor);
  opacity: 0.55;
  margin: 0 0 0.65rem;
  padding-top: 0.85rem;
}
.uxpcore_dashboardsettingsmodal__grid-settings {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin-bottom: 0.75rem;
}
.uxpcore_dashboardsettingsmodal__grid-field {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}
.uxpcore_dashboardsettingsmodal__grid-field .uxpcore_input,
.uxpcore_dashboardsettingsmodal__grid-field .uxpcore_checkbox-wrapper {
  flex-shrink: 0;
}
.uxpcore_dashboardsettingsmodal__grid-field .uxpcore_input {
  max-width: 120px;
}
.uxpcore_dashboardsettingsmodal__grid-label {
  font-size: 0.82rem;
  color: var(--primaryTextColor);
  flex: 1;
}
.uxpcore_dashboardsettingsmodal__grid-label-group {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
  flex: 1;
}
.uxpcore_dashboardsettingsmodal__grid-hint {
  font-size: 0.75rem;
  color: var(--secondaryTextColor);
  line-height: 1.3;
}
.uxpcore_dashboardsettingsmodal__sublabel {
  font-size: 0.8rem;
  font-weight: var(--fontWeightSemibold);
  color: var(--primaryTextColor);
  margin: 0.1rem 0 -0.1rem;
}
.uxpcore_dashboardsettingsmodal__actions {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  gap: 0.5rem;
  margin-top: 0.25rem;
}
.uxpcore_dashboardsettingsmodal__actions .uxpcore_button {
  width: auto !important;
  flex-shrink: 0;
}
.uxpcore_dashboardsettingsmodal__checkboxlist {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  max-height: 120px;
  overflow-y: auto;
  padding: 0.35rem 0.5rem;
  border: 1px solid var(--borderColor);
  border-radius: 0.5rem;
  background: var(--secondaryBGColor);
}
.uxpcore_dashboardsettingsmodal__checkbox-item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  cursor: pointer;
  font-size: 0.875rem;
  padding: 0.18rem 0.25rem;
  border-radius: 0.3rem;
  user-select: none;
}
.uxpcore_dashboardsettingsmodal__checkbox-item:hover {
  background: var(--hoverColor);
}
.uxpcore_dashboardsettingsmodal__checkbox-item input[type=checkbox] {
  cursor: pointer;
  accent-color: var(--accentColor);
  flex-shrink: 0;
}
.uxpcore_dashboardsettingsmodal__checkbox-item--select-all {
  font-weight: var(--fontWeightSemibold);
  font-size: 0.8rem;
  border-bottom: 1px solid var(--borderColor);
  padding-bottom: 0.3rem;
  margin-bottom: 0.1rem;
  border-radius: 0;
}
.uxpcore_dashboardsettingsmodal__danger-header {
  font-size: 0.7rem;
  font-weight: var(--fontWeightBold);
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--dangerColor, #e53e3e);
  margin: 0;
}
.uxpcore_dashboardsettingsmodal__danger-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.65rem 0.75rem;
  border: 1px solid var(--borderColor);
  border-radius: 0.5rem;
  background: var(--secondaryBGColor);
}
.uxpcore_dashboardsettingsmodal__danger-item .uxpcore_button {
  width: auto !important;
  flex-shrink: 0;
  white-space: nowrap;
}
.uxpcore_dashboardsettingsmodal__danger-item-text {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  flex: 1;
  min-width: 0;
}
.uxpcore_dashboardsettingsmodal__danger-item-title {
  font-size: 0.875rem;
  font-weight: var(--fontWeightSemibold);
  color: var(--primaryTextColor);
}
.uxpcore_dashboardsettingsmodal__danger-item-desc {
  font-size: 0.78rem;
  color: var(--secondaryTextColor);
  line-height: 1.35;
  word-break: break-word;
  overflow-wrap: break-word;
}

.uxpcore_bgconfigmodal .uxpcore_modal__body {
  padding: 0.5rem;
}
.uxpcore_bgconfigmodal__content {
  display: flex;
  flex-direction: column;
  min-width: 30rem;
  min-height: 10rem;
}
.uxpcore_bgconfigmodal__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.5rem 0.5rem 0;
  border-top: 0.0625rem solid var(--borderColor);
  margin-top: 0.5rem;
  gap: 0.5rem;
}
.uxpcore_bgconfigmodal__save-status {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  font-size: 0.75rem;
  color: var(--primaryTextColor);
  opacity: 0.7;
  min-height: 1.25rem;
  flex: 1;
}
.uxpcore_bgconfigmodal__save-status-spinner {
  display: inline-block;
  width: 0.75rem;
  height: 0.75rem;
  border: 0.125rem solid var(--borderColor);
  border-top-color: var(--accentColor);
  border-radius: 50%;
  animation: bgmodal-spin 0.7s linear infinite;
  flex-shrink: 0;
}
@keyframes bgmodal-spin {
  to {
    transform: rotate(360deg);
  }
}
.uxpcore_bgconfigmodal__save-status-icon {
  font-size: 0.75rem;
  font-weight: var(--fontWeightBold);
  flex-shrink: 0;
}
.uxpcore_bgconfigmodal__save-status-icon--saved {
  color: var(--successButtonBGColor);
}
.uxpcore_bgconfigmodal__save-status-icon--error {
  color: var(--dangerButtonBGColor);
}

.uxpcore_widgetpanel {
  display: flex;
  flex-direction: column;
  height: 100%;
  background: transparent;
  border-radius: var(--borderRadius);
  overflow: hidden;
}
.uxpcore_widgetpanel__header {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.35rem 0.5rem;
  border-bottom: 1px solid var(--borderColor);
  flex-shrink: 0;
  min-height: 2rem;
}
.uxpcore_widgetpanel__title {
  flex: 1;
  font-size: 0.8rem;
  font-weight: var(--fontWeightMedium);
  color: var(--primaryTextColor);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.uxpcore_widgetpanel__edit-btn, .uxpcore_widgetpanel__add-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.5rem;
  height: 1.5rem;
  border-radius: var(--borderRadius);
  border: none;
  background: transparent;
  color: var(--secondaryTextColor);
  cursor: pointer;
  font-size: 0.85rem;
  flex-shrink: 0;
  padding: 0;
}
.uxpcore_widgetpanel__edit-btn:hover, .uxpcore_widgetpanel__add-btn:hover {
  background: var(--hoverBGColor);
  color: var(--primaryTextColor);
}
.uxpcore_widgetpanel__edit-btn--active {
  background: var(--primaryColor);
  color: var(--primaryColorText);
}
.uxpcore_widgetpanel__edit-btn--active:hover {
  background: var(--primaryColorDark);
  color: var(--primaryColorText);
}
.uxpcore_widgetpanel__body {
  flex: 1;
  min-height: 0;
  overflow: hidden;
}
.uxpcore_widgetpanel__body .uxpcore_dashboard__container {
  -ms-overflow-style: none;
  /* IE and Edge */
  scrollbar-width: none;
  /* Firefox */
}
.uxpcore_widgetpanel__body .uxpcore_dashboard__container::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}
.uxpcore_widgetpanel__body .uxpcore_dashboard__layout {
  -ms-overflow-style: none;
  /* IE and Edge */
  scrollbar-width: none;
  /* Firefox */
}
.uxpcore_widgetpanel__body .uxpcore_dashboard__layout::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}
.uxpcore_widgetpanel--vertical .uxpcore_widgetpanel__body {
  overflow-y: auto;
  overflow-x: hidden;
}
.uxpcore_widgetpanel--horizontal .uxpcore_widgetpanel__body {
  overflow-x: auto;
  overflow-y: hidden;
  -ms-overflow-style: none;
  /* IE and Edge */
  scrollbar-width: none;
  /* Firefox */
}
.uxpcore_widgetpanel--horizontal .uxpcore_widgetpanel__body::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}
.uxpcore_widgetpanel--horizontal .uxpcore_dashboard__wrapper,
.uxpcore_widgetpanel--horizontal .uxpcore_dashboard__container {
  overflow: visible;
  height: 100%;
  min-height: unset;
}

.uxpcore_diagwidget__container {
  padding: 1rem;
  height: 100%;
  overflow: auto;
  font-size: 0.85rem;
  color: var(--primaryTextColor);
}
.uxpcore_diagwidget__section {
  margin-bottom: 1.5rem;
}
.uxpcore_diagwidget__heading {
  font-size: 0.7rem;
  font-weight: var(--fontWeightBold);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--secondaryTextColor);
  margin: 0 0 0.5rem;
  padding-bottom: 0.25rem;
  border-bottom: 1px solid var(--borderColor);
}
.uxpcore_diagwidget__empty {
  font-size: 0.8rem;
  font-style: italic;
  color: var(--disabledTextColor);
  margin: 0;
}
.uxpcore_diagwidget__table {
  width: 100%;
  border-collapse: collapse;
}
.uxpcore_diagwidget__table th {
  text-align: left;
  padding: 0.3rem 0.6rem;
  background: var(--tableHeaderBGColor);
  font-size: 0.68rem;
  font-weight: var(--fontWeightBold);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--primaryTextColor);
}
.uxpcore_diagwidget__table tr:hover td {
  background: var(--highlightBGColor);
}
.uxpcore_diagwidget__table td {
  padding: 0.3rem 0.6rem;
  border-bottom: 1px solid var(--borderColor);
  vertical-align: top;
}
.uxpcore_diagwidget__key {
  font-weight: var(--fontWeightSemibold);
  white-space: nowrap;
  width: 30%;
  min-width: 100px;
  color: var(--primaryTextColor);
}
.uxpcore_diagwidget__value {
  font-family: monospace;
  font-size: 0.8rem;
  word-break: break-all;
  white-space: pre-wrap;
  color: var(--secondaryTextColor);
}

.uxpcore_pageeditor {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 999;
  background-color: var(--primaryBGColor);
  color: var(--primaryTextColor);
  background: var(--secondaryBGColor);
  backdrop-filter: blur(150px);
  -webkit-backdrop-filter: blur(150px);
  border: 1px solid var(--borderColor);
}
.uxpcore_pageeditor__header {
  width: 100%;
  height: auto;
  padding: 1rem;
  border-bottom: 1px solid var(--borderColor);
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}
.uxpcore_pageeditor__header_left {
  flex: 1 1 auto;
}
.uxpcore_pageeditor__title {
  font-size: 1.1rem;
  padding: 0.25rem;
}
.uxpcore_pageeditor__actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0 0.5rem;
}
.uxpcore_pageeditor__description {
  font-style: italic;
  opacity: 0.7;
  padding: 0.25rem;
}
.uxpcore_pageeditor__body {
  width: 100%;
  min-height: 0;
  flex: 1 1 auto;
  display: flex;
}
.uxpcore_pageeditor__sidebar {
  width: 25rem;
  height: 100%;
  flex-shrink: 0;
  overflow-y: auto;
  border-inline-end: 1px solid var(--borderColor);
  padding: 1rem;
}
.uxpcore_pageeditor__sidebar .uxpcore_treeview__container {
  background-color: transparent;
  padding: 0;
  height: auto;
}
.uxpcore_pageeditor__content {
  width: 100%;
  height: 100%;
  position: relative;
  display: flex;
  flex-direction: column;
}
.uxpcore_pageeditor__content_header {
  width: 100%;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem;
  border-bottom: 1px solid var(--borderColor);
}
.uxpcore_pageeditor__page_name {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0.5rem;
}
.uxpcore_pageeditor__content_preview {
  width: 100%;
  min-height: 0;
  flex: 1 1 auto;
  padding: 2rem;
  position: relative;
}
.uxpcore_pageeditor__content_preview .uxpcore_pluggableview {
  zoom: 0.75;
}
.uxpcore_pageeditor__sidebar_section_label {
  font-size: 0.7rem;
  font-weight: var(--fontWeightSemibold);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  opacity: 0.5;
  padding: 0.5rem 0.25rem 0.5rem;
  margin-top: 0.25rem;
}
.uxpcore_pageeditor__sidebar_divider {
  height: 1px;
  background: var(--borderColor);
  margin: 0.75rem 0;
}
.uxpcore_pageeditor__content_body {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
}
.uxpcore_pageeditor__error, .uxpcore_pageeditor__empty {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1rem;
}
.uxpcore_pageeditor__error_message, .uxpcore_pageeditor__empty_message {
  font-size: 1rem;
  opacity: 0.7;
  text-align: center;
  max-width: 400px;
}
.uxpcore_pageeditor__error_message {
  color: var(--errorColor, #e53e3e);
}

.uxpcore_tabseditor {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  overflow-y: auto;
}
.uxpcore_tabseditor__empty {
  padding: 1.5rem 1rem;
  opacity: 0.6;
  font-size: 0.875rem;
  font-style: italic;
  text-align: center;
}
.uxpcore_tabseditor__body {
  display: flex;
  min-height: 0;
  flex: 1;
}
.uxpcore_tabseditor__list {
  flex: 1 1 auto;
  min-width: 0;
  border-inline-end: 1px solid var(--borderColor);
  display: flex;
  flex-direction: column;
  overflow-y: auto;
}
.uxpcore_tabseditor__section_header {
  font-size: 0.65rem;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  opacity: 0.45;
  padding: 0.5rem 0.75rem 0.35rem;
  border-bottom: 1px solid var(--borderColor);
  background: var(--secondaryBGColor);
  position: sticky;
  top: 0;
  z-index: 1;
}
.uxpcore_tabseditor__tab_row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  padding: 0.65rem 0.5rem 0.65rem 0.75rem;
  border-bottom: 1px solid var(--borderColor);
  cursor: pointer;
  transition: background 0.15s;
}
.uxpcore_tabseditor__tab_row:hover:not(.uxpcore_tabseditor__tab_row--selected) {
  background-color: var(--highlightBGColor);
  color: var(--highlightTextColor);
}
.uxpcore_tabseditor__tab_row--selected {
  background-color: var(--selectedBGColor);
  color: var(--selectedTextColor);
}
.uxpcore_tabseditor__tab_row--disabled {
  opacity: 0.5;
}
.uxpcore_tabseditor__tab_row_info {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  min-width: 0;
  flex: 1;
  font-size: 1.05rem;
}
.uxpcore_tabseditor__tab_row_name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 1.05rem;
}
.uxpcore_tabseditor__tab_row_actions {
  display: flex;
  align-items: center;
  gap: 0.2rem;
  flex-shrink: 0;
  margin-inline-start: 0.75rem;
}
.uxpcore_tabseditor__preview_panel {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.uxpcore_tabseditor__preview_panel__inner {
  display: flex;
  flex-direction: row;
  min-height: 0;
  flex: 1 1 auto;
  overflow: hidden;
}

.uxpcore_obsdp__additional_details_tab.uxpcore_tabseditor__preview_tab--hardcoded {
  opacity: 0.6;
}

.uxpcore_injectedtab__content {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.uxpcore_pluggableview {
  width: 100%;
  height: 100%;
  position: relative;
}

.uxpcore_floatingactions {
  position: fixed;
  bottom: 2rem;
  right: 2rem;
  z-index: 1000;
  user-select: none;
}
.uxpcore_floatingactions__container {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  align-items: center;
  pointer-events: none;
  background-color: var(--primaryBGColor);
  border-radius: 50rem;
  padding: 0.4rem;
}
.uxpcore_floatingactions__draghandle {
  pointer-events: auto;
  cursor: grab !important;
}
.uxpcore_floatingactions__draghandle:active {
  cursor: grabbing !important;
}
.uxpcore_floatingactions__section {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  align-items: center;
  pointer-events: none;
}
.uxpcore_floatingactions__button {
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: auto;
  cursor: pointer;
}
.uxpcore_floatingactions__button--rounded {
  border-radius: 50% !important;
}
.uxpcore_floatingactions__button--rounded:hover {
  transform: scale(1.1);
  transition: transform 0.2s ease;
}

[dir=rtl] .uxpcore_floatingactions {
  right: auto;
  left: 2rem;
}

.uxpcore_qrcode__container {
  padding: 1rem;
  width: auto;
  height: auto;
  display: inline-block;
  border-radius: 0.5rem;
}
.uxpcore_qrcode__container--has-shadow {
  box-shadow: 0 0 8px 2px rgba(0, 0, 0, 0.12);
}

.uxpcore_notification {
  width: 100%;
  height: auto;
  padding: 2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.9rem;
  color: var(--primaryTextColor);
  border-radius: 0.5rem;
}
.uxpcore_notification--primary {
  background-color: var(--primaryButtonBGColor);
  color: var(--primaryButtonTextColor);
}
.uxpcore_notification--secondary {
  background-color: var(--secondaryButtonBGColor);
  color: var(--secondaryButtonTextColor);
}
.uxpcore_notification--danger {
  background-color: var(--dangerButtonBGColor);
  color: var(--dangerButtonTextColor);
}
.uxpcore_notification--warning {
  background-color: var(--warningButtonBGColor);
  color: var(--warningButtonTextColor);
}
.uxpcore_notification--info {
  background-color: var(--infoButtonBGColor);
  color: var(--infoButtonTextColor);
}
.uxpcore_notification--success {
  background-color: var(--successButtonBGColor);
  color: var(--successButtonTextColor);
}
.uxpcore_notification--compact {
  padding: 0.5rem 0.9rem;
  font-size: 1rem;
}
.uxpcore_notification--bordered {
  background-color: transparent;
  justify-content: flex-start;
  text-align: left;
  border-left: 3px solid currentColor;
  border-radius: 3px;
}
.uxpcore_notification--primary.uxpcore_notification--bordered {
  background-color: color-mix(in srgb, var(--primaryButtonBGColor) 12%, transparent);
  color: var(--primaryButtonBGColor);
}
.uxpcore_notification--secondary.uxpcore_notification--bordered {
  background-color: color-mix(in srgb, var(--secondaryButtonBGColor) 12%, transparent);
  color: var(--secondaryButtonBGColor);
}
.uxpcore_notification--danger.uxpcore_notification--bordered {
  background-color: color-mix(in srgb, var(--dangerButtonBGColor) 12%, transparent);
  color: var(--dangerButtonBGColor);
}
.uxpcore_notification--warning.uxpcore_notification--bordered {
  background-color: color-mix(in srgb, var(--warningButtonBGColor) 12%, transparent);
  color: var(--warningButtonBGColor);
}
.uxpcore_notification--info.uxpcore_notification--bordered {
  background-color: color-mix(in srgb, var(--infoButtonBGColor) 12%, transparent);
  color: var(--infoButtonBGColor);
}
.uxpcore_notification--success.uxpcore_notification--bordered {
  background-color: color-mix(in srgb, var(--successButtonBGColor) 12%, transparent);
  color: var(--successButtonBGColor);
}
.uxpcore_notification--end-of-content {
  padding: 3rem;
}
.uxpcore_notification--no-items-found {
  padding: 5rem;
}

/**
 * Auth Helper Component - v5 Pattern
 * Compact login modal with theme support
 */
.uxpcore_authhelper {
  width: 25rem;
  height: 35rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 2rem;
  gap: 1.5rem;
}
.uxpcore_authhelper__profile {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1rem;
}
.uxpcore_authhelper__name {
  font-size: 1.2rem;
  font-weight: var(--fontWeightSemibold);
  color: var(--primaryTextColor);
  text-align: center;
}
.uxpcore_authhelper__description {
  text-align: center;
  font-size: 1rem;
  color: var(--secondaryTextColor);
  line-height: 1.5;
  white-space: pre-line;
}
.uxpcore_authhelper__actions {
  width: 100%;
  display: flex;
  justify-content: center;
  padding-top: 0.5rem;
}
.uxpcore_authhelper__modal .uxpcore_modal__panel .uxpcore_modal__header {
  display: none;
}

@keyframes uxpcore-addon-spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes uxpcore-addon-ring-pulse {
  0% {
    transform: scale(0.8);
    opacity: 0.6;
  }
  50% {
    transform: scale(1.3);
    opacity: 0.15;
  }
  100% {
    transform: scale(0.8);
    opacity: 0.6;
  }
}
@keyframes uxpcore-addon-icon-pulse {
  0%, 100% {
    transform: translateY(0);
    opacity: 1;
  }
  50% {
    transform: translateY(-4px);
    opacity: 0.75;
  }
}
@keyframes uxpcore-addon-check-pop {
  0% {
    transform: scale(0);
    opacity: 0;
  }
  60% {
    transform: scale(1.25);
    opacity: 1;
  }
  80% {
    transform: scale(0.92);
  }
  100% {
    transform: scale(1);
    opacity: 1;
  }
}
.uxpcore_addon-install .uxpcore_modal__body {
  padding: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.uxpcore_addon-install--loading .uxpcore_modal__panel,
.uxpcore_addon-install--installing .uxpcore_modal__panel,
.uxpcore_addon-install--done .uxpcore_modal__panel {
  min-height: auto;
}

.uxpcore_addon-install--configuring .uxpcore_modal__panel {
  min-height: 64%;
}

.uxpcore_addon-install__content {
  width: 100%;
  min-height: 320px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  position: relative;
}
.uxpcore_addon-install__content::before {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--secondaryBGColor);
  opacity: 0.9;
}
.uxpcore_addon-install__content > * {
  position: relative;
  z-index: 1;
  width: 100%;
}
.uxpcore_addon-install__content--configure {
  background-image: none !important;
  background-color: transparent;
  min-height: 0;
  flex: 1;
  align-items: stretch;
}
.uxpcore_addon-install__content--configure::before {
  display: none;
}
.uxpcore_addon-install__content--configure > * {
  flex: 1;
  display: flex;
  flex-direction: column;
}

.uxpcore_addon-install__loading {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 320px;
}

.uxpcore_addon-install__installing {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2rem;
  padding: 2.5rem 2rem;
  min-height: 320px;
}

.uxpcore_addon-install__anim {
  position: relative;
  width: 7rem;
  height: 7rem;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.uxpcore_addon-install__anim-ring {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  border: 3px solid transparent;
  border-top-color: var(--primaryButtonBGColor);
  border-right-color: var(--primaryButtonBGColor);
  animation: uxpcore-addon-spin 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
}
.uxpcore_addon-install__anim-ring--delay {
  border: 2px solid var(--primaryButtonBGColor);
  opacity: 0.12;
  animation: uxpcore-addon-ring-pulse 2s ease-in-out infinite;
}

.uxpcore_addon-install__anim-icon {
  font-size: 2rem;
  color: var(--primaryButtonBGColor);
  animation: uxpcore-addon-icon-pulse 2s ease-in-out infinite;
  display: flex;
  align-items: center;
  justify-content: center;
}

.uxpcore_addon-install__message {
  text-align: center;
  color: var(--primaryTextColor);
  font-size: 0.9rem;
  line-height: 1.6;
  max-width: 300px;
}
.uxpcore_addon-install__message strong, .uxpcore_addon-install__message b {
  font-weight: var(--fontWeightSemibold);
  color: var(--primaryTextColor);
}

.uxpcore_addon-install__configure {
  width: 100%;
  flex: 1;
  display: flex;
  flex-direction: column;
}
.uxpcore_addon-install__configure > * {
  flex: 1;
  min-height: 0;
}

.uxpcore_addon-install__configure-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 320px;
}

.uxpcore_addon-install__done {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1.25rem;
  padding: 2.5rem 2rem;
  min-height: 320px;
}

.uxpcore_addon-install__done-icon {
  font-size: 3.5rem;
  color: var(--primaryButtonBGColor);
  animation: uxpcore-addon-check-pop 0.5s cubic-bezier(0.19, 1, 0.22, 1) forwards;
  display: flex;
  align-items: center;
  justify-content: center;
}

.uxpcore_addon-install__actions {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  margin-top: 0.5rem;
}

.uxpcore_componentrenderer__container {
  width: 100%;
  height: 100%;
  position: relative;
}
.uxpcore_componentrenderer__not-found {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0.6;
  font-size: 0.875rem;
}
.uxpcore_componentrenderer__config-placeholder {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 1.5rem 1rem;
  text-align: center;
  border: 1px solid var(--borderColor);
  border-radius: 0.833rem;
}
.uxpcore_componentrenderer__config-placeholder-name {
  font-weight: var(--fontWeightSemibold);
  font-size: 0.9rem;
}
.uxpcore_componentrenderer__config-placeholder-message {
  opacity: 0.6;
  font-size: 0.8rem;
  max-width: 260px;
}
.uxpcore_componentrenderer__addon-placeholder {
  position: absolute;
  inset: 0;
  overflow: hidden;
  border-radius: 0.5rem;
  border: 1px solid var(--borderColor);
  isolation: isolate;
}
.uxpcore_componentrenderer__addon-placeholder-content {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background-size: cover;
  background-position: center;
  border-radius: inherit;
  overflow: hidden;
}
.uxpcore_componentrenderer__addon-placeholder-details {
  width: 80%;
  height: 80%;
  overflow-y: auto;
  padding: 10px;
  border-radius: inherit;
  z-index: 1;
  background-color: rgba(255, 255, 255, 0.2);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  -ms-overflow-style: none;
  /* IE and Edge */
  scrollbar-width: none;
  /* Firefox */
}
.uxpcore_componentrenderer__addon-placeholder-details::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}
.uxpcore_componentrenderer__addon-placeholder-details p {
  margin: 0.5rem;
  text-align: center;
}
.uxpcore_componentrenderer__addon-placeholder-name {
  font-weight: var(--fontWeightBold);
  font-size: 1.2rem;
}
.uxpcore_componentrenderer__addon-placeholder-addon-name {
  font-weight: var(--fontWeightMedium);
  font-size: 1rem;
}
.uxpcore_componentrenderer__addon-placeholder-message {
  font-size: 0.875rem;
  line-height: 1.5;
}
.uxpcore_componentrenderer__addon-placeholder-actions {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.5rem;
}

.uxpcore_icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  margin: 0;
  flex-shrink: 0;
  line-height: 1;
  font-size: inherit;
  width: 100%;
  height: 100%;
}
.uxpcore_icon--image {
  width: 100%;
  height: 100%;
}
.uxpcore_icon__img {
  width: 100%;
  height: 100%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}
.uxpcore_icon__text {
  display: inline-block;
  text-align: center;
  justify-content: center;
  line-height: 1;
}

.uxp-icon-wrapper {
  display: inline-block;
  line-height: 1;
  vertical-align: middle;
}

.uxp-icon-fw {
  width: 1.25em;
  text-align: center;
}

.uxp-icon-border {
  padding: 0.2em 0.25em 0.25em;
  border: 0.08em solid var(--primaryBorderColor, #eee);
  border-radius: 0.1em;
}

@keyframes uxp-icon-spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.uxp-icon-spin {
  animation: uxp-icon-spin 2s linear infinite;
}

@keyframes uxp-icon-pulse {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.5;
  }
  100% {
    opacity: 1;
  }
}
.uxp-icon-pulse {
  animation: uxp-icon-pulse 2s ease-in-out infinite;
}

@keyframes uxp-icon-beat {
  0%, 90% {
    transform: scale(1);
  }
  45% {
    transform: scale(1.25);
  }
}
.uxp-icon-beat {
  animation: uxp-icon-beat 1.3s ease-in-out infinite;
}

@keyframes uxp-icon-bounce {
  0%, 10%, 20%, 50%, 80%, 100% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-0.3em);
  }
  60% {
    transform: translateY(-0.15em);
  }
}
.uxp-icon-bounce {
  animation: uxp-icon-bounce 2s ease-in-out infinite;
}

@keyframes uxp-icon-shake {
  0%, 100% {
    transform: translateX(0);
  }
  10%, 30%, 50%, 70%, 90% {
    transform: translateX(-0.1em);
  }
  20%, 40%, 60%, 80% {
    transform: translateX(0.1em);
  }
}
.uxp-icon-shake {
  animation: uxp-icon-shake 0.8s ease-in-out infinite;
}

@keyframes uxp-icon-fade {
  0%, 100% {
    opacity: 1;
  }
  50% {
    opacity: 0.3;
  }
}
.uxp-icon-fade {
  animation: uxp-icon-fade 2s ease-in-out infinite;
}

.uxpcore-phicon-wrapper {
  width: 100%;
  height: 100%;
  font-size: inherit;
  display: flex;
  align-items: center;
  justify-content: center;
}

.uxpcore_breadcrumb {
  width: 100%;
  background-color: var(--breadcrumb-bg-color, inherit);
  color: var(--breadcrumb-text-color, inherit);
}
.uxpcore_breadcrumb__list {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  list-style: none;
  gap: 0.5rem;
  margin: 0;
  padding: 0.4rem;
}
.uxpcore_breadcrumb__list-item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.uxpcore_breadcrumb__item {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.875rem;
  text-decoration: none;
  transition: color 0.2s;
}
.uxpcore_breadcrumb__item--link, .uxpcore_breadcrumb__item--button {
  cursor: pointer;
  background: none;
  border: none;
  padding: 0;
  font: inherit;
  color: var(--breadcrumb-text-color, var(--primaryTextColor));
}
.uxpcore_breadcrumb__item--link:hover, .uxpcore_breadcrumb__item--button:hover {
  color: var(--breadcrumb-hover-color, var(--accentColor));
}
.uxpcore_breadcrumb__item--active {
  color: var(--breadcrumb-active-color, var(--breadcrumb-text-color, var(--primaryTextColor)));
  font-weight: var(--fontWeightMedium);
  cursor: default;
  opacity: 0.5;
}
.uxpcore_breadcrumb__item-content {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.uxpcore_breadcrumb__item-icon {
  width: 1rem;
  height: 1rem;
  flex-shrink: 0;
}
.uxpcore_breadcrumb__item-label {
  line-height: 1.5;
}
.uxpcore_breadcrumb__separator {
  color: var(--breadcrumb-separator-color, var(--secondaryTextColor));
  user-select: none;
  font-size: 0.7rem;
  opacity: 0.5;
}
.uxpcore_breadcrumb__ellipsis {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  padding: 0;
  background: none;
  border: none;
  border-radius: 0.375rem;
  color: var(--breadcrumb-text-color, var(--primaryTextColor));
  cursor: pointer;
  transition: all 0.2s;
}
.uxpcore_breadcrumb__ellipsis:hover {
  background-color: var(--breadcrumb-bg-color, var(--primaryBGColor));
  color: var(--breadcrumb-hover-color, var(--accentColor));
}
.uxpcore_breadcrumb__ellipsis:focus-visible {
  outline: 2px solid var(--accentColor);
  outline-offset: 2px;
}
.uxpcore_breadcrumb__ellipsis:active {
  transform: scale(0.95);
}
.uxpcore_breadcrumb__ellipsis svg {
  width: 1rem;
  height: 1rem;
}
.uxpcore_breadcrumb__dropdown {
  min-width: 12rem;
  max-width: 20rem;
  background: var(--breadcrumb-bg-color, var(--primaryBGColor));
  color: var(--breadcrumb-text-color, var(--primaryTextColor));
  border-radius: 0.5rem;
  max-height: 20rem;
  overflow-y: auto;
}
.uxpcore_breadcrumb__dropdown-item {
  margin-bottom: 0.25rem;
}
.uxpcore_breadcrumb__dropdown-item:last-child {
  margin-bottom: 0;
}
.uxpcore_breadcrumb__dropdown-item .uxpcore_breadcrumb__item {
  width: 100%;
  padding: 0.5rem 0.75rem;
  border-radius: 0.375rem;
}
.uxpcore_breadcrumb__dropdown-item .uxpcore_breadcrumb__item--link:hover, .uxpcore_breadcrumb__dropdown-item .uxpcore_breadcrumb__item--button:hover {
  background-color: var(--secondaryBGColor);
  color: var(--breadcrumb-hover-color, var(--accentColor));
}
.uxpcore_breadcrumb__dropdown-item .uxpcore_breadcrumb__item--link:focus-visible, .uxpcore_breadcrumb__dropdown-item .uxpcore_breadcrumb__item--button:focus-visible {
  outline: 2px solid var(--accentColor);
  outline-offset: -2px;
}
.uxpcore_breadcrumb__dropdown-item .uxpcore_breadcrumb__item--link:active, .uxpcore_breadcrumb__dropdown-item .uxpcore_breadcrumb__item--button:active {
  opacity: 0.8;
}

[dir=rtl] .uxpcore_breadcrumb__list {
  flex-direction: row-reverse;
}
[dir=rtl] .uxpcore_breadcrumb__item, [dir=rtl] .uxpcore_breadcrumb__item-content {
  flex-direction: row-reverse;
}

.uxpcore_profileimage__container {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  flex-shrink: 0;
  aspect-ratio: 1;
}
.uxpcore_profileimage__container.small {
  width: 2rem;
  height: 2rem;
}
.uxpcore_profileimage__container.medium {
  width: 3rem;
  height: 3rem;
}
.uxpcore_profileimage__container.large {
  width: 4rem;
  height: 4rem;
}
.uxpcore_profileimage__container.circle {
  border-radius: 50%;
}
.uxpcore_profileimage__container.square {
  border-radius: 0.5rem;
}
.uxpcore_profileimage__image {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.uxpcore_profileimage__image .uxpcore_icon {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.uxpcore_profileimage__image .uxpcore_icon.uxpcore_icon--image .uxpcore_icon__img {
  background-size: cover;
  background-position: center;
}
.uxpcore_profileimage__image .uxpcore_icon.uxpcore_icon--fontawesome svg, .uxpcore_profileimage__image .uxpcore_icon.uxpcore_icon--phosphor svg {
  width: 1em;
  height: 1em;
}
.uxpcore_profileimage__initials {
  font-weight: var(--fontWeightBold);
  text-align: center;
  line-height: 1;
  user-select: none;
}

.uxpcore_collapse__container {
  width: 100%;
  height: auto;
}
.uxpcore_collapse__header {
  width: 100%;
  height: auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
  padding: 0.5rem;
  border-bottom: 1px solid var(--borderColor);
  user-select: none;
  background-color: var(--primaryBGColor);
  color: var(--primaryTextColor);
}
.uxpcore_collapse__header-left {
  display: flex;
  align-items: center;
  color: inherit;
}
.uxpcore_collapse__header-right {
  display: flex;
  align-items: center;
  color: inherit;
}
.uxpcore_collapse__icon {
  width: 1rem;
  height: 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-inline-end: 0.5rem;
  transition: transform 200ms ease-in-out;
  flex-shrink: 0;
  color: var(--secondaryTextColor);
}
.uxpcore_collapse__icon svg {
  width: 0.7rem;
  height: 0.7rem;
}
.uxpcore_collapse__icon--expanded {
  transform: rotate(-180deg);
}
.uxpcore_collapse__title {
  font-size: 0.875rem;
  font-weight: var(--fontWeightSemibold);
  color: var(--primaryTextColor);
  letter-spacing: 0.05em;
}
.uxpcore_collapse__content {
  padding: 0.5rem;
  border-bottom: 1px solid var(--borderColor);
}

.uxpcore_chip {
  display: inline-flex;
  align-items: center;
  padding: 0.5rem;
  background-color: var(--secondaryBGColor);
  color: var(--secondaryTextColor);
  border-radius: 5rem;
  transition: all 200ms ease-in-out;
  user-select: none;
  max-width: 100%;
  font-size: 0.9rem;
  border: 1px solid transparent;
  margin: 0.1rem;
}
.uxpcore_chip__icon {
  width: 1.2rem;
  height: 1.2rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.uxpcore_chip__icon svg {
  width: 70% !important;
  height: 70%;
}
.uxpcore_chip--clickable {
  cursor: pointer;
}
.uxpcore_chip--clickable:hover {
  background-color: var(--primaryBGColor);
  color: var(--primaryTextColor);
}
.uxpcore_chip--icon-left .uxpcore_chip__icon {
  margin-right: 6px;
}
.uxpcore_chip--icon-right .uxpcore_chip__icon {
  margin-left: 6px;
}
.uxpcore_chip__label {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
  padding-inline-end: 0.5rem;
}
.uxpcore_chip--no-icon .uxpcore_chip__label {
  padding-inline-start: 0.5rem;
}
.uxpcore_chip--no-icon.uxpcore_chip--small .uxpcore_chip__label {
  padding-inline-start: 0.3rem;
}
.uxpcore_chip--icon-only {
  padding: 0.4rem;
  aspect-ratio: 1;
  justify-content: center;
}
.uxpcore_chip--icon-only .uxpcore_chip__icon {
  margin: 0;
}
.uxpcore_chip--icon-only.uxpcore_chip--small {
  padding: 0.25rem;
}
.uxpcore_chip--icon-only.uxpcore_chip--small .uxpcore_chip__icon {
  width: 1rem;
  height: 1rem;
}
.uxpcore_chip--icon-only.uxpcore_chip--large {
  padding: 0.6rem;
}
.uxpcore_chip--primary {
  background-color: var(--onGoingStatusBGColor);
  color: var(--onGoingStatusTextColor);
  border-color: var(--onGoingStatusBorderColor);
}
.uxpcore_chip--primary.uxpcore_chip--clickable:hover {
  background-color: var(--primaryButtonHoverBGColor);
  color: var(--primaryButtonHoverTextColor);
  border-color: var(--primaryButtonHoverBorderColor);
}
.uxpcore_chip--secondary {
  background-color: var(--inactiveStatusBGColor);
  color: var(--inactiveStatusTextColor);
  border-color: var(--inactiveStatusBorderColor);
}
.uxpcore_chip--secondary.uxpcore_chip--clickable:hover {
  background-color: var(--secondaryButtonHoverBGColor);
  color: var(--secondaryButtonHoverTextColor);
  border-color: var(--secondaryButtonHoverBorderColor);
}
.uxpcore_chip--danger {
  background-color: var(--rejectedStatusBGColor);
  color: var(--rejectedStatusTextColor);
  border-color: var(--rejectedStatusBorderColor);
}
.uxpcore_chip--danger.uxpcore_chip--clickable:hover {
  background-color: var(--dangerButtonHoverBGColor);
  color: var(--dangerButtonHoverTextColor);
  border-color: var(--dangerButtonHoverBorderColor);
}
.uxpcore_chip--warning {
  background-color: var(--warningStatusBGColor);
  color: var(--warningStatusTextColor);
  border-color: var(--warningStatusBorderColor);
}
.uxpcore_chip--warning.uxpcore_chip--clickable:hover {
  background-color: var(--warningButtonHoverBGColor);
  color: var(--warningButtonHoverTextColor);
  border-color: var(--warningButtonHoverBorderColor);
}
.uxpcore_chip--success {
  background-color: var(--activeStatusBGColor);
  color: var(--activeStatusTextColor);
  border-color: var(--activeStatusBorderColor);
}
.uxpcore_chip--success.uxpcore_chip--clickable:hover {
  background-color: var(--successButtonHoverBGColor);
  color: var(--successButtonHoverTextColor);
  border-color: var(--successButtonHoverBorderColor);
}
.uxpcore_chip--info {
  background-color: var(--infoButtonBGColor);
  color: var(--infoButtonTextColor);
  border-color: var(--infoButtonBorderColor);
}
.uxpcore_chip--info.uxpcore_chip--clickable:hover {
  background-color: var(--infoButtonHoverBGColor);
  color: var(--infoButtonHoverTextColor);
  border-color: var(--infoButtonHoverBorderColor);
}
.uxpcore_chip--small {
  padding: 0.1rem 0.2rem;
  font-size: 0.8rem;
}
.uxpcore_chip--small .uxpcore_chip__icon {
  width: 1rem;
  height: 1rem;
}
.uxpcore_chip--small .uxpcore_chip__label {
  padding-inline-end: 0.3rem;
}
.uxpcore_chip--small.uxpcore_chip--icon-left .uxpcore_chip__icon {
  margin-right: 4px;
}
.uxpcore_chip--small.uxpcore_chip--icon-right .uxpcore_chip__icon {
  margin-left: 4px;
}
.uxpcore_chip--large {
  padding: 0.7rem 1rem;
  font-size: 1rem;
}
.uxpcore_chip--large .uxpcore_chip__icon {
  width: 1.4rem;
  height: 1.4rem;
}
.uxpcore_chip--large .uxpcore_chip__label {
  padding-inline-end: 0.7rem;
}
.uxpcore_chip--large.uxpcore_chip--icon-left .uxpcore_chip__icon {
  margin-right: 8px;
}
.uxpcore_chip--large.uxpcore_chip--icon-right .uxpcore_chip__icon {
  margin-left: 8px;
}

.uxpcore_dropdown_indicator__container {
  width: 1rem;
  height: 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 200ms ease-in-out;
}
.uxpcore_dropdown_indicator__container svg {
  width: 70%;
  height: 70%;
}
.uxpcore_dropdown_indicator__container--open {
  transform: rotate(-180deg);
}

.uxpcore_badge__container {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  vertical-align: middle;
  flex-shrink: 0;
  padding: 0;
  margin: 0;
  color: var(--primaryTextColor);
}
.uxpcore_badge__badge {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 1.6rem;
  height: 1.6rem;
  border-radius: 1.6rem;
  font-size: 0.85rem;
  line-height: 1;
  background-color: var(--badgeBGColor);
  color: var(--badgeTextColor);
  z-index: 1;
  transition: all 200ms ease-in-out;
  padding: 0.16rem 0.5rem;
}
.uxpcore_badge__badge--indicator-only {
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
  padding: 0;
}
.uxpcore_badge__badge--left {
  position: relative;
  order: -1;
  margin-right: 0.5rem;
}
.uxpcore_badge__badge--right {
  position: relative;
  order: 1;
  margin-left: 0.5rem;
}
.uxpcore_badge__badge--top-left {
  position: absolute;
  top: 0;
  left: 0;
  translate: -60% -60%;
}
.uxpcore_badge__badge--top-right {
  position: absolute;
  top: 0;
  right: 0;
  translate: 60% -60%;
}
.uxpcore_badge__badge--bottom-left {
  position: absolute;
  bottom: 0;
  left: 0;
  translate: -60% 60%;
}
.uxpcore_badge__badge--bottom-right {
  position: absolute;
  bottom: 0;
  right: 0;
  translate: 60% 60%;
}

.uxpcore_analytics_card {
  width: auto;
  padding: 0.5rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.uxpcore_analytics_card--small {
  margin-inline-end: 1rem;
}
.uxpcore_analytics_card--small * {
  color: var(--portalHeaderTextColor);
}
.uxpcore_analytics_card--small .uxpcore_analytics_card__top .uxpcore_analytics_card__icon {
  width: 1.2rem;
  height: 1.2rem;
  margin-inline-end: 0.2rem;
}
.uxpcore_analytics_card--small .uxpcore_analytics_card__top .uxpcore_analytics_card__value {
  font-size: 1.2rem;
}
.uxpcore_analytics_card--small .uxpcore_analytics_card__label {
  font-size: 0.8rem;
}
.uxpcore_analytics_card__top {
  width: auto;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  margin-bottom: 0.4rem;
}
.uxpcore_analytics_card__bottom {
  width: auto;
  height: auto;
}
.uxpcore_analytics_card__icon {
  width: 2rem;
  height: 2rem;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  margin-inline-end: 1rem;
  color: var(--secondaryTextColor);
}
.uxpcore_analytics_card__icon svg {
  width: 80% !important;
  height: 80%;
}
.uxpcore_analytics_card__value {
  font-size: 1.5rem;
  font-weight: var(--fontWeightSemibold);
  color: var(--primaryTextColor);
  line-height: 1.2;
}
.uxpcore_analytics_card__value--novalue {
  opacity: 0.6;
}
.uxpcore_analytics_card__label {
  font-size: 0.875rem;
  color: var(--secondaryTextColor);
}

.uxpcore_widgetwrapper {
  position: relative;
  width: 100%;
  height: 100%;
  background-color: var(--primaryBGColor);
  border-radius: 0.833rem;
  overflow: visible;
  display: flex;
  flex-direction: column;
  border: 1px solid var(--borderColor);
}

body.uxp-glass-theme .uxpcore_widgetwrapper {
  background: var(--secondaryBGColor);
  backdrop-filter: blur(150px);
  -webkit-backdrop-filter: blur(150px);
  border: 1px solid var(--borderColor);
}

.uxpcore_dashboard__container.uxp-glass-theme .uxpcore_widgetwrapper {
  background: var(--secondaryBGColor);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid var(--borderColor);
}

.uxpcore_titlebar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.5rem;
  flex-grow: 0;
  flex-shrink: 0;
  background-color: var(--primaryBGColor);
  color: var(--primaryTextColor);
}
.uxpcore_titlebar--draggable {
  cursor: move;
}
.uxpcore_titlebar__title-section {
  display: flex;
  align-items: center;
  font-size: 1rem;
  text-transform: uppercase;
  font-weight: var(--fontWeightBold);
  gap: 1rem;
}
.uxpcore_titlebar__icon {
  width: 2rem;
  height: 2rem;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  display: none;
}
.uxpcore_titlebar__icon--visible {
  display: inline-block;
}
.uxpcore_titlebar__action-section {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.uxpcore_slide_panel__wrapper {
  border-radius: inherit;
  position: fixed;
  border-start-start-radius: 3rem;
  z-index: 999;
}
.uxpcore_slide_panel__wrapper--default {
  top: 5rem;
  bottom: 0;
  right: 0;
  left: 8rem;
  transition: left 200ms ease-in-out;
}
html[data-uxp-sidebar=expanded] .uxpcore_slide_panel__wrapper--default {
  left: 8rem;
}
html[data-uxp-sidebar=collapsed] .uxpcore_slide_panel__wrapper--default {
  left: 0;
}
.uxpcore_slide_panel__wrapper--positioned {
  overflow: hidden;
}
.uxpcore_slide_panel__wrapper--modal {
  position: relative;
  border-radius: 0.8rem;
  max-width: 90%;
  max-height: 90%;
  width: auto;
  height: auto;
  overflow: hidden;
}
.uxpcore_slide_panel__content {
  width: 100%;
  height: 100%;
  border-radius: inherit;
  overflow: hidden;
  background: var(--secondaryBGColor);
  backdrop-filter: blur(150px);
  -webkit-backdrop-filter: blur(150px);
  border: 1px solid var(--borderColor);
}
.uxpcore_slide_panel__animation_modal-enter .uxpcore_slide_panel__content {
  opacity: 0;
  transform: scale(0.95);
}
.uxpcore_slide_panel__animation_modal-enter-active .uxpcore_slide_panel__content {
  opacity: 1;
  transform: scale(1);
  transition: opacity 250ms ease, transform 250ms cubic-bezier(0.19, 1, 0.22, 1);
}
.uxpcore_slide_panel__animation_modal-enter-done .uxpcore_slide_panel__content {
  opacity: 1;
  transform: scale(1);
}
.uxpcore_slide_panel__animation_modal-exit .uxpcore_slide_panel__content {
  opacity: 1;
  transform: scale(1);
}
.uxpcore_slide_panel__animation_modal-exit-active .uxpcore_slide_panel__content {
  opacity: 0;
  transform: scale(0.95);
  transition: opacity 200ms ease, transform 200ms cubic-bezier(0.19, 1, 0.22, 1);
}
.uxpcore_slide_panel__animation_modal-exit-done .uxpcore_slide_panel__content {
  opacity: 0;
}
.uxpcore_slide_panel__animation_left-enter .uxpcore_slide_panel__content {
  opacity: 0;
  transform: translateX(-75%);
  transform-origin: right;
}
.uxpcore_slide_panel__animation_left-enter-active .uxpcore_slide_panel__content {
  opacity: 1;
  transform: translateX(0);
  transition: all 300ms cubic-bezier(0.19, 1, 0.22, 1);
}
.uxpcore_slide_panel__animation_left-enter-done .uxpcore_slide_panel__content {
  opacity: 1;
  transform: translateX(0);
}
.uxpcore_slide_panel__animation_left-exit .uxpcore_slide_panel__content {
  opacity: 1;
  transform: translateX(0);
  transform-origin: right;
}
.uxpcore_slide_panel__animation_left-exit-active .uxpcore_slide_panel__content {
  opacity: 1;
  transform: translateX(-100%);
  transition: all 300ms cubic-bezier(0.19, 1, 0.22, 1);
}
.uxpcore_slide_panel__animation_left-exit-done .uxpcore_slide_panel__content {
  opacity: 0;
  transform: translateX(-75%);
}
.uxpcore_slide_panel__animation_right-enter .uxpcore_slide_panel__content {
  opacity: 0;
  transform: translateX(75%);
  transform-origin: left;
}
.uxpcore_slide_panel__animation_right-enter-active .uxpcore_slide_panel__content {
  opacity: 1;
  transform: translateX(0);
  transition: all 300ms cubic-bezier(0.19, 1, 0.22, 1);
}
.uxpcore_slide_panel__animation_right-enter-done .uxpcore_slide_panel__content {
  opacity: 1;
  transform: translateX(0);
}
.uxpcore_slide_panel__animation_right-exit .uxpcore_slide_panel__content {
  opacity: 1;
  transform: translateX(0);
  transform-origin: left;
}
.uxpcore_slide_panel__animation_right-exit-active .uxpcore_slide_panel__content {
  opacity: 1;
  transform: translateX(100%);
  transition: all 300ms cubic-bezier(0.19, 1, 0.22, 1);
}
.uxpcore_slide_panel__animation_right-exit-done .uxpcore_slide_panel__content {
  opacity: 0;
  transform: translateX(75%);
}
.uxpcore_slide_panel__animation_top-enter .uxpcore_slide_panel__content {
  opacity: 0;
  transform: translateY(-75%);
  transform-origin: bottom;
}
.uxpcore_slide_panel__animation_top-enter-active .uxpcore_slide_panel__content {
  opacity: 1;
  transform: translateY(0);
  transition: all 300ms cubic-bezier(0.19, 1, 0.22, 1);
}
.uxpcore_slide_panel__animation_top-enter-done .uxpcore_slide_panel__content {
  opacity: 1;
  transform: translateY(0);
}
.uxpcore_slide_panel__animation_top-exit .uxpcore_slide_panel__content {
  opacity: 1;
  transform: translateY(0);
  transform-origin: bottom;
}
.uxpcore_slide_panel__animation_top-exit-active .uxpcore_slide_panel__content {
  opacity: 1;
  transform: translateY(-100%);
  transition: all 300ms cubic-bezier(0.19, 1, 0.22, 1);
}
.uxpcore_slide_panel__animation_top-exit-done .uxpcore_slide_panel__content {
  opacity: 0;
  transform: translateY(-75%);
}
.uxpcore_slide_panel__animation_bottom-enter .uxpcore_slide_panel__content {
  opacity: 0;
  transform: translateY(75%);
  transform-origin: top;
}
.uxpcore_slide_panel__animation_bottom-enter-active .uxpcore_slide_panel__content {
  opacity: 1;
  transform: translateY(0);
  transition: all 300ms cubic-bezier(0.19, 1, 0.22, 1);
}
.uxpcore_slide_panel__animation_bottom-enter-done .uxpcore_slide_panel__content {
  opacity: 1;
  transform: translateY(0);
}
.uxpcore_slide_panel__animation_bottom-exit .uxpcore_slide_panel__content {
  opacity: 1;
  transform: translateY(0);
  transform-origin: top;
}
.uxpcore_slide_panel__animation_bottom-exit-active .uxpcore_slide_panel__content {
  opacity: 1;
  transform: translateY(100%);
  transition: all 300ms cubic-bezier(0.19, 1, 0.22, 1);
}
.uxpcore_slide_panel__animation_bottom-exit-done .uxpcore_slide_panel__content {
  opacity: 0;
  transform: translateY(75%);
}

.uxpcore_slide_panel__backdrop {
  pointer-events: none;
}
.uxpcore_slide_panel__backdrop .uxpcore_slide_panel__wrapper {
  pointer-events: auto;
}
.uxpcore_slide_panel__backdrop--modal {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: rgba(0, 0, 0, 0.2) !important;
  pointer-events: auto;
}
.uxpcore_slide_panel__backdrop--modal .uxpcore_slide_panel__wrapper--modal {
  pointer-events: auto;
}

.uxpcore_sampledata {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 6rem;
  height: 6rem;
  overflow: hidden;
  pointer-events: none;
  border-bottom-right-radius: inherit;
}
.uxpcore_sampledata__ribbon {
  position: absolute;
  bottom: 1.1rem;
  right: -1.8rem;
  width: 8rem;
  text-align: center;
  background-color: var(--infoButtonBGColor);
  color: var(--infoButtonTextColor);
  font-size: 0.65rem;
  font-weight: var(--fontWeightBold);
  text-transform: uppercase;
  padding: 0.25rem 0;
  transform: rotate(-45deg);
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
}

.uxpcore_helppopover__content {
  max-width: 28rem;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  font-size: 0.875rem;
  line-height: 1.5;
}
.uxpcore_helppopover__section {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
.uxpcore_helppopover__heading {
  font-weight: var(--fontWeightBold);
  color: var(--primaryTextColor);
}
.uxpcore_helppopover__body {
  color: var(--secondaryTextColor);
}

.uxpcore_loader {
  width: 100%;
  height: 100%;
  background-color: var(--primaryBGColor);
  position: relative;
}
.uxpcore_loader--default {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  flex-direction: column;
  overflow: hidden;
  padding: 20px;
}
@keyframes flicker {
  0% {
    background-color: var(--loaderPrimaryColor);
  }
  50% {
    background-color: var(--loaderSecondaryColor);
  }
  100% {
    background-color: var(--loaderPrimaryColor);
  }
}
.uxpcore_loader--default .uxpcore_loader__header {
  width: 100%;
  height: 10%;
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  background-color: transparent;
}
.uxpcore_loader--default .uxpcore_loader__header .uxpcore_loader__icon {
  width: 35px;
  height: 23px;
  border-radius: 10px;
  background-color: var(--loaderPrimaryColor);
}
.uxpcore_loader--default .uxpcore_loader__header .uxpcore_loader__text {
  position: relative;
  width: 55px;
  height: 10px;
  border-radius: 50px;
  background-color: var(--loaderPrimaryColor);
  animation: flicker 1s infinite;
  margin: auto 10px;
}
.uxpcore_loader--default .uxpcore_loader__header .uxpcore_loader__text:after {
  content: "";
  width: 40px;
  height: 10px;
  border-radius: 50px;
  background-color: var(--loaderPrimaryColor);
  animation: flicker 1s infinite;
  position: absolute;
  top: 0;
  transform: translateX(10px);
  left: 100%;
}
.uxpcore_loader--default .uxpcore_loader__content {
  width: 100%;
  height: 90%;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background-color: transparent;
}
.uxpcore_loader--default .uxpcore_loader__content * {
  box-sizing: border-box;
}
.uxpcore_loader--default .uxpcore_loader__content .uxpcore_loader__para {
  padding: 20px 10px;
  border-radius: 10px;
  background-color: var(--loaderBackgroundColor);
  margin: 5px 0;
}
.uxpcore_loader--default .uxpcore_loader__content .uxpcore_loader__para:nth-child(1) {
  margin-top: 10px;
}
.uxpcore_loader--default .uxpcore_loader__content .uxpcore_loader__para .uxpcore_loader__text {
  position: relative;
  width: 100%;
  height: 10px;
}
.uxpcore_loader--default .uxpcore_loader__content .uxpcore_loader__para .uxpcore_loader__text:nth-child(1) {
  margin-bottom: 10px;
}
.uxpcore_loader--default .uxpcore_loader__content .uxpcore_loader__para .uxpcore_loader__text:nth-child(1):before {
  content: "";
  width: 65%;
  position: absolute;
  top: 0;
  left: 0;
  height: 10px;
  border-radius: 50px;
  background-color: var(--loaderPrimaryColor);
  animation: flicker 1s infinite;
}
.uxpcore_loader--default .uxpcore_loader__content .uxpcore_loader__para .uxpcore_loader__text:nth-child(1):after {
  content: "";
  width: 30%;
  position: absolute;
  top: 0;
  right: 0;
  height: 10px;
  border-radius: 50px;
  background-color: var(--loaderPrimaryColor);
  animation: flicker 1s infinite;
}
.uxpcore_loader--default .uxpcore_loader__content .uxpcore_loader__para .uxpcore_loader__text:nth-child(2):before {
  content: "";
  width: 20%;
  position: absolute;
  top: 0;
  left: 0;
  height: 10px;
  border-radius: 50px;
  background-color: var(--loaderPrimaryColor);
  animation: flicker 1s infinite;
}
.uxpcore_loader--default .uxpcore_loader__content .uxpcore_loader__para .uxpcore_loader__text:nth-child(2):after {
  content: "";
  width: 20%;
  position: absolute;
  top: 0;
  right: 0;
  height: 10px;
  border-radius: 50px;
  background-color: var(--loaderPrimaryColor);
  animation: flicker 1s infinite;
}
.uxpcore_loader--barchart {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  padding: 20px;
}
@keyframes rising-bar {
  0% {
    height: 0%;
    background-color: var(--loaderSecondaryColor);
  }
  50% {
    height: 90%;
    background-color: var(--loaderPrimaryColor);
  }
  100% {
    background-color: var(--loaderSecondaryColor);
  }
}
.uxpcore_loader--barchart .uxpcore_loader__chart-area {
  width: 90%;
  height: 90%;
  border-left: 4px solid var(--loaderSecondaryColor);
  border-bottom: 4px solid var(--loaderSecondaryColor);
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
}
.uxpcore_loader--barchart .uxpcore_loader__chart-area .uxpcore_loader__bar {
  width: 60px;
  margin: 0 8px;
  height: 0%;
  background-color: var(--loaderPrimaryColor);
  animation: rising-bar 3s infinite;
}
.uxpcore_loader--barchart .uxpcore_loader__chart-area .uxpcore_loader__bar:nth-child(1) {
  -webkit-animation-delay: 0.0833333333s;
  animation-delay: 0.0833333333s;
}
.uxpcore_loader--barchart .uxpcore_loader__chart-area .uxpcore_loader__bar:nth-child(2) {
  -webkit-animation-delay: 0.1666666667s;
  animation-delay: 0.1666666667s;
}
.uxpcore_loader--barchart .uxpcore_loader__chart-area .uxpcore_loader__bar:nth-child(3) {
  -webkit-animation-delay: 0.25s;
  animation-delay: 0.25s;
}
.uxpcore_loader--barchart .uxpcore_loader__chart-area .uxpcore_loader__bar:nth-child(4) {
  -webkit-animation-delay: 0.3333333333s;
  animation-delay: 0.3333333333s;
}
.uxpcore_loader--barchart .uxpcore_loader__chart-area .uxpcore_loader__bar:nth-child(5) {
  -webkit-animation-delay: 0.4166666667s;
  animation-delay: 0.4166666667s;
}
.uxpcore_loader--barchart .uxpcore_loader__chart-area .uxpcore_loader__bar:nth-child(6) {
  -webkit-animation-delay: 0.5s;
  animation-delay: 0.5s;
}
.uxpcore_loader--barchart .uxpcore_loader__chart-area .uxpcore_loader__bar:nth-child(7) {
  -webkit-animation-delay: 0.5833333333s;
  animation-delay: 0.5833333333s;
}
.uxpcore_loader--barchart .uxpcore_loader__chart-area .uxpcore_loader__bar:nth-child(8) {
  -webkit-animation-delay: 0.6666666667s;
  animation-delay: 0.6666666667s;
}
.uxpcore_loader--barchart .uxpcore_loader__chart-area .uxpcore_loader__bar:nth-child(9) {
  -webkit-animation-delay: 0.75s;
  animation-delay: 0.75s;
}
.uxpcore_loader--barchart .uxpcore_loader__chart-area .uxpcore_loader__bar:nth-child(10) {
  -webkit-animation-delay: 0.8333333333s;
  animation-delay: 0.8333333333s;
}
.uxpcore_loader--barchart .uxpcore_loader__chart-area .uxpcore_loader__bar:nth-child(11) {
  -webkit-animation-delay: 0.9166666667s;
  animation-delay: 0.9166666667s;
}
.uxpcore_loader--barchart .uxpcore_loader__chart-area .uxpcore_loader__bar:nth-child(12) {
  -webkit-animation-delay: 1s;
  animation-delay: 1s;
}
.uxpcore_loader--donut {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  padding: 20px;
}
@keyframes color-change {
  0% {
    transform: rotate(0deg);
  }
  50% {
    background: conic-gradient(var(--loaderPrimaryColor) 0deg, var(--loaderPrimaryColor) 55%, var(--loaderSecondaryColor) 0deg, var(--loaderSecondaryColor) 65%, var(--loaderPrimaryColor) 0deg, var(--loaderPrimaryColor) 75%, var(--loaderSecondaryColor) 0deg, var(--loaderSecondaryColor) 78%, var(--loaderPrimaryColor) 0deg, var(--loaderPrimaryColor) 80%, var(--loaderSecondaryColor) 0deg, var(--loaderSecondaryColor) 99%);
    transform: rotate(110deg);
  }
  100% {
    background: conic-gradient(var(--loaderPrimaryColor) 0deg, var(--loaderPrimaryColor) 5%, var(--loaderSecondaryColor) 0deg, var(--loaderSecondaryColor) 25%, var(--loaderPrimaryColor) 0deg, var(--loaderPrimaryColor) 55%, var(--loaderSecondaryColor) 0deg, var(--loaderSecondaryColor) 60%, var(--loaderPrimaryColor) 0deg, var(--loaderPrimaryColor) 72%, var(--loaderSecondaryColor) 0deg, var(--loaderSecondaryColor) 79%);
    transform: rotate(361deg);
  }
}
.uxpcore_loader--donut .uxpcore_loader__chart-area {
  width: var(--preloaderDonutSize);
  height: var(--preloaderDonutSize);
  background-color: var(--loaderBackgroundColor);
  border-radius: 1000px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.uxpcore_loader--donut .uxpcore_loader__chart-area::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 70%;
  height: 70%;
  background-color: var(--primaryBGColor);
  border-radius: 1000px;
  z-index: 2;
}
.uxpcore_loader--donut .uxpcore_loader__chart-area::after {
  content: "";
  position: absolute;
  top: 0%;
  left: 0%;
  width: 100%;
  height: 100%;
  border-radius: 1000px;
  z-index: 1;
  transform-origin: center;
  animation: color-change 6s infinite;
  background: conic-gradient(var(--loaderPrimaryColor) 0deg, var(--loaderPrimaryColor) 15%, var(--loaderSecondaryColor) 0deg, var(--loaderSecondaryColor) 35%, var(--loaderPrimaryColor) 0deg, var(--loaderPrimaryColor) 45%, var(--loaderSecondaryColor) 0deg, var(--loaderSecondaryColor) 65%, var(--loaderPrimaryColor) 0deg, var(--loaderPrimaryColor) 80%, var(--loaderSecondaryColor) 0deg, var(--loaderSecondaryColor) 92%);
  transition: transform 500ms cubic-bezier(1, 1.01, 0.44, 1.32);
}
.uxpcore_loader--gauge {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  padding: 20px;
}
.uxpcore_loader--gauge .uxpcore_loader__gauge-container {
  position: relative;
  width: var(--preloaderGaugeSize);
  height: calc(var(--preloaderGaugeSize) * 0.75);
  display: flex;
  align-items: center;
  justify-content: center;
}
.uxpcore_loader--gauge .uxpcore_loader__gauge-arc-svg {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  animation: gaugeArcPulse 3s ease-in-out infinite;
}
.uxpcore_loader--gauge .uxpcore_loader__gauge-arc-svg path {
  filter: drop-shadow(0 0 2px rgba(0, 0, 0, 0.1));
}
.uxpcore_loader--gauge .uxpcore_loader__gauge-ticks {
  position: absolute;
  width: var(--preloaderGaugeSize);
  height: var(--preloaderGaugeSize);
  top: 0;
  left: 0;
  z-index: 2;
}
.uxpcore_loader--gauge .uxpcore_loader__gauge-tick {
  position: absolute;
  background-color: var(--primaryBGColor);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0.2);
}
.uxpcore_loader--gauge .uxpcore_loader__gauge-numbers {
  position: absolute;
  width: var(--preloaderGaugeSize);
  height: var(--preloaderGaugeSize);
  top: 0;
  left: 0;
  z-index: 3;
}
.uxpcore_loader--gauge .uxpcore_loader__gauge-number {
  position: absolute;
  color: var(--secondaryTextColor);
  font-weight: var(--fontWeightMedium);
  opacity: 0.8;
}
.uxpcore_loader--gauge .uxpcore_loader__gauge-needle {
  position: absolute;
  width: var(--preloaderGaugeNeedleWidth);
  height: var(--preloaderGaugeNeedleHeight);
  top: calc(50% - var(--preloaderGaugeNeedleHeight));
  left: calc(50% - var(--preloaderGaugeNeedleWidth) / 2);
  transform-origin: bottom center;
  transform: rotate(var(--preloaderGaugeNeedleRotation));
  transition: transform 1.5s cubic-bezier(0.4, 0, 0.2, 1);
  z-index: 10;
}
.uxpcore_loader--gauge .uxpcore_loader__gauge-needle::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--secondaryTextColor);
  clip-path: polygon(40% 0%, 60% 0%, 100% 100%, 0% 100%);
}
.uxpcore_loader--gauge .uxpcore_loader__gauge-needle-circle {
  position: absolute;
  width: var(--preloaderGaugeNeedleWidth);
  height: var(--preloaderGaugeNeedleWidth);
  border-radius: 50%;
  background-color: var(--secondaryTextColor);
  bottom: 0;
  left: 50%;
  transform: translate(-50%, 50%);
  z-index: 11;
}
.uxpcore_loader--gauge .uxpcore_loader__gauge-needle-circle::before {
  content: "";
  width: 50%;
  height: 50%;
  border-radius: 50%;
  background-color: var(--primaryBGColor);
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translate(-50%, -50%);
}
@keyframes gaugeArcPulse {
  0%, 100% {
    opacity: 0.6;
  }
  50% {
    opacity: 1;
  }
}
.uxpcore_loader--heatmap {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  padding: 20px;
}
.uxpcore_loader--heatmap .uxpcore_loader__chart-area {
  width: 90%;
  height: 90%;
  position: relative;
  padding: 40px 0 0 80px;
}
.uxpcore_loader--heatmap .uxpcore_loader__chart-area .uxpcore_loader__top-legend {
  position: absolute;
  top: 0;
  left: 90px;
  right: 0;
  height: 30px;
  border-radius: 10px;
  background-color: var(--loaderSecondaryColor);
  display: flex;
  align-items: center;
  justify-content: space-around;
}
.uxpcore_loader--heatmap .uxpcore_loader__chart-area .uxpcore_loader__top-legend .uxpcore_loader__legend-cols {
  width: 30px;
  height: 10px;
  border-radius: 6px;
  background-color: var(--loaderBackgroundColor);
}
.uxpcore_loader--heatmap .uxpcore_loader__chart-area .uxpcore_loader__left-legend {
  position: absolute;
  top: 40px;
  left: 0px;
  bottom: 0;
  width: 70px;
  border-radius: 10px;
  background-color: var(--loaderSecondaryColor);
  display: flex;
  align-items: center;
  justify-content: space-around;
  flex-direction: column;
}
.uxpcore_loader--heatmap .uxpcore_loader__chart-area .uxpcore_loader__left-legend .uxpcore_loader__legend-rows {
  width: 50px;
  height: 10px;
  border-radius: 6px;
  background-color: var(--loaderBackgroundColor);
}
.uxpcore_loader--heatmap .uxpcore_loader__chart-area .uxpcore_loader__cells {
  width: var(--preloaderHeatmapChartCellsWidth);
  height: var(--preloaderHeatmapChartCellsHeight);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  overflow: hidden;
}
.uxpcore_loader--heatmap .uxpcore_loader__chart-area .uxpcore_loader__cells .uxpcore_loader__cell {
  width: 40px;
  height: 40px;
  background-color: var(--preloaderHeatmapChartCellBG);
}
.uxpcore_loader--maptile {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background-color: var(--loaderBackgroundColor);
  padding: 20px;
}
.uxpcore_loader--maptile .uxpcore_loader__map-container {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.uxpcore_loader--maptile .uxpcore_loader__map-tile {
  position: absolute;
  background-color: var(--loaderPrimaryColor);
  animation: mapTilePulse 2s ease-in-out infinite;
}
.uxpcore_loader--maptile .uxpcore_loader__map-road {
  position: absolute;
  background-color: var(--loaderSecondaryColor);
  z-index: 2;
  animation: mapRoadShimmer 3s ease-in-out infinite;
}
.uxpcore_loader--maptile .uxpcore_loader__map-road.horizontal {
  width: 100%;
  height: 8px;
}
.uxpcore_loader--maptile .uxpcore_loader__map-road.vertical {
  width: 8px;
  height: 100%;
}
.uxpcore_loader--maptile .uxpcore_loader__map-building {
  position: absolute;
  background-color: var(--loaderSecondaryColor);
  border-radius: 4px;
  z-index: 3;
  animation: mapBuildingPulse 2.5s ease-in-out infinite;
}
@keyframes mapTilePulse {
  0%, 100% {
    opacity: 0.3;
  }
  50% {
    opacity: 0.6;
  }
}
@keyframes mapRoadShimmer {
  0%, 100% {
    opacity: 0.4;
  }
  50% {
    opacity: 0.8;
  }
}
@keyframes mapBuildingPulse {
  0%, 100% {
    opacity: 0.5;
    transform: scale(0.95);
  }
  50% {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes uxpcore_table_skeleton_shimmer {
  0% {
    background-position: 400% 0;
  }
  100% {
    background-position: 100% 0;
  }
}
.uxpcore_skeleton_loader {
  border-radius: 0.5rem;
  background: linear-gradient(90deg, var(--loaderPrimaryColor) 25%, var(--loaderSecondaryColor) 37%, var(--loaderPrimaryColor) 63%);
  background-size: 400% 100%;
  animation: uxpcore_table_skeleton_shimmer 4s infinite ease-in-out;
}

.uxpcore_loading,
.uxp-loading-block {
  width: 100%;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: center;
}
@keyframes dots {
  50% {
    opacity: 0;
    transform: scale(0.7) translateY(10px);
  }
}
.uxpcore_loading .uxpcore_loading__dot,
.uxpcore_loading .dot,
.uxp-loading-block .uxpcore_loading__dot,
.uxp-loading-block .dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background-color: var(--accentColor);
  position: relative;
  animation: dots 2s ease-in-out 0.4s infinite;
}
.uxpcore_loading .uxpcore_loading__dot::before,
.uxpcore_loading .dot::before,
.uxp-loading-block .uxpcore_loading__dot::before,
.uxp-loading-block .dot::before {
  content: "";
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background-color: var(--accentColor);
  position: absolute;
  top: 50%;
  left: -150%;
  transform: translateY(-50%);
  animation: dots 2s ease-in-out infinite;
}
.uxpcore_loading .uxpcore_loading__dot::after,
.uxpcore_loading .dot::after,
.uxp-loading-block .uxpcore_loading__dot::after,
.uxp-loading-block .dot::after {
  content: "";
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background-color: var(--accentColor);
  position: absolute;
  top: 50%;
  left: 150%;
  transform: translateY(-50%);
  animation: dots 2s ease-in-out 0.8s infinite;
}

.uxpcore_loadingspinner__container {
  width: 100%;
  height: 100%;
  padding: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  color: var(--primaryTextColor);
}
.uxpcore_loadingspinner__message {
  width: auto;
  height: auto;
  padding: 10px;
  padding-right: 4px;
  color: var(--primaryTextColor);
}
.uxpcore_loadingspinner__spinner {
  width: 20px;
  height: 20px;
  color: var(--primaryTextColor);
}
.uxpcore_loadingspinner__spinner svg {
  width: 90%;
  height: 90%;
}

.uxpcore_loading-flash-alert {
  position: fixed;
  top: 80px;
  left: 50%;
  transform: translateX(-50%);
  width: auto;
  border-radius: 10px;
  height: auto;
  padding: 10px 100px;
  text-align: center;
  background-color: var(--secondaryBGColor);
  border: 1px solid var(--borderColor);
  color: var(--primaryTextColor);
  font-size: 16px;
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
}
.uxpcore_loading-flash-alert__icon {
  width: 20px;
  aspect-ratio: 1;
  margin-left: 20px;
}
.uxpcore_loading-flash-alert__icon svg {
  width: 100%;
  height: 100%;
}

.uxpcore_loading_feedback__overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  animation: fadeIn 0.2s ease-out;
}
.uxpcore_loading_feedback__backdrop {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: var(--boxShadowColor);
  opacity: 0.8;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  animation: fadeIn 0.3s ease-out;
}
.uxpcore_loading_feedback__content {
  position: relative;
  z-index: 1;
  min-width: 20rem;
  max-width: 35rem;
  padding: 3rem 4rem;
  border-radius: 0.5rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  animation: scaleIn 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
  background: var(--secondaryBGColor);
  backdrop-filter: blur(150px);
  -webkit-backdrop-filter: blur(150px);
  border: 1px solid var(--borderColor);
}
.uxpcore_loading_feedback__content * {
  color: var(--primaryTextColor);
}
.uxpcore_loading_feedback__icon {
  width: 6rem;
  height: 6rem;
  font-size: 5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 1.5rem;
  filter: drop-shadow(0 4px 12px rgba(0, 0, 0, 0.2));
}
.uxpcore_loading_feedback__icon--spin {
  animation: spin 1.2s linear infinite;
}
.uxpcore_loading_feedback__icon svg {
  width: 100%;
  height: 100%;
}
.uxpcore_loading_feedback__message {
  font-size: 1.5rem;
  font-weight: var(--fontWeightSemibold);
  margin-bottom: 0.75rem;
  min-height: 2rem;
  line-height: 1.4;
  transition: opacity 0.15s ease-out;
}
.uxpcore_loading_feedback__message--fade {
  opacity: 0;
}
.uxpcore_loading_feedback__submessage {
  font-size: 1.1rem;
  opacity: 0.85;
  margin-bottom: 1.5rem;
  line-height: 1.4;
  animation: pulse 2s ease-in-out infinite;
}
.uxpcore_loading_feedback__dots {
  display: flex;
  gap: 0.5rem;
  margin-top: 1rem;
}
.uxpcore_loading_feedback__dots span {
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
  background-color: currentColor;
  opacity: 0.3;
  animation: dotPulse 1.5s ease-in-out infinite;
}
.uxpcore_loading_feedback__dots span:nth-child(1) {
  animation-delay: 0s;
}
.uxpcore_loading_feedback__dots span:nth-child(2) {
  animation-delay: 0.2s;
}
.uxpcore_loading_feedback__dots span:nth-child(3) {
  animation-delay: 0.4s;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes scaleIn {
  from {
    opacity: 0;
    transform: scale(0.9);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}
@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
@keyframes pulse {
  0%, 100% {
    opacity: 0.6;
  }
  50% {
    opacity: 1;
  }
}
@keyframes dotPulse {
  0%, 100% {
    opacity: 0.3;
    transform: scale(1);
  }
  50% {
    opacity: 0.8;
    transform: scale(1.2);
  }
}
.uxpcore__portalbackdrop {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: transparent;
  z-index: 1000;
  overflow: auto;
}

.uxpcore_tooltip__container {
  display: inline;
}
.uxpcore_tooltip__content {
  position: fixed;
  width: auto;
  height: auto;
  border-radius: 0.5rem;
  padding: 0.5rem;
  color: var(--primaryTextColor);
  z-index: 1000;
  background: var(--secondaryBGColor);
  backdrop-filter: blur(150px);
  -webkit-backdrop-filter: blur(150px);
  border: 1px solid var(--borderColor);
}
.uxpcore_tooltip__content::before {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  width: 0;
  height: 0;
  background-color: transparent;
  border-top: 10px solid var(--borderColor);
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: none;
  transform: translate(-50%, 0);
}
.uxpcore_tooltip__content--top::before {
  top: 100%;
  left: 50%;
  border-top: 10px solid var(--borderColor);
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: none;
  transform: translate(-50%, 0);
}
.uxpcore_tooltip__content--bottom::before {
  top: -10px;
  left: 50%;
  border-bottom: 10px solid var(--borderColor);
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-top: none;
  transform: translate(-50%, 0);
}
.uxpcore_tooltip__content--right::before {
  border-bottom: 10px solid transparent;
  border-left: none;
  border-right: 10px solid var(--borderColor);
  border-top: 10px solid transparent;
  left: -10px;
  top: 50%;
  transform: translate(0, -50%);
}
.uxpcore_tooltip__content--left::before {
  border-bottom: 10px solid transparent;
  border-right: none;
  border-left: 10px solid var(--borderColor);
  border-top: 10px solid transparent;
  top: 50%;
  left: 100%;
  transform: translate(0, -50%);
}
.uxpcore_tooltip__content:not(.uxpcore_tooltip__content--arrow)::before {
  display: none;
}

/**
 * Popover Component - v5 Pattern
 * Uses Dropdown component for positioning
 */
.uxpcore_popover {
  min-width: 200px;
  max-width: 400px;
  border-radius: 0.8rem;
  border: 1px solid var(--borderColor);
  overflow: hidden;
  background: var(--secondaryBGColor);
  backdrop-filter: blur(150px);
  -webkit-backdrop-filter: blur(150px);
  border: 1px solid var(--borderColor);
}
.uxpcore_popover__content {
  display: flex;
  flex-direction: column;
}
.uxpcore_popover__title {
  padding: 1rem 1.25rem;
  font-size: 0.95rem;
  font-weight: var(--fontWeightSemibold);
  color: var(--primaryTextColor);
  border-bottom: 1px solid var(--borderColor);
  background-color: var(--headerBGColor);
}
.uxpcore_popover__body {
  padding: 1rem 1.25rem;
  font-size: 0.875rem;
  color: var(--secondaryTextColor);
  line-height: 1.5;
}

/**
 * FilterPanel Component - v5 Pattern
 * Uses Dropdown component for positioning
 */
.uxpcore_filterpanel {
  min-width: 23rem;
  max-width: 33rem;
  border-radius: 0.8rem;
  border: 1px solid var(--borderColor);
  overflow: hidden;
  background: var(--secondaryBGColor);
  backdrop-filter: blur(150px);
  -webkit-backdrop-filter: blur(150px);
  border: 1px solid var(--borderColor);
}
.uxpcore_filterpanel__content {
  display: flex;
  flex-direction: column;
  max-height: 80vh;
}
.uxpcore_filterpanel__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  padding: 0.5rem;
  border-bottom: 1px solid var(--borderColor);
  background-color: var(--headerBGColor);
  flex-shrink: 0;
}
.uxpcore_filterpanel__title {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex: 1;
}
.uxpcore_filterpanel__title-text {
  font-size: 1rem;
  font-weight: var(--fontWeightSemibold);
  color: var(--primaryTextColor);
}
.uxpcore_filterpanel__body {
  flex: 1;
  padding: 0rem;
  overflow-y: auto;
  overflow-x: hidden;
}
.uxpcore_filterpanel__body::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
.uxpcore_filterpanel__body::-webkit-scrollbar-track {
  background: var(--portalBGColor);
}
.uxpcore_filterpanel__body::-webkit-scrollbar-thumb {
  border-radius: 10px;
  background-color: var(--primaryTextColor);
  border: 4px solid transparent;
  background-clip: padding-box;
}
.uxpcore_filterpanel__body::-webkit-scrollbar-thumb:hover {
  border: 0;
}
.uxpcore_filterpanel__footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: 0.5rem;
  border-top: 1px solid var(--borderColor);
  background-color: var(--headerBGColor);
  flex-shrink: 0;
}

.uxpcore_info-button__btn {
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 50%;
  font-size: 1.5rem;
  background-color: var(--primaryBGColor);
  color: var(--primaryTextColor);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0.5;
  cursor: pointer;
}
.uxpcore_info-button__btn:hover {
  opacity: 1;
}
.uxpcore_info-button__btn--small {
  width: 1rem;
  height: 1rem;
  background-color: transparent;
  font-size: 1rem;
}
.uxpcore_info-button__content {
  max-width: 25rem;
  min-width: 15rem;
  max-height: 10rem;
  overflow-y: auto;
  font-size: 12px;
  font-weight: var(--fontWeightRegular);
  line-height: 1.5;
  padding: 0.5rem 1rem;
}
.uxpcore_info-button__list {
  margin: 0;
  padding-left: 1.2rem;
}
.uxpcore_info-button__list li {
  margin-bottom: 0.2rem;
}

.dropdown-btn {
  display: inline-block;
}

.dropdown-btn-content {
  position: absolute;
  width: auto;
  height: auto;
  border-radius: 10px;
  background-color: var(--primaryBGColor);
  padding: 10px 15px;
  filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.3));
  -webkit-filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.3));
  z-index: 1000;
  transition: all ease-in-out 300ms;
}
.dropdown-btn-content::before {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  background-color: transparent;
  border-bottom: 10px solid var(--primaryBGColor);
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-top: none;
}
.dropdown-btn-content.auto-bottom.auto-middle:before {
  top: -10px;
  left: 50%;
  translate: -50% 0;
}
.dropdown-btn-content.auto-bottom.auto-right:before {
  border-bottom: 20px solid var(--primaryBGColor);
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  top: -10px;
  left: 0;
  translate: -50% 0;
  rotate: -45deg;
}
.dropdown-btn-content.auto-bottom.auto-left:before {
  border-bottom: 20px solid var(--primaryBGColor);
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  top: -10px;
  right: 0;
  translate: 50% 0;
  rotate: 45deg;
}
.dropdown-btn-content.auto-top.auto-middle:before {
  bottom: -10px;
  left: 50%;
  right: unset;
  translate: -50% 0;
  rotate: 180deg;
}
.dropdown-btn-content.auto-top.auto-right:before {
  border-bottom: 20px solid var(--primaryBGColor);
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  bottom: -10px;
  left: 0;
  translate: -50% 0;
  rotate: -135deg;
}
.dropdown-btn-content.auto-top.auto-left:before {
  border-bottom: 20px solid var(--primaryBGColor);
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  bottom: -10px;
  right: 0;
  translate: 50% 0;
  rotate: 135deg;
}
.dropdown-btn-content.auto-middle.auto-right:before {
  top: 50%;
  left: -15px;
  translate: 0 -50%;
  rotate: -90deg;
}
.dropdown-btn-content.auto-middle.auto-left:before {
  top: 50%;
  right: -15px;
  translate: 0 -50%;
  rotate: 90deg;
}
.dropdown-btn-content.left::before {
  top: -10px;
  left: 0;
  transform: translateX(50%);
}
.dropdown-btn-content.left.center {
  transform: translate(-100%, -50%);
}
.dropdown-btn-content.left.center::before {
  border-bottom: 10px solid transparent;
  border-right: none;
  border-left: 10px solid var(--primaryBGColor);
  border-top: 10px solid transparent;
  top: 50%;
  right: -10px;
  transform: translate(0, -50%);
}
.dropdown-btn-content.right::before {
  top: -10px;
  right: 0;
  transform: translateX(-50%);
}
.dropdown-btn-content.right.center {
  transform: translate(0, -50%);
}
.dropdown-btn-content.right.center::before {
  border-bottom: 10px solid transparent;
  border-left: none;
  border-right: 10px solid var(--primaryBGColor);
  border-top: 10px solid transparent;
  top: 50%;
  left: -10px;
  transform: translate(0, -50%);
}
.dropdown-btn-content.bottom.right::before {
  top: -10px;
  right: 0;
  transform: translateX(-50%);
}
.dropdown-btn-content.bottom.left::before {
  top: -10px;
  left: 0;
  transform: translateX(50%);
}
.dropdown-btn-content.bottom.center {
  transform: translateX(-50%);
}
.dropdown-btn-content.bottom.center::before {
  top: -10px;
  left: 50%;
  transform: translateX(-50%);
}
.dropdown-btn-content.top {
  transform: translateY(-100%);
}
.dropdown-btn-content.top:before {
  border-top: 10px solid var(--primaryBGColor);
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: none;
}
.dropdown-btn-content.top.right::before {
  top: 100%;
  right: 0;
  transform: translateX(-50%);
}
.dropdown-btn-content.top.left::before {
  top: 100%;
  left: 0;
  transform: translateX(50%);
}
.dropdown-btn-content.top.center {
  transform: translate(-50%, -100%);
}
.dropdown-btn-content.top.center::before {
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
}

.uxpcore_dropdown__container {
  position: relative;
  display: inline-block;
}
.uxpcore_dropdown__trigger {
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  width: auto;
  height: auto;
}
.uxpcore_dropdown__wrapper {
  position: absolute;
  width: auto;
  height: auto;
  background-color: var(--primaryBGColor);
  color: var(--primaryTextColor);
  z-index: 10;
  border: 1px solid var(--borderColor);
  border-radius: 0.5rem;
  box-shadow: 0px 12px 16px -4px var(--boxShadowColor);
  -ms-overflow-style: none;
  /* IE and Edge */
  scrollbar-width: none;
  /* Firefox */
  min-width: 12rem;
  max-height: 80vh;
  overflow: auto;
}
.uxpcore_dropdown__wrapper::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}
.uxpcore_dropdown__content {
  width: 100%;
  border-radius: inherit;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 0;
  -ms-overflow-style: none;
  /* IE and Edge */
  scrollbar-width: none;
  /* Firefox */
  background: var(--secondaryBGColor);
  backdrop-filter: blur(150px);
  -webkit-backdrop-filter: blur(150px);
  border: 1px solid var(--borderColor);
  border: none;
}
.uxpcore_dropdown__content::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}
.uxpcore_dropdown__content .uxpcore_select__search {
  border: none;
}
.uxpcore_dropdown__animation_top-enter {
  opacity: 0.6;
  transform: scale(0.95);
  transform-origin: top center;
}
.uxpcore_dropdown__animation_top-enter-active {
  opacity: 1;
  transform: scale(1);
  transition: transform 0.03s ease-in forwards;
}
.uxpcore_dropdown__animation_top-enter-done {
  opacity: 1;
  transform: scale(1);
}
.uxpcore_dropdown__animation_top-exit {
  opacity: 1;
  transform: scale(1);
  transform-origin: top center;
}
.uxpcore_dropdown__animation_top-exit-active {
  opacity: 0;
  transform: scale(0.95);
  transition: transform 0.03s ease-in forwards;
}
.uxpcore_dropdown__animation_top-exit-done {
  opacity: 0;
  transform: scale(0.95);
}
.uxpcore_dropdown__animation_top-left-enter {
  opacity: 0.6;
  transform: scale(0.95);
  transform-origin: top center;
}
.uxpcore_dropdown__animation_top-left-enter-active {
  opacity: 1;
  transform: scale(1);
  transition: transform 0.03s ease-in forwards;
}
.uxpcore_dropdown__animation_top-left-enter-done {
  opacity: 1;
  transform: scale(1);
}
.uxpcore_dropdown__animation_top-left-exit {
  opacity: 1;
  transform: scale(1);
  transform-origin: top center;
}
.uxpcore_dropdown__animation_top-left-exit-active {
  opacity: 0;
  transform: scale(0.95);
  transition: transform 0.03s ease-in forwards;
}
.uxpcore_dropdown__animation_top-left-exit-done {
  opacity: 0;
  transform: scale(0.95);
}
.uxpcore_dropdown__animation_top-right-enter {
  opacity: 0.6;
  transform: scale(0.95);
  transform-origin: top center;
}
.uxpcore_dropdown__animation_top-right-enter-active {
  opacity: 1;
  transform: scale(1);
  transition: transform 0.03s ease-in forwards;
}
.uxpcore_dropdown__animation_top-right-enter-done {
  opacity: 1;
  transform: scale(1);
}
.uxpcore_dropdown__animation_top-right-exit {
  opacity: 1;
  transform: scale(1);
  transform-origin: top center;
}
.uxpcore_dropdown__animation_top-right-exit-active {
  opacity: 0;
  transform: scale(0.95);
  transition: transform 0.03s ease-in forwards;
}
.uxpcore_dropdown__animation_top-right-exit-done {
  opacity: 0;
  transform: scale(0.95);
}
.uxpcore_dropdown__animation_bottom-enter {
  opacity: 0.6;
  transform: scale(0.95);
  transform-origin: top center;
}
.uxpcore_dropdown__animation_bottom-enter-active {
  opacity: 1;
  transform: scale(1);
  transition: transform 0.03s ease-in forwards;
}
.uxpcore_dropdown__animation_bottom-enter-done {
  opacity: 1;
  transform: scale(1);
}
.uxpcore_dropdown__animation_bottom-exit {
  opacity: 1;
  transform: scale(1);
  transform-origin: top center;
}
.uxpcore_dropdown__animation_bottom-exit-active {
  opacity: 0;
  transform: scale(0.95);
  transition: transform 0.03s ease-in forwards;
}
.uxpcore_dropdown__animation_bottom-exit-done {
  opacity: 0;
  transform: scale(0.95);
}
.uxpcore_dropdown__animation_bottom-left-enter {
  opacity: 0.6;
  transform: scale(0.95);
  transform-origin: top center;
}
.uxpcore_dropdown__animation_bottom-left-enter-active {
  opacity: 1;
  transform: scale(1);
  transition: transform 0.03s ease-in forwards;
}
.uxpcore_dropdown__animation_bottom-left-enter-done {
  opacity: 1;
  transform: scale(1);
}
.uxpcore_dropdown__animation_bottom-left-exit {
  opacity: 1;
  transform: scale(1);
  transform-origin: top center;
}
.uxpcore_dropdown__animation_bottom-left-exit-active {
  opacity: 0;
  transform: scale(0.95);
  transition: transform 0.03s ease-in forwards;
}
.uxpcore_dropdown__animation_bottom-left-exit-done {
  opacity: 0;
  transform: scale(0.95);
}
.uxpcore_dropdown__animation_bottom-right-enter {
  opacity: 0.6;
  transform: scale(0.95);
  transform-origin: top center;
}
.uxpcore_dropdown__animation_bottom-right-enter-active {
  opacity: 1;
  transform: scale(1);
  transition: transform 0.03s ease-in forwards;
}
.uxpcore_dropdown__animation_bottom-right-enter-done {
  opacity: 1;
  transform: scale(1);
}
.uxpcore_dropdown__animation_bottom-right-exit {
  opacity: 1;
  transform: scale(1);
  transform-origin: top center;
}
.uxpcore_dropdown__animation_bottom-right-exit-active {
  opacity: 0;
  transform: scale(0.95);
  transition: transform 0.03s ease-in forwards;
}
.uxpcore_dropdown__animation_bottom-right-exit-done {
  opacity: 0;
  transform: scale(0.95);
}
.uxpcore_dropdown__animation_left-enter {
  opacity: 0.6;
  transform: scale(0.95);
  transform-origin: top center;
}
.uxpcore_dropdown__animation_left-enter-active {
  opacity: 1;
  transform: scale(1);
  transition: transform 0.03s ease-in forwards;
}
.uxpcore_dropdown__animation_left-enter-done {
  opacity: 1;
  transform: scale(1);
}
.uxpcore_dropdown__animation_left-exit {
  opacity: 1;
  transform: scale(1);
  transform-origin: top center;
}
.uxpcore_dropdown__animation_left-exit-active {
  opacity: 0;
  transform: scale(0.95);
  transition: transform 0.03s ease-in forwards;
}
.uxpcore_dropdown__animation_left-exit-done {
  opacity: 0;
  transform: scale(0.95);
}
.uxpcore_dropdown__animation_right-enter {
  opacity: 0.6;
  transform: scale(0.95);
  transform-origin: top center;
}
.uxpcore_dropdown__animation_right-enter-active {
  opacity: 1;
  transform: scale(1);
  transition: transform 0.03s ease-in forwards;
}
.uxpcore_dropdown__animation_right-enter-done {
  opacity: 1;
  transform: scale(1);
}
.uxpcore_dropdown__animation_right-exit {
  opacity: 1;
  transform: scale(1);
  transform-origin: top center;
}
.uxpcore_dropdown__animation_right-exit-active {
  opacity: 0;
  transform: scale(0.95);
  transition: transform 0.03s ease-in forwards;
}
.uxpcore_dropdown__animation_right-exit-done {
  opacity: 0;
  transform: scale(0.95);
}
.uxpcore_dropdown__animation_top-left-corner-enter {
  opacity: 0.6;
  transform: scale(0.95);
  transform-origin: top center;
}
.uxpcore_dropdown__animation_top-left-corner-enter-active {
  opacity: 1;
  transform: scale(1);
  transition: transform 0.03s ease-in forwards;
}
.uxpcore_dropdown__animation_top-left-corner-enter-done {
  opacity: 1;
  transform: scale(1);
}
.uxpcore_dropdown__animation_top-left-corner-exit {
  opacity: 1;
  transform: scale(1);
  transform-origin: top center;
}
.uxpcore_dropdown__animation_top-left-corner-exit-active {
  opacity: 0;
  transform: scale(0.95);
  transition: transform 0.03s ease-in forwards;
}
.uxpcore_dropdown__animation_top-left-corner-exit-done {
  opacity: 0;
  transform: scale(0.95);
}
.uxpcore_dropdown__animation_top-right-corner-enter {
  opacity: 0.6;
  transform: scale(0.95);
  transform-origin: top center;
}
.uxpcore_dropdown__animation_top-right-corner-enter-active {
  opacity: 1;
  transform: scale(1);
  transition: transform 0.03s ease-in forwards;
}
.uxpcore_dropdown__animation_top-right-corner-enter-done {
  opacity: 1;
  transform: scale(1);
}
.uxpcore_dropdown__animation_top-right-corner-exit {
  opacity: 1;
  transform: scale(1);
  transform-origin: top center;
}
.uxpcore_dropdown__animation_top-right-corner-exit-active {
  opacity: 0;
  transform: scale(0.95);
  transition: transform 0.03s ease-in forwards;
}
.uxpcore_dropdown__animation_top-right-corner-exit-done {
  opacity: 0;
  transform: scale(0.95);
}
.uxpcore_dropdown__animation_bottom-left-corner-enter {
  opacity: 0.6;
  transform: scale(0.95);
  transform-origin: top center;
}
.uxpcore_dropdown__animation_bottom-left-corner-enter-active {
  opacity: 1;
  transform: scale(1);
  transition: transform 0.03s ease-in forwards;
}
.uxpcore_dropdown__animation_bottom-left-corner-enter-done {
  opacity: 1;
  transform: scale(1);
}
.uxpcore_dropdown__animation_bottom-left-corner-exit {
  opacity: 1;
  transform: scale(1);
  transform-origin: top center;
}
.uxpcore_dropdown__animation_bottom-left-corner-exit-active {
  opacity: 0;
  transform: scale(0.95);
  transition: transform 0.03s ease-in forwards;
}
.uxpcore_dropdown__animation_bottom-left-corner-exit-done {
  opacity: 0;
  transform: scale(0.95);
}
.uxpcore_dropdown__animation_bottom-right-corner-enter {
  opacity: 0.6;
  transform: scale(0.95);
  transform-origin: top center;
}
.uxpcore_dropdown__animation_bottom-right-corner-enter-active {
  opacity: 1;
  transform: scale(1);
  transition: transform 0.03s ease-in forwards;
}
.uxpcore_dropdown__animation_bottom-right-corner-enter-done {
  opacity: 1;
  transform: scale(1);
}
.uxpcore_dropdown__animation_bottom-right-corner-exit {
  opacity: 1;
  transform: scale(1);
  transform-origin: top center;
}
.uxpcore_dropdown__animation_bottom-right-corner-exit-active {
  opacity: 0;
  transform: scale(0.95);
  transition: transform 0.03s ease-in forwards;
}
.uxpcore_dropdown__animation_bottom-right-corner-exit-done {
  opacity: 0;
  transform: scale(0.95);
}
.uxpcore_dropdown__animation_right-top-enter {
  opacity: 0.6;
  transform: scale(0.95);
  transform-origin: top center;
}
.uxpcore_dropdown__animation_right-top-enter-active {
  opacity: 1;
  transform: scale(1);
  transition: transform 0.03s ease-in forwards;
}
.uxpcore_dropdown__animation_right-top-enter-done {
  opacity: 1;
  transform: scale(1);
}
.uxpcore_dropdown__animation_right-top-exit {
  opacity: 1;
  transform: scale(1);
  transform-origin: top center;
}
.uxpcore_dropdown__animation_right-top-exit-active {
  opacity: 0;
  transform: scale(0.95);
  transition: transform 0.03s ease-in forwards;
}
.uxpcore_dropdown__animation_right-top-exit-done {
  opacity: 0;
  transform: scale(0.95);
}
.uxpcore_dropdown__animation_right-bottom-enter {
  opacity: 0.6;
  transform: scale(0.95);
  transform-origin: top center;
}
.uxpcore_dropdown__animation_right-bottom-enter-active {
  opacity: 1;
  transform: scale(1);
  transition: transform 0.03s ease-in forwards;
}
.uxpcore_dropdown__animation_right-bottom-enter-done {
  opacity: 1;
  transform: scale(1);
}
.uxpcore_dropdown__animation_right-bottom-exit {
  opacity: 1;
  transform: scale(1);
  transform-origin: top center;
}
.uxpcore_dropdown__animation_right-bottom-exit-active {
  opacity: 0;
  transform: scale(0.95);
  transition: transform 0.03s ease-in forwards;
}
.uxpcore_dropdown__animation_right-bottom-exit-done {
  opacity: 0;
  transform: scale(0.95);
}
.uxpcore_dropdown__animation_left-top-enter {
  opacity: 0.6;
  transform: scale(0.95);
  transform-origin: top center;
}
.uxpcore_dropdown__animation_left-top-enter-active {
  opacity: 1;
  transform: scale(1);
  transition: transform 0.03s ease-in forwards;
}
.uxpcore_dropdown__animation_left-top-enter-done {
  opacity: 1;
  transform: scale(1);
}
.uxpcore_dropdown__animation_left-top-exit {
  opacity: 1;
  transform: scale(1);
  transform-origin: top center;
}
.uxpcore_dropdown__animation_left-top-exit-active {
  opacity: 0;
  transform: scale(0.95);
  transition: transform 0.03s ease-in forwards;
}
.uxpcore_dropdown__animation_left-top-exit-done {
  opacity: 0;
  transform: scale(0.95);
}
.uxpcore_dropdown__animation_left-bottom-enter {
  opacity: 0.6;
  transform: scale(0.95);
  transform-origin: top center;
}
.uxpcore_dropdown__animation_left-bottom-enter-active {
  opacity: 1;
  transform: scale(1);
  transition: transform 0.03s ease-in forwards;
}
.uxpcore_dropdown__animation_left-bottom-enter-done {
  opacity: 1;
  transform: scale(1);
}
.uxpcore_dropdown__animation_left-bottom-exit {
  opacity: 1;
  transform: scale(1);
  transform-origin: top center;
}
.uxpcore_dropdown__animation_left-bottom-exit-active {
  opacity: 0;
  transform: scale(0.95);
  transition: transform 0.03s ease-in forwards;
}
.uxpcore_dropdown__animation_left-bottom-exit-done {
  opacity: 0;
  transform: scale(0.95);
}
.uxpcore_dropdown__anchor_top::before, .uxpcore_dropdown__anchor_top::after {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
}
.uxpcore_dropdown__anchor_top::before {
  z-index: 1;
}
.uxpcore_dropdown__anchor_top::after {
  z-index: 0;
}
.uxpcore_dropdown__anchor_top::before {
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-top: 8px solid var(--primaryBGColor);
  bottom: -8px;
}
.uxpcore_dropdown__anchor_top::after {
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-top: 10px solid var(--borderColor);
  bottom: -10px;
}
.uxpcore_dropdown__anchor_top::before, .uxpcore_dropdown__anchor_top::after {
  left: 50%;
  transform: translateX(-50%);
}
.uxpcore_dropdown__anchor_top-left::before, .uxpcore_dropdown__anchor_top-left::after {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
}
.uxpcore_dropdown__anchor_top-left::before {
  z-index: 1;
}
.uxpcore_dropdown__anchor_top-left::after {
  z-index: 0;
}
.uxpcore_dropdown__anchor_top-left::before {
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-top: 8px solid var(--primaryBGColor);
  bottom: -8px;
}
.uxpcore_dropdown__anchor_top-left::after {
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-top: 10px solid var(--borderColor);
  bottom: -10px;
}
.uxpcore_dropdown__anchor_top-left::before {
  left: 10px;
}
.uxpcore_dropdown__anchor_top-left::after {
  left: 8px;
}
.uxpcore_dropdown__anchor_top-right::before, .uxpcore_dropdown__anchor_top-right::after {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
}
.uxpcore_dropdown__anchor_top-right::before {
  z-index: 1;
}
.uxpcore_dropdown__anchor_top-right::after {
  z-index: 0;
}
.uxpcore_dropdown__anchor_top-right::before {
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-top: 8px solid var(--primaryBGColor);
  bottom: -8px;
}
.uxpcore_dropdown__anchor_top-right::after {
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-top: 10px solid var(--borderColor);
  bottom: -10px;
}
.uxpcore_dropdown__anchor_top-right::before {
  right: 10px;
}
.uxpcore_dropdown__anchor_top-right::after {
  right: 8px;
}
.uxpcore_dropdown__anchor_bottom::before, .uxpcore_dropdown__anchor_bottom::after {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
}
.uxpcore_dropdown__anchor_bottom::before {
  z-index: 1;
}
.uxpcore_dropdown__anchor_bottom::after {
  z-index: 0;
}
.uxpcore_dropdown__anchor_bottom::before {
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-bottom: 8px solid var(--primaryBGColor);
  top: -8px;
}
.uxpcore_dropdown__anchor_bottom::after {
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: 10px solid var(--borderColor);
  top: -10px;
}
.uxpcore_dropdown__anchor_bottom::before, .uxpcore_dropdown__anchor_bottom::after {
  left: 50%;
  transform: translateX(-50%);
}
.uxpcore_dropdown__anchor_bottom-left::before, .uxpcore_dropdown__anchor_bottom-left::after {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
}
.uxpcore_dropdown__anchor_bottom-left::before {
  z-index: 1;
}
.uxpcore_dropdown__anchor_bottom-left::after {
  z-index: 0;
}
.uxpcore_dropdown__anchor_bottom-left::before {
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-bottom: 8px solid var(--primaryBGColor);
  top: -8px;
}
.uxpcore_dropdown__anchor_bottom-left::after {
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: 10px solid var(--borderColor);
  top: -10px;
}
.uxpcore_dropdown__anchor_bottom-left::before {
  left: 10px;
}
.uxpcore_dropdown__anchor_bottom-left::after {
  left: 8px;
}
.uxpcore_dropdown__anchor_bottom-right::before, .uxpcore_dropdown__anchor_bottom-right::after {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
}
.uxpcore_dropdown__anchor_bottom-right::before {
  z-index: 1;
}
.uxpcore_dropdown__anchor_bottom-right::after {
  z-index: 0;
}
.uxpcore_dropdown__anchor_bottom-right::before {
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-bottom: 8px solid var(--primaryBGColor);
  top: -8px;
}
.uxpcore_dropdown__anchor_bottom-right::after {
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: 10px solid var(--borderColor);
  top: -10px;
}
.uxpcore_dropdown__anchor_bottom-right::before {
  right: 10px;
}
.uxpcore_dropdown__anchor_bottom-right::after {
  right: 8px;
}
.uxpcore_dropdown__anchor_left::before, .uxpcore_dropdown__anchor_left::after {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
}
.uxpcore_dropdown__anchor_left::before {
  z-index: 1;
}
.uxpcore_dropdown__anchor_left::after {
  z-index: 0;
}
.uxpcore_dropdown__anchor_left::before {
  border-top: 8px solid transparent;
  border-bottom: 8px solid transparent;
  border-left: 8px solid var(--primaryBGColor);
  top: 50%;
  right: -8px;
  transform: translateY(-50%);
}
.uxpcore_dropdown__anchor_left::after {
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-left: 10px solid var(--borderColor);
  top: 50%;
  right: -10px;
  transform: translateY(-50%);
}
.uxpcore_dropdown__anchor_right::before, .uxpcore_dropdown__anchor_right::after {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
}
.uxpcore_dropdown__anchor_right::before {
  z-index: 1;
}
.uxpcore_dropdown__anchor_right::after {
  z-index: 0;
}
.uxpcore_dropdown__anchor_right::before {
  border-top: 8px solid transparent;
  border-bottom: 8px solid transparent;
  border-right: 8px solid var(--primaryBGColor);
  top: 50%;
  left: -8px;
  transform: translateY(-50%);
}
.uxpcore_dropdown__anchor_right::after {
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-right: 10px solid var(--borderColor);
  top: 50%;
  left: -10px;
  transform: translateY(-50%);
}
.uxpcore_dropdown__anchor_right-top::before, .uxpcore_dropdown__anchor_right-top::after {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
}
.uxpcore_dropdown__anchor_right-top::before {
  z-index: 1;
}
.uxpcore_dropdown__anchor_right-top::after {
  z-index: 0;
}
.uxpcore_dropdown__anchor_right-top::before {
  border-top: 8px solid transparent;
  border-bottom: 8px solid transparent;
  border-right: 8px solid var(--primaryBGColor);
  top: 10px;
  left: -8px;
}
.uxpcore_dropdown__anchor_right-top::after {
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-right: 10px solid var(--borderColor);
  top: 8px;
  left: -10px;
}
.uxpcore_dropdown__anchor_right-bottom::before, .uxpcore_dropdown__anchor_right-bottom::after {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
}
.uxpcore_dropdown__anchor_right-bottom::before {
  z-index: 1;
}
.uxpcore_dropdown__anchor_right-bottom::after {
  z-index: 0;
}
.uxpcore_dropdown__anchor_right-bottom::before {
  border-top: 8px solid transparent;
  border-bottom: 8px solid transparent;
  border-right: 8px solid var(--primaryBGColor);
  bottom: 10px;
  left: -8px;
}
.uxpcore_dropdown__anchor_right-bottom::after {
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-right: 10px solid var(--borderColor);
  bottom: 8px;
  left: -10px;
}
.uxpcore_dropdown__anchor_left-top::before, .uxpcore_dropdown__anchor_left-top::after {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
}
.uxpcore_dropdown__anchor_left-top::before {
  z-index: 1;
}
.uxpcore_dropdown__anchor_left-top::after {
  z-index: 0;
}
.uxpcore_dropdown__anchor_left-top::before {
  border-top: 8px solid transparent;
  border-bottom: 8px solid transparent;
  border-left: 8px solid var(--primaryBGColor);
  top: 10px;
  right: -8px;
}
.uxpcore_dropdown__anchor_left-top::after {
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-left: 10px solid var(--borderColor);
  top: 8px;
  right: -10px;
}
.uxpcore_dropdown__anchor_left-bottom::before, .uxpcore_dropdown__anchor_left-bottom::after {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
}
.uxpcore_dropdown__anchor_left-bottom::before {
  z-index: 1;
}
.uxpcore_dropdown__anchor_left-bottom::after {
  z-index: 0;
}
.uxpcore_dropdown__anchor_left-bottom::before {
  border-top: 8px solid transparent;
  border-bottom: 8px solid transparent;
  border-left: 8px solid var(--primaryBGColor);
  bottom: 10px;
  right: -8px;
}
.uxpcore_dropdown__anchor_left-bottom::after {
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-left: 10px solid var(--borderColor);
  bottom: 8px;
  right: -10px;
}
.uxpcore_dropdown__anchor_top-left-corner {
  border-bottom-right-radius: 0;
}
.uxpcore_dropdown__anchor_top-right-corner {
  border-bottom-left-radius: 0;
}
.uxpcore_dropdown__anchor_bottom-left-corner {
  border-top-right-radius: 0;
}
.uxpcore_dropdown__anchor_bottom-right-corner {
  border-top-left-radius: 0;
}

/**
 * Modal Component - v5 Pattern
 * Similar to SlideInPanel modal mode with frosted-glass effect
 */
.uxpcore_modal {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
}
.uxpcore_modal__backdrop {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.2);
  z-index: -1;
}
.uxpcore_modal__panel {
  position: relative;
  width: auto;
  min-width: 70%;
  max-width: 90%;
  height: auto;
  min-height: 64%;
  max-height: 90%;
  border-radius: 0.8rem;
  border: 1px solid var(--borderColor);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  z-index: 1;
  background: var(--secondaryBGColor);
  backdrop-filter: blur(150px);
  -webkit-backdrop-filter: blur(150px);
  border: 1px solid var(--borderColor);
}
.uxpcore_modal__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.5rem;
  border-bottom: 1px solid var(--borderColor);
  flex-shrink: 0;
}
.uxpcore_modal__title {
  flex: 1;
  font-size: 1.125rem;
  font-weight: var(--fontWeightSemibold);
  color: var(--primaryTextColor);
  line-height: 1.3;
}
.uxpcore_modal__close {
  flex-shrink: 0;
}
.uxpcore_modal__body {
  flex: 1;
  padding: 1.5rem;
  overflow-y: auto;
  overflow-x: hidden;
}

.zoom-enter .uxpcore_modal__panel {
  opacity: 0;
  transform: scale(0.9);
}
.zoom-enter-active .uxpcore_modal__panel {
  opacity: 1;
  transform: scale(1);
  transition: opacity 300ms ease, transform 300ms cubic-bezier(0.19, 1, 0.22, 1);
}
.zoom-enter-done .uxpcore_modal__panel {
  opacity: 1;
  transform: scale(1);
}
.zoom-exit .uxpcore_modal__panel {
  opacity: 1;
  transform: scale(1);
}
.zoom-exit-active .uxpcore_modal__panel {
  opacity: 0;
  transform: scale(0.9);
  transition: opacity 200ms ease, transform 200ms cubic-bezier(0.19, 1, 0.22, 1);
}
.zoom-exit-done .uxpcore_modal__panel {
  opacity: 0;
}

.slide-from-top-right-enter .uxpcore_modal__panel {
  opacity: 0;
  transform: scale(0);
  transform-origin: top right;
}
.slide-from-top-right-enter-active .uxpcore_modal__panel {
  opacity: 1;
  transform: scale(1);
  transform-origin: top right;
  transition: opacity 300ms ease, transform 300ms cubic-bezier(0.19, 1, 0.22, 1);
}
.slide-from-top-right-enter-done .uxpcore_modal__panel {
  opacity: 1;
  transform: scale(1);
}
.slide-from-top-right-exit .uxpcore_modal__panel {
  opacity: 1;
  transform: scale(1);
  transform-origin: top right;
}
.slide-from-top-right-exit-active .uxpcore_modal__panel {
  opacity: 0;
  transform: scale(0);
  transform-origin: top right;
  transition: opacity 200ms ease, transform 200ms cubic-bezier(0.19, 1, 0.22, 1);
}
.slide-from-top-right-exit-done .uxpcore_modal__panel {
  opacity: 0;
}

.slide-from-top-left-enter .uxpcore_modal__panel {
  opacity: 0;
  transform: scale(0);
  transform-origin: top left;
}
.slide-from-top-left-enter-active .uxpcore_modal__panel {
  opacity: 1;
  transform: scale(1);
  transform-origin: top left;
  transition: opacity 300ms ease, transform 300ms cubic-bezier(0.19, 1, 0.22, 1);
}
.slide-from-top-left-enter-done .uxpcore_modal__panel {
  opacity: 1;
  transform: scale(1);
}
.slide-from-top-left-exit .uxpcore_modal__panel {
  opacity: 1;
  transform: scale(1);
  transform-origin: top left;
}
.slide-from-top-left-exit-active .uxpcore_modal__panel {
  opacity: 0;
  transform: scale(0);
  transform-origin: top left;
  transition: opacity 200ms ease, transform 200ms cubic-bezier(0.19, 1, 0.22, 1);
}
.slide-from-top-left-exit-done .uxpcore_modal__panel {
  opacity: 0;
}

.slide-from-bottom-right-enter .uxpcore_modal__panel {
  opacity: 0;
  transform: scale(0);
  transform-origin: bottom right;
}
.slide-from-bottom-right-enter-active .uxpcore_modal__panel {
  opacity: 1;
  transform: scale(1);
  transform-origin: bottom right;
  transition: opacity 300ms ease, transform 300ms cubic-bezier(0.19, 1, 0.22, 1);
}
.slide-from-bottom-right-enter-done .uxpcore_modal__panel {
  opacity: 1;
  transform: scale(1);
}
.slide-from-bottom-right-exit .uxpcore_modal__panel {
  opacity: 1;
  transform: scale(1);
  transform-origin: bottom right;
}
.slide-from-bottom-right-exit-active .uxpcore_modal__panel {
  opacity: 0;
  transform: scale(0);
  transform-origin: bottom right;
  transition: opacity 200ms ease, transform 200ms cubic-bezier(0.19, 1, 0.22, 1);
}
.slide-from-bottom-right-exit-done .uxpcore_modal__panel {
  opacity: 0;
}

.slide-from-bottom-left-enter .uxpcore_modal__panel {
  opacity: 0;
  transform: scale(0);
  transform-origin: bottom left;
}
.slide-from-bottom-left-enter-active .uxpcore_modal__panel {
  opacity: 1;
  transform: scale(1);
  transform-origin: bottom left;
  transition: opacity 300ms ease, transform 300ms cubic-bezier(0.19, 1, 0.22, 1);
}
.slide-from-bottom-left-enter-done .uxpcore_modal__panel {
  opacity: 1;
  transform: scale(1);
}
.slide-from-bottom-left-exit .uxpcore_modal__panel {
  opacity: 1;
  transform: scale(1);
  transform-origin: bottom left;
}
.slide-from-bottom-left-exit-active .uxpcore_modal__panel {
  opacity: 0;
  transform: scale(0);
  transform-origin: bottom left;
  transition: opacity 200ms ease, transform 200ms cubic-bezier(0.19, 1, 0.22, 1);
}
.slide-from-bottom-left-exit-done .uxpcore_modal__panel {
  opacity: 0;
}

.uxpcore_modalwizard .uxpcore_modal__body {
  padding: 0;
}

.uxpcore_button {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.5rem;
  margin: 2px;
  border: 1px solid transparent;
  border-radius: 0.5rem;
  background-color: transparent;
  color: inherit;
  cursor: pointer;
  outline: none;
  transition: all 200ms ease-in-out;
}
.uxpcore_button:focus-visible {
  outline: 2px solid var(--focusRingColor);
  outline-offset: 2px;
  border-radius: inherit;
}
.uxpcore_button__icon {
  display: flex;
  align-items: center;
  justify-content: center;
}
.uxpcore_button__text {
  display: inline-block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: 0 0.5rem;
}
.uxpcore_button--primary {
  background-color: var(--primaryButtonBGColor);
  color: var(--primaryButtonTextColor);
  border-color: var(--primaryButtonBorderColor);
}
.uxpcore_button--primary:hover:not(.uxpcore_button--disabled):not(.uxpcore_button--loading) {
  background-color: var(--primaryButtonHoverBGColor);
  color: var(--primaryButtonHoverTextColor);
  border-color: var(--primaryButtonHoverBorderColor);
}
.uxpcore_button--primary:active, .uxpcore_button--primary.uxpcore_button--active {
  background-color: var(--primaryButtonActiveBGColor);
  color: var(--primaryButtonActiveTextColor);
  border-color: var(--primaryButtonActiveBorderColor);
}
.uxpcore_button--secondary {
  background-color: var(--secondaryButtonBGColor);
  color: var(--secondaryButtonTextColor);
  border-color: var(--secondaryButtonBorderColor);
}
.uxpcore_button--secondary:hover:not(.uxpcore_button--disabled):not(.uxpcore_button--loading) {
  background-color: var(--secondaryButtonHoverBGColor);
  color: var(--secondaryButtonHoverTextColor);
  border-color: var(--secondaryButtonHoverBorderColor);
}
.uxpcore_button--secondary:active, .uxpcore_button--secondary.uxpcore_button--active {
  background-color: var(--secondaryButtonActiveBGColor);
  color: var(--secondaryButtonActiveTextColor);
  border-color: var(--secondaryButtonActiveBorderColor);
}
.uxpcore_button--danger {
  background-color: var(--dangerButtonBGColor);
  color: var(--dangerButtonTextColor);
  border-color: var(--dangerButtonBorderColor);
}
.uxpcore_button--danger:hover:not(.uxpcore_button--disabled):not(.uxpcore_button--loading) {
  background-color: var(--dangerButtonHoverBGColor);
  color: var(--dangerButtonHoverTextColor);
  border-color: var(--dangerButtonHoverBorderColor);
}
.uxpcore_button--danger:active, .uxpcore_button--danger.uxpcore_button--active {
  background-color: var(--dangerButtonActiveBGColor);
  color: var(--dangerButtonActiveTextColor);
  border-color: var(--dangerButtonActiveBorderColor);
}
.uxpcore_button--warning {
  background-color: var(--warningButtonBGColor);
  color: var(--warningButtonTextColor);
  border-color: var(--warningButtonBorderColor);
}
.uxpcore_button--warning:hover:not(.uxpcore_button--disabled):not(.uxpcore_button--loading) {
  background-color: var(--warningButtonHoverBGColor);
  color: var(--warningButtonHoverTextColor);
  border-color: var(--warningButtonHoverBorderColor);
}
.uxpcore_button--warning:active, .uxpcore_button--warning.uxpcore_button--active {
  background-color: var(--warningButtonActiveBGColor);
  color: var(--warningButtonActiveTextColor);
  border-color: var(--warningButtonActiveBorderColor);
}
.uxpcore_button--info {
  background-color: var(--infoButtonBGColor);
  color: var(--infoButtonTextColor);
  border-color: var(--infoButtonBorderColor);
}
.uxpcore_button--info:hover:not(.uxpcore_button--disabled):not(.uxpcore_button--loading) {
  background-color: var(--infoButtonHoverBGColor);
  color: var(--infoButtonHoverTextColor);
  border-color: var(--infoButtonHoverBorderColor);
}
.uxpcore_button--info:active, .uxpcore_button--info.uxpcore_button--active {
  background-color: var(--infoButtonActiveBGColor);
  color: var(--infoButtonActiveTextColor);
  border-color: var(--infoButtonActiveBorderColor);
}
.uxpcore_button--success {
  background-color: var(--successButtonBGColor);
  color: var(--successButtonTextColor);
  border-color: var(--successButtonBorderColor);
}
.uxpcore_button--success:hover:not(.uxpcore_button--disabled):not(.uxpcore_button--loading) {
  background-color: var(--successButtonHoverBGColor);
  color: var(--successButtonHoverTextColor);
  border-color: var(--successButtonHoverBorderColor);
}
.uxpcore_button--success:active, .uxpcore_button--success.uxpcore_button--active {
  background-color: var(--successButtonActiveBGColor);
  color: var(--successButtonActiveTextColor);
  border-color: var(--successButtonActiveBorderColor);
}
.uxpcore_button--link {
  background-color: transparent;
  color: var(--accentColor);
  border-color: transparent;
}
.uxpcore_button--link:hover:not(.uxpcore_button--disabled):not(.uxpcore_button--loading) {
  background-color: transparent;
  color: var(--accentColor);
  opacity: 0.8;
}
.uxpcore_button--link:active, .uxpcore_button--link.uxpcore_button--active {
  background-color: transparent;
  color: var(--accentColor);
  opacity: 0.6;
}
.uxpcore_button--icon-only {
  aspect-ratio: 1;
  padding: 0.5rem;
  flex-shrink: 0;
  align-self: center;
}
.uxpcore_button--smaller {
  padding: 0.25rem 0.6rem;
  font-size: 0.8rem;
  border-radius: 0.3rem;
}
.uxpcore_button--smaller .uxpcore_button__icon {
  width: 0.65rem;
  height: 0.65rem;
  font-size: 0.65rem;
}
.uxpcore_button--smaller.uxpcore_button--icon-only {
  padding: 0.2rem;
}
.uxpcore_button--small {
  padding: 0.5rem;
  font-size: 0.9rem;
  border-radius: 0.375rem;
}
.uxpcore_button--small .uxpcore_button__icon {
  width: 0.75rem;
  height: 0.75rem;
  font-size: 0.75rem;
}
.uxpcore_button--small.uxpcore_button--icon-only {
  padding: 0.25rem;
}
.uxpcore_button--large {
  padding: 0.75rem;
  font-size: 1.5rem;
  border-radius: 0.375rem;
}
.uxpcore_button--large .uxpcore_button__icon {
  width: 1.5rem;
  height: 1.5rem;
  font-size: 1.5rem;
}
.uxpcore_button--large.uxpcore_button--icon-only {
  padding: 0.75rem;
}
.uxpcore_button--disabled {
  opacity: 0.6;
  cursor: not-allowed;
  pointer-events: none;
  background-color: var(--disabledBGColor);
  color: var(--disabledTextColor);
}
.uxpcore_button--loading {
  cursor: progress;
}

.uxpcore_dropdown-action-row {
  width: 100%;
  padding: 0.25rem 0.5rem;
  display: flex;
  align-items: center;
  border-top: 1px solid var(--borderColor);
  cursor: pointer;
}
.uxpcore_dropdown-action-row:hover {
  background-color: var(--highlightBGColor);
}
.uxpcore_dropdown-action-row .uxpcore_button {
  flex: 1;
  width: 100%;
  justify-content: center;
  pointer-events: none;
}

.uxpcore_buttongroup {
  display: inline-flex;
  margin: 2px;
  border-radius: 0.5rem;
  overflow: hidden;
}
.uxpcore_buttongroup .uxpcore_button {
  border: none;
  margin: 0;
  border-radius: 0;
}
.uxpcore_buttongroup .uxpcore_button--icon-only {
  align-self: stretch;
}
.uxpcore_buttongroup__item {
  margin: 0;
  border-radius: 0;
  position: relative;
}
.uxpcore_buttongroup__item--dropdown {
  position: relative;
}
.uxpcore_buttongroup--primary {
  border: 1px solid var(--primaryButtonTextColor);
}
.uxpcore_buttongroup--primary .uxpcore_buttongroup__item:not(:last-child)::after {
  content: "";
  position: absolute;
  inset-inline-end: 0;
  width: 1px;
  background-color: var(--primaryButtonTextColor);
  top: 50%;
  height: 60%;
  translate: 0 -50%;
}
.uxpcore_buttongroup--secondary {
  border: 1px solid var(--secondaryButtonTextColor);
}
.uxpcore_buttongroup--secondary .uxpcore_buttongroup__item:not(:last-child)::after {
  content: "";
  position: absolute;
  inset-inline-end: 0;
  width: 1px;
  background-color: var(--secondaryButtonTextColor);
  top: 50%;
  height: 60%;
  translate: 0 -50%;
}
.uxpcore_buttongroup--danger {
  border: 1px solid var(--dangerButtonTextColor);
}
.uxpcore_buttongroup--danger .uxpcore_buttongroup__item:not(:last-child)::after {
  content: "";
  position: absolute;
  inset-inline-end: 0;
  width: 1px;
  background-color: var(--dangerButtonTextColor);
  top: 50%;
  height: 60%;
  translate: 0 -50%;
}
.uxpcore_buttongroup__item--first {
  border-start-start-radius: 0.5rem;
  border-end-start-radius: 0.5rem;
}
.uxpcore_buttongroup__item--last {
  border-start-end-radius: 0.5rem;
  border-end-end-radius: 0.5rem;
}
.uxpcore_buttongroup:hover {
  z-index: 1;
  position: relative;
}
.uxpcore_buttongroup:focus {
  z-index: 2;
  position: relative;
}
.uxpcore_buttongroup .uxpcore_button:focus-visible {
  outline: none;
}
.uxpcore_buttongroup:focus-within {
  outline: 2px solid var(--focusRingColor);
  outline-offset: 2px;
  border-radius: 0.5rem;
}
.uxpcore_buttongroup__dropdown {
  display: flex;
}
.uxpcore_buttongroup__dropdown .uxpcore_dropdown__container {
  display: flex;
}
.uxpcore_buttongroup__dropdown .uxpcore_dropdown__trigger {
  align-items: unset;
  align-self: stretch;
}
.uxpcore_buttongroup__dropdown .uxpcore_dropdown__trigger .uxpcore_button--icon-only {
  align-self: stretch;
}
.uxpcore_buttongroup__dropdown .uxpcore_dropdown__trigger .uxpcore_buttongroup__item {
  border-radius: 0;
}
.uxpcore_buttongroup__dropdown .uxpcore_dropdown__trigger .uxpcore_buttongroup__item.uxpcore_buttongroup__item--first {
  border-start-start-radius: 0.5rem;
  border-end-start-radius: 0.5rem;
}
.uxpcore_buttongroup__dropdown .uxpcore_dropdown__trigger .uxpcore_buttongroup__item.uxpcore_buttongroup__item--last {
  border-start-end-radius: 0.5rem;
  border-end-end-radius: 0.5rem;
}

.uxpcore_confirmbutton {
  width: auto;
  height: auto;
  display: flex;
  align-content: center;
  gap: 0.5rem;
}

.uxpcore_osc__container {
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: relative;
  background-color: var(--primaryBGColor);
}
.uxpcore_osc__content {
  width: 100%;
  height: 100%;
  display: flex;
}
.uxpcore_osc__list_container {
  height: 100%;
  display: flex;
  flex-direction: column;
  transition: all 200ms ease-in-out;
  padding: 1rem 1rem 0 1rem;
}
.uxpcore_osc__list_container--has-details-panel {
  padding: 1rem 0 0 0;
}
.uxpcore_osc__header {
  width: 100%;
  height: 4rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-shrink: 0;
  padding: 0 0.5rem;
}
.uxpcore_osc__summary_container {
  width: 100%;
  flex-shrink: 0;
}
.uxpcore_osc__bulkaction_container {
  width: 100%;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.8rem 0;
}
.uxpcore_osc__bulkaction_container-left {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.uxpcore_osc__bulkaction_container-right {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.uxpcore_osc__search_container {
  padding-inline-start: 1rem;
  padding-inline-end: 1rem;
  flex: 1;
  min-width: 0;
}
.uxpcore_osc__search_container .uxpcore_input {
  width: 100%;
}
.uxpcore_osc__body {
  width: 100%;
  /* Fills remaining space */
  flex: 1 1 auto;
  /* Prevents flex child from growing beyond available space */
  min-height: 0;
  overflow: auto;
  position: relative;
  border: 1px solid var(--borderColor);
  border-radius: 0.6rem;
}
.uxpcore_osc__title_container {
  width: auto;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding: 0.5rem;
}
.uxpcore_osc__title {
  font-weight: var(--fontWeightBold);
  font-size: 1.4rem;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.uxpcore_osc__action_container {
  width: auto;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding-inline-start: 0.8rem;
}
.uxpcore_osc__details_container {
  height: 100%;
  visibility: hidden;
}
.uxpcore_osc__details_container--open {
  visibility: visible;
}
.uxpcore_osc__filters_container {
  width: 100%;
  height: auto;
  padding: 0.5rem;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.uxpcore_osc__filters_container .uxp-form-label {
  padding-inline-end: 1rem !important;
}
.uxpcore_osc__filters_container-input {
  padding: 0 0.5rem;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.uxpcore_osc__filters_container-buttons {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-inline-start: 2rem;
}
.uxpcore_osc__filters_container-button {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0.5rem;
  border-radius: 50rem;
  border: 2px dashed var(--borderColor);
  padding: 0.3rem 0.5rem;
  padding-inline-end: 0.3rem;
  cursor: pointer;
  color: var(--primaryTextColor);
}
.uxpcore_osc__filters_container-button .uxpcore_badge__container .uxpcore_badge__badge {
  background-color: var(--disabledBGColor);
  color: var(--disabledTextColor);
}
.uxpcore_osc__filters_container-button--active {
  border: 2px solid var(--selectedBGColor);
  background-color: var(--selectedBGColor);
  color: var(--selectedTextColor);
}
.uxpcore_osc__filters_container-button--active .uxpcore_badge__container .uxpcore_badge__badge {
  background-color: var(--selectedTextColor);
  color: var(--selectedBGColor);
}

.uxpcore_obsdp__container {
  width: 100%;
  height: 100%;
  overflow: hidden;
  display: flex;
  background: var(--primaryBGColor);
  border-inline-start: 1px solid var(--borderColor);
}
.uxpcore_obsdp__content_container {
  flex: 1;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.uxpcore_obsdp__titile_container {
  width: 100%;
  height: auto;
}
.uxpcore_obsdp__titile_container--title-only {
  padding: 0.8rem;
}
.uxpcore_obsdp__tabs_container {
  width: 100%;
  height: auto;
  display: flex;
  align-items: center;
  padding: 0;
  border-bottom: 1px solid var(--borderColor);
  background-color: var(--primaryButtonBGColor);
  color: var(--primaryButtonTextColor);
  overflow: hidden;
}
.uxpcore_obsdp__tab {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  cursor: pointer;
  transition: all 0.2s ease-in;
  user-select: none;
  border-bottom: 2px solid transparent;
  text-transform: uppercase;
  flex-shrink: 0;
}
.uxpcore_obsdp__tab:hover {
  color: var(--portalHeaderTextColor);
}
.uxpcore_obsdp__tab--active {
  color: var(--portalHeaderTextColor);
  font-weight: var(--fontWeightMedium);
  border-bottom: 2px solid var(--portalHeaderTextColor);
}
.uxpcore_obsdp__tab--hidden {
  display: none;
}
.uxpcore_obsdp__tab-icon {
  width: 1rem;
  height: 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.uxpcore_obsdp__tab-icon svg {
  width: 100%;
  height: 100%;
}
.uxpcore_obsdp__tab-label {
  font-size: 1rem;
  line-height: 1.2;
  white-space: nowrap;
}
.uxpcore_obsdp__overflow_menu {
  min-width: 12rem;
  padding: 0.25rem 0;
}
.uxpcore_obsdp__overflow_item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  cursor: pointer;
  text-transform: uppercase;
  font-size: 0.875rem;
  white-space: nowrap;
}
.uxpcore_obsdp__overflow_item:hover {
  background-color: var(--hoverBGColor);
}
.uxpcore_obsdp__overflow_item--active {
  font-weight: var(--fontWeightMedium);
  color: var(--portalHeaderTextColor);
}
.uxpcore_obsdp__toolbar_container {
  width: 100%;
  min-height: 3.3rem;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  border-bottom: 1px solid var(--borderColor);
  padding: 1px;
}
.uxpcore_obsdp__toolbar_items {
  width: auto;
  display: flex;
  overflow: hidden;
}
.uxpcore_obsdp__toolbar_items-left {
  justify-content: flex-start;
  padding: 0 0.5rem;
}
.uxpcore_obsdp__toolbar_items-right {
  justify-content: flex-end;
}
.uxpcore_obsdp__toolbar_items .uxpcore_dropdown__trigger {
  height: 100%;
  padding: 0;
}
.uxpcore_obsdp__toolbar_items .uxpcore_dropdown__trigger .uxpcore_obsdp__toolbar_item {
  padding: 0.5rem;
  height: 100%;
  box-sizing: border-box;
}
.uxpcore_obsdp__toolbar_item_wrapper {
  display: flex;
  flex-shrink: 0;
}
.uxpcore_obsdp__toolbar_item_wrapper--hidden {
  display: none;
}
.uxpcore_obsdp__toolbar_overflow_btn {
  padding: 0 0.75rem;
  white-space: nowrap;
}
.uxpcore_obsdp__toolbar_item {
  width: auto;
  display: flex;
  align-items: center;
  position: relative;
  padding: 0.5rem;
  cursor: pointer;
}
.uxpcore_obsdp__toolbar_item:before {
  content: "";
  position: absolute;
  width: 1px;
  height: 60%;
  background: var(--borderColor);
  top: 50%;
  right: 0;
  transform: translateY(-50%);
}
.uxpcore_obsdp__toolbar_item-icon {
  width: 2.5rem;
  height: 2.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.uxpcore_obsdp__toolbar_item-icon svg {
  width: 45% !important;
  height: 45%;
}
.uxpcore_obsdp__toolbar_item-label {
  padding-inline-end: 1rem;
}
.uxpcore_obsdp__toolbar_item:hover {
  background-color: var(--secondaryBGColor);
  color: var(--secondaryTextColor);
}
.uxpcore_obsdp__details_container {
  flex: 1;
  display: flex;
  overflow: hidden;
}
.uxpcore_obsdp__main_details_container {
  flex: 1;
  display: flex;
  flex-direction: column;
  overflow-y: auto;
  -ms-overflow-style: none;
  /* IE and Edge */
  scrollbar-width: none;
  /* Firefox */
}
.uxpcore_obsdp__main_details_container::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}
.uxpcore_obsdp__main_details_container--other-only {
  overflow-y: hidden;
}
.uxpcore_obsdp__general_details_container {
  padding: 0.5rem;
}
.uxpcore_obsdp__other_details_container {
  padding: 0.5rem;
  margin-top: 1rem;
  height: auto;
}
.uxpcore_obsdp__other_details_container--full-height {
  margin-top: 0;
  height: 100%;
  overflow-y: auto;
  -ms-overflow-style: none;
  /* IE and Edge */
  scrollbar-width: none;
  /* Firefox */
}
.uxpcore_obsdp__other_details_container--full-height::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}
.uxpcore_obsdp__additional_details_container {
  width: 0;
  height: 100%;
  overflow: hidden;
  background-color: var(--highlightBGColor);
  color: var(--primaryTextColor);
  display: flex;
  flex-direction: column;
  transition: width 220ms ease-in-out;
}
.uxpcore_obsdp__additional_details_container--open {
  width: 20rem;
}
.uxpcore_obsdp__additional_details_notfound {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  font-style: italic;
  color: var(--secondaryTextColor);
}
.uxpcore_obsdp__additional_details_header {
  width: auto;
  display: flex;
  align-items: center;
  background-color: var(--primaryBGColor);
  padding: 0.8rem 0.5rem;
  position: relative;
  flex-shrink: 0;
}
.uxpcore_obsdp__additional_details_header:before {
  content: "";
  position: absolute;
  width: 1px;
  height: 60%;
  background: var(--borderColor);
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}
.uxpcore_obsdp__additional_details_header-icon {
  width: 2.5rem;
  height: 2.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.uxpcore_obsdp__additional_details_header-icon svg {
  width: 60% !important;
  height: 60%;
}
.uxpcore_obsdp__additional_details_header-label {
  flex: 1;
  padding-inline-start: 0.5rem;
  font-size: 1.3rem;
}
.uxpcore_obsdp__additional_details_header-refresh {
  width: 2rem;
  height: 2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  border-radius: 50%;
  color: var(--secondaryTextColor);
  flex-shrink: 0;
}
.uxpcore_obsdp__additional_details_header-refresh svg {
  width: 55% !important;
  height: 55%;
}
.uxpcore_obsdp__additional_details_header-refresh:hover {
  background-color: var(--secondaryBGColor);
  color: var(--primaryTextColor);
}
.uxpcore_obsdp__additional_details_body {
  padding: 0.5rem;
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  -ms-overflow-style: none;
  /* IE and Edge */
  scrollbar-width: none;
  /* Firefox */
}
.uxpcore_obsdp__additional_details_body::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}
.uxpcore_obsdp__gutter_container {
  width: 2.9rem;
  background: var(--primaryBGColor);
  border-left: 1px solid var(--borderColor);
  position: relative;
}
.uxpcore_obsdp__close_btn {
  width: 2.5rem;
  height: 2.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  border-radius: 50%;
  border: 1px solid transparent;
  position: absolute;
  top: 0.5rem;
  left: 50%;
  translate: -50% 0;
}
.uxpcore_obsdp__close_btn svg {
  width: 45% !important;
  height: 45%;
}
.uxpcore_obsdp__close_btn:hover {
  border-color: var(--borderColor);
}
.uxpcore_obsdp__additional_details_tabs {
  width: 100%;
  height: auto;
  left: 0;
  position: absolute;
  top: 20%;
  background-color: var(--primaryBGColor);
  color: var(--primaryTextColor);
  padding-inline-end: 1px;
}
.uxpcore_obsdp__additional_details_tab {
  width: 100%;
  aspect-ratio: 0.75;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 200ms ease-in-out;
  border: 1px solid transparent;
  border-inline-start: none;
  cursor: pointer;
}
.uxpcore_obsdp__additional_details_tab-icon {
  width: 2.5rem;
  height: 2.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.uxpcore_obsdp__additional_details_tab-icon svg {
  width: 60% !important;
  height: 60%;
}
.uxpcore_obsdp__additional_details_tab--active {
  background-color: var(--highlightBGColor);
  color: var(--highlightTextColor);
  border-radius: 0 0.6rem 0.6rem 0;
  border-color: var(--borderColor);
}

.uxpcore_obsdpgd__container {
  width: 100%;
  height: auto;
  padding: 1rem;
  background-color: var(--primaryBGColor);
  color: var(--primaryTextColor);
  font-size: 1.16rem;
}
.uxpcore_obsdpgd__container_title {
  font-weight: var(--fontWeightMedium);
  padding: 1.6rem 0.8rem;
}
.uxpcore_obsdpgd__container::after {
  display: block;
  content: "";
  height: 1px;
  border-bottom: 1px solid var(--borderColor);
  width: 100%;
}
.uxpcore_obsdpgd__grid {
  display: grid;
  gap: 1rem;
}
.uxpcore_obsdpgd__grid--columns-1 {
  grid-template-columns: 1fr;
}
.uxpcore_obsdpgd__grid--columns-2 {
  grid-template-columns: 1fr 1fr;
}
.uxpcore_obsdpgd__grid--columns-3 {
  grid-template-columns: 1fr 1fr 1fr;
}
.uxpcore_obsdpgd__grid--columns-4 {
  grid-template-columns: 1fr 1fr 1fr 1fr;
}
.uxpcore_obsdpgd__field {
  display: grid;
  grid-template-columns: minmax(150px, max-content) auto 1fr;
  align-items: flex-start;
  gap: 0.8rem;
}
.uxpcore_obsdpgd__field_label {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  opacity: 0.6;
}
.uxpcore_obsdpgd__field_label-icon {
  width: 2.5rem;
  height: 2.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.uxpcore_obsdpgd__field_label-icon svg {
  width: 45% !important;
  height: 45%;
}
.uxpcore_obsdpgd__field_label-text {
  padding-inline-start: 0.8rem;
}
.uxpcore_obsdpgd__field_value {
  word-break: break-word;
}
.uxpcore_obsdpgd__field_value--align-start {
  text-align: start;
}
.uxpcore_obsdpgd__field_value--align-end {
  text-align: end;
}
.uxpcore_obsdpgd__field--vertical {
  grid-template-columns: 1fr;
  gap: 0.4rem;
  margin-bottom: 0.8rem;
  align-content: start;
}
.uxpcore_obsdpgd__field--vertical .uxpcore_obsdpgd__field_value {
  padding-inline-start: 0.8rem;
}
.uxpcore_obsdpgd__columns-wrapper {
  display: flex;
  gap: 1rem;
  align-items: flex-start;
  width: 100%;
}
.uxpcore_obsdpgd__column {
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.uxpcore_obsvl__container {
  width: auto;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  cursor: pointer;
}
.uxpcore_obsvl__selected {
  width: auto;
  height: auto;
  display: flex;
  align-items: center;
  color: var(--primaryTextColor);
}
.uxpcore_obsvl__selected-actions {
  width: auto;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  opacity: 0;
  transition: all 200ms ease-in-out;
  padding: 0 0.5rem;
}
.uxpcore_obsvl__selected-actions:hover {
  opacity: 1;
}
.uxpcore_obsvl__selected-actions-button {
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 50%;
  border: 1px solid var(--borderColor);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 2px;
  cursor: pointer;
}
.uxpcore_obsvl__selected-actions-button svg {
  width: 60% !important;
  height: 60%;
}
.uxpcore_obsvl__selected-icon {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 0.3rem;
  border: 1px solid var(--borderColor);
  background-color: var(--primaryBGColor);
  color: var(--primaryTextColor);
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-inline-end: 10px;
}
.uxpcore_obsvl__selected-icon svg {
  width: 70%;
  height: 70%;
}
.uxpcore_obsvl__selected-count {
  position: absolute;
  top: 0;
  right: 0;
  translate: 80% -80%;
}
.uxpcore_obsvl__selected-label {
  width: auto;
  height: auto;
  padding: 0.5rem;
  text-transform: capitalize;
  color: var(--primaryTextColor);
}
.uxpcore_obsvl__selected-dropdownicon {
  width: 1.5rem;
  height: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.uxpcore_obsvl__selected-dropdownicon svg {
  width: 70%;
  height: 70%;
}
.uxpcore_obsvl__views {
  min-width: 16rem;
}
.uxpcore_obsvl__views .uxpcore_collapse__container .uxpcore_collapse__header {
  border: none;
}
.uxpcore_obsvl__views .uxpcore_collapse__container .uxpcore_collapse__header .uxpcore_collapse__header-left .uxpcore_collapse__title {
  text-transform: uppercase;
}
.uxpcore_obsvl__views .uxpcore_collapse__container .uxpcore_collapse__header .uxpcore_collapse__header-left .uxpcore_collapse__icon {
  background-color: transparent;
}
.uxpcore_obsvl__views .uxpcore_collapse__container .uxpcore_collapse__content {
  padding: 0;
  border: none;
}
.uxpcore_obsvl__view-count {
  width: auto;
  min-height: 1.5rem;
  aspect-ratio: 1;
  border-radius: 5rem;
  background-color: var(--portalHeaderBGColor);
  color: var(--portalHeaderTextColor);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.9rem;
}
.uxpcore_obsvl__view {
  width: 100%;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.5rem 0.5rem 0.5rem 2.9rem;
  cursor: pointer;
  transition: all 200ms ease-in-out;
}
.uxpcore_obsvl__view:hover {
  background-color: var(--highlightBGColor);
  color: var(--highlightTextColor);
}
.uxpcore_obsvl__view:hover .uxpcore_obsvl__view-action {
  display: flex;
}
.uxpcore_obsvl__view--selected {
  background-color: var(--selectedBGColor);
  color: var(--selectedTextColor);
}
.uxpcore_obsvl__view--selected .uxpcore_obsvl__view-action {
  display: flex;
}
.uxpcore_obsvl__view--favourite .uxpcore_obsvl__view-action {
  display: flex;
  color: var(--warningStatusTextColor);
  border-color: var(--warningStatusBorderColor);
}
.uxpcore_obsvl__view-label {
  width: 100%;
  flex-grow: 1;
  text-transform: capitalize;
}
.uxpcore_obsvl__view-action {
  width: 1.3rem;
  height: 1.3rem;
  display: none;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  border-radius: 50%;
  border: 1px solid var(--primaryTextColor);
  transition: all 200ms ease-in-out;
}
.uxpcore_obsvl__view-action svg {
  width: 70%;
  height: 70%;
}
.uxpcore_obsvl__search {
  padding: 0.5rem;
}
.uxpcore_obsvl__newview {
  width: 100%;
  height: auto;
  padding: 0.8rem;
  color: var(--accentColor);
  border-top: 1px solid var(--borderColor);
  cursor: pointer;
}
.uxpcore_obsvl__no-results {
  width: 100%;
  height: auto;
  padding: 0.8rem;
}

.uxpcore_obsdph__container {
  width: 100%;
  height: auto;
  display: flex;
  flex-direction: column;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
  color: var(--portalHeaderTextColor);
  background-color: var(--primaryButtonBGColor);
  padding: 0.8rem;
}
.uxpcore_obsdph__container::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(13, 19, 64, 0.75);
}
.uxpcore_obsdph__breadcrumb {
  width: 100%;
  z-index: 1;
  padding-inline-start: 1rem;
}
.uxpcore_obsdph__breadcrumb .uxpcore_breadcrumb__list {
  padding: 0;
}
.uxpcore_obsdph__breadcrumb .uxpcore_breadcrumb__item {
  color: var(--portalHeaderTextColor);
}
.uxpcore_obsdph__breadcrumb .uxpcore_breadcrumb__item--link, .uxpcore_obsdph__breadcrumb .uxpcore_breadcrumb__item--button {
  color: var(--portalHeaderTextColor);
  opacity: 0.8;
}
.uxpcore_obsdph__breadcrumb .uxpcore_breadcrumb__item--link:hover, .uxpcore_obsdph__breadcrumb .uxpcore_breadcrumb__item--button:hover {
  opacity: 1;
}
.uxpcore_obsdph__breadcrumb .uxpcore_breadcrumb__item--active {
  opacity: 0.6;
}
.uxpcore_obsdph__breadcrumb .uxpcore_breadcrumb__separator {
  color: var(--portalHeaderTextColor);
  opacity: 0.6;
}
.uxpcore_obsdph__breadcrumb .uxpcore_breadcrumb__ellipsis {
  color: var(--portalHeaderTextColor);
  opacity: 0.8;
  border: 1px solid rgba(255, 255, 255, 0.25);
}
.uxpcore_obsdph__breadcrumb .uxpcore_breadcrumb__ellipsis:hover {
  opacity: 1;
  background-color: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.5);
}
.uxpcore_obsdph__content {
  width: 100%;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  z-index: 1;
}
.uxpcore_obsdph__left, .uxpcore_obsdph__right {
  width: auto;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.uxpcore_obsdph__left {
  flex-direction: column;
  align-items: flex-start;
  gap: 0.5rem;
  padding-inline-start: 1rem;
}
.uxpcore_obsdph__left a {
  text-decoration: none;
  color: var(--portalHeaderTextColor);
}
.uxpcore_obsdph__left a:focus, .uxpcore_obsdph__left a:visited, .uxpcore_obsdph__left a:active {
  text-decoration: none;
  color: var(--portalHeaderTextColor);
}
.uxpcore_obsdph__title-wrapper {
  display: flex;
  align-items: center;
  gap: 1rem;
}
.uxpcore_obsdph__title {
  font-size: 2rem;
  font-weight: var(--fontWeightSemibold);
  text-transform: capitalize;
}
.uxpcore_obsdph__status {
  display: flex;
  align-items: center;
}
.uxpcore_obsdph__subtitle {
  font-size: 0.875rem;
  opacity: 0.9;
}
.uxpcore_obsdph__analytics {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.uxpcore_obsdph__analytics .uxpcore_analytics_card * {
  color: var(--portalHeaderTextColor);
}

.uxpcore_osc__filterbutton {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 0.5rem;
  border: 1px solid var(--borderColor);
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-inline-end: 0.8rem;
  cursor: pointer;
}
.uxpcore_osc__filterbutton .uxpcore_badge__container {
  width: 100%;
  height: 100%;
}
.uxpcore_osc__filterbutton:hover {
  background-color: var(--highlightBGColor);
  color: var(--highlightTextColor);
}
.uxpcore_osc__filterbutton--active {
  background-color: var(--selectedBGColor);
  color: var(--selectedTextColor);
}
.uxpcore_osc__filterpanel {
  width: 26rem;
}
.uxpcore_osc__filterpanel--has-header .uxpcore_dynamicform {
  padding: 0.4rem 0.8rem 0.2rem;
}

.uxpcore_osc__filter_header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.6rem 0.8rem;
  border-bottom: 1px solid var(--borderColor);
}
.uxpcore_osc__filter_header__label {
  font-size: 0.85rem;
  font-weight: var(--fontWeightSemibold);
  color: var(--textColor);
  letter-spacing: 0.02em;
  flex: 1;
}
.uxpcore_osc__filter_header .uxpcore_select {
  flex-shrink: 0;
}
.uxpcore_osc__filter_mode_pill {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0 0.5rem;
  height: 100%;
  font-size: 0.82rem;
  color: var(--textColor);
  cursor: pointer;
}
.uxpcore_osc__filter_mode_pill__icon {
  width: 1rem;
  height: 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: 0.82rem;
}
.uxpcore_osc__filter_mode_pill .uxpcore_dropdown_indicator {
  margin-inline-start: auto;
}
.uxpcore_osc__filterbutton--advanced {
  border-color: var(--primaryColor);
  color: var(--primaryColor);
}
.uxpcore_osc__advanced_filter {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  padding: 0.6rem 0.8rem 0.8rem;
}
.uxpcore_osc__advanced_filter__textarea {
  width: 100%;
  resize: vertical;
  padding: 0.6rem 0.75rem;
  border: 1px solid var(--borderColor);
  border-radius: 0.5rem;
  background-color: var(--inputBGColor);
  color: var(--textColor);
  line-height: 1.5;
  font-family: inherit;
  box-sizing: border-box;
  outline: none;
  transition: border-color 0.15s ease;
}
.uxpcore_osc__advanced_filter__textarea::placeholder {
  color: var(--placeholderColor, var(--subTextColor));
}
.uxpcore_osc__advanced_filter__textarea:focus {
  border-color: var(--primaryColor);
}
.uxpcore_osc__advanced_filter__error {
  font-size: 0.82rem;
  color: var(--dangerButtonBGColor);
  line-height: 1.4;
}
.uxpcore_osc__advanced_filter__refined {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 0.75rem;
  border: 1px solid var(--primaryColor);
  border-radius: 0.5rem;
  background-color: var(--selectedBGColor);
  color: var(--primaryColor);
  font-size: 0.85rem;
  font-weight: var(--fontWeightMedium);
}
.uxpcore_osc__advanced_filter__refined__icon {
  width: 0.9rem;
  height: 0.9rem;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: 0.9rem;
}
.uxpcore_osc__advanced_filter__unavailable {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.5rem 1rem;
  font-size: 0.9rem;
  color: var(--dangerButtonBGColor);
  text-align: center;
}
.uxpcore_osc__advanced_filter__submit {
  display: flex;
  justify-content: flex-end;
  gap: 0.4rem;
  padding-top: 0.2rem;
}
.uxpcore_osc__advanced_filter__refined_note {
  margin: 0;
  font-size: 0.82rem;
  color: var(--subTextColor);
  line-height: 1.4;
}
.uxpcore_osc__refine_panel {
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
}
.uxpcore_osc__refine_panel__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.75rem 1rem;
  border-bottom: 1px solid var(--borderColor);
  flex-shrink: 0;
  gap: 0.8rem;
}
.uxpcore_osc__refine_panel__title {
  font-size: 1rem;
  font-weight: var(--fontWeightSemibold);
  color: var(--textColor);
  flex: 1;
}
.uxpcore_osc__refine_panel__header-actions {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.uxpcore_osc__refine_panel__error {
  font-size: 0.82rem;
  color: var(--dangerButtonBGColor);
  padding: 0.4rem 1rem 0;
  flex-shrink: 0;
}
.uxpcore_osc__refine_panel__body {
  flex: 1;
  overflow: auto;
}
.uxpcore_osc__refine_panel__unavailable {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  min-height: 200px;
  font-size: 0.9rem;
  color: var(--subTextColor);
}

.uxpcore_actions_list {
  display: flex;
  flex-direction: column;
  gap: 2px;
  width: 100%;
  height: auto;
}
.uxpcore_actions_list .uxpcore_dropdown__container {
  display: block;
}
.uxpcore_actions_list .uxpcore_dropdown__container .uxpcore_dropdown__trigger {
  width: 100%;
}
.uxpcore_actions_list__action {
  padding: 0.5rem;
  cursor: pointer;
  width: 100%;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  margin-bottom: 1px;
  user-select: none;
}
.uxpcore_actions_list__action-icon {
  width: 1.5rem;
  height: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 1rem;
}
.uxpcore_actions_list__action-icon svg {
  width: 80% !important;
  height: 80%;
}
.uxpcore_actions_list__action-text {
  white-space: nowrap;
}
.uxpcore_actions_list__action:hover {
  background-color: var(--highlightBGColor);
  color: var(--highlightTextColor);
}
.uxpcore_actions_list__action--selected {
  background-color: var(--selectedBGColor);
  color: var(--selectedTextColor);
}
.uxpcore_actions_list__action--selected:hover {
  background-color: var(--selectedBGColor);
  color: var(--selectedTextColor);
}

.uxpcore_table__container {
  width: 100%;
  height: 100%;
  overflow: auto;
  position: relative;
  border-radius: 1em;
  border: 1px solid var(--borderColor);
}
.uxpcore_table__table {
  width: 100%;
  height: 100%;
  position: relative;
  min-width: 100%;
  overflow: hidden;
  font-size: 14px;
  display: flex;
  flex-direction: column;
}
.uxpcore_table__header {
  position: relative;
  display: flex;
  border-bottom: 1px solid var(--borderColor);
  font-size: 13px;
  background-color: var(--tableHeaderBGColor);
  height: auto;
  flex-shrink: 0;
}
.uxpcore_table__header:hover .uxpcore_table__header-cell {
  border-right: 1px solid var(--borderColor);
}
.uxpcore_table__header-cell {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.5rem;
  font-weight: var(--fontWeightBold);
  font-size: 1.1rem;
  border-right: 1px solid transparent;
  position: relative;
  flex-shrink: 0;
  white-space: nowrap;
  color: var(--primaryTextColor);
}
.uxpcore_table__header-cell--vertical {
  min-height: 150px;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  align-items: flex-end;
}
.uxpcore_table__header-cell--vertical .uxpcore_table__sort-handle {
  height: 100%;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
}
.uxpcore_table__header-cell--vertical .uxpcore_table__header-celllabel {
  writing-mode: vertical-rl;
  text-orientation: mixed;
  transform: rotate(180deg);
  white-space: wrap;
  max-height: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
}
.uxpcore_table__resize-handle {
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  width: 10px;
  cursor: col-resize;
  user-select: none;
}
.uxpcore_table__resize-handle:hover {
  background-color: var(--inputActiveBorderColor);
}
.uxpcore_table__sort-handle {
  position: relative;
  width: auto;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  cursor: pointer;
  user-select: none;
}
.uxpcore_table__sort-handle-content {
  padding-inline-end: 1rem;
}
.uxpcore_table__sort-handle-indicator {
  width: 1.5rem;
  height: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 1rem;
}
.uxpcore_table__sort-handle-indicator svg {
  width: 80% !important;
  height: 80%;
}
.uxpcore_table__body {
  width: 100%;
  min-height: 0;
  flex: 1 1 auto;
  position: relative;
  overflow-y: auto;
  overflow-x: hidden;
}
.uxpcore_table__noitems {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  color: var(--secondaryTextColor);
}
.uxpcore_table__actions {
  width: auto;
  height: auto;
  position: relative;
}
.uxpcore_table__actions-label {
  width: 1.5rem;
  height: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--borderColor);
  border-radius: 0.5rem;
  cursor: pointer;
}
.uxpcore_table__actions-label svg {
  width: 70% !important;
  height: 70%;
}
.uxpcore_table__actions-actionbtn {
  width: 1.5rem;
  height: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--borderColor);
  border-radius: 50%;
  cursor: pointer;
  transform: scale(0);
  transition: transform 200ms ease-in-out;
}
.uxpcore_table__actions-actionbtn svg {
  width: 70% !important;
  height: 70%;
}
.uxpcore_table__actions-sortaction {
  justify-content: space-between;
  user-select: none;
}
.uxpcore_table__actions-sortaction--active {
  background-color: var(--selectedBGColor);
  color: var(--selectedTextColor);
}

.uxpcore_table__row {
  background-color: var(--primaryBGColor);
  color: var(--primaryTextColor);
  border-bottom: 1px solid var(--borderColor);
}
.uxpcore_table__row:hover {
  background-color: var(--highlightBGColor);
}
.uxpcore_table__row:hover .uxpcore_table__actions-actionbtn {
  transform: scale(1);
}
.uxpcore_table__row--selected {
  background-color: var(--tableSelectedRowBGColor) !important;
}
.uxpcore_table__row_content {
  display: flex;
}
.uxpcore_table__row_cell {
  padding: 0.8rem 0.5rem;
  display: flex;
  align-items: center;
  flex-shrink: 0;
  color: var(--primaryTextColor);
}

.uxpcore_dropdown__trigger--active .uxpcore_table__actions-actionbtn {
  transform: scale(1);
}
.uxpcore_dropdown__trigger--active .uxpcore_table__actions-actionlist-action {
  background-color: var(--highlightBGColor);
  color: var(--highlightTextColor);
}

.uxpcore_tablecomponent__wrapper {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.uxpcore_tablecomponent__container {
  width: 100%;
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  position: relative;
  background-color: var(--primaryBGColor);
  border-radius: 8px;
  border: 1px solid var(--borderColor);
  box-shadow: 0px 1px 2px 0px var(--boxShadowColor);
}
.uxpcore_tablecomponent__toolbar {
  width: 100%;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.uxpcore_tablecomponent__toolbar-left {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0.5rem;
}
.uxpcore_tablecomponent__toolbar-right {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.5rem;
}
.uxpcore_tablecomponent__search {
  display: flex;
  align-items: center;
}
.uxpcore_tablecomponent__body {
  width: 100%;
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden;
  /* where you have a table inside, we don't want a double border */
}
.uxpcore_tablecomponent__body > .uxpcore_table__container {
  border: none;
  border-radius: 0px;
}
.uxpcore_tablecomponent__addnew {
  flex-shrink: 0;
  border-top: 1px solid var(--borderColor);
  padding: 0.8rem 1rem;
}

.uxpcore_treeview__container {
  width: 100%;
  height: 100%;
  position: relative;
}
.uxpcore_treeview__tree {
  width: auto;
  height: auto;
  overflow: auto;
  position: relative;
}
.uxpcore_treeview__noitems {
  padding: 20px;
  text-align: center;
  color: var(--treeViewLabelTextColor);
  opacity: 0.6;
}
.uxpcore_treeview__node-container {
  width: auto;
  padding: 0;
  position: relative;
}
.uxpcore_treeview__node-icon-container {
  width: 20px;
  height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 8px;
  flex-shrink: 0;
}
.uxpcore_treeview__node-icon-container svg {
  width: 60%;
  height: 60%;
}
.uxpcore_treeview__node-icon {
  width: 100%;
  height: 100%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 90%;
}
.uxpcore_treeview__node-head {
  width: auto;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  position: relative;
}
.uxpcore_treeview__node {
  width: var(--treeViewNodeSize);
  aspect-ratio: 1;
  background-color: transparent;
  color: var(--treeViewNodeIconColor);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 200ms ease-in-out;
  cursor: pointer;
  margin-right: 4px;
  position: relative;
  border-radius: 50%;
  flex-shrink: 0;
}
.uxpcore_treeview__node:hover {
  background-color: rgba(0, 0, 0, 0.05);
}
.uxpcore_treeview__node--end {
  cursor: default;
}
.uxpcore_treeview__node--end:hover {
  background-color: transparent;
}
.uxpcore_treeview__node--no-icon {
  width: 8px;
  margin-right: 8px;
}
.uxpcore_treeview__node-label-container {
  padding: 4px 10px;
  cursor: pointer;
  border-radius: var(--treeViewLabelBorderRadius);
  background-color: var(--treeViewLabelBGColor);
  color: var(--treeViewLabelTextColor);
  position: relative;
  display: flex;
  align-items: center;
  flex-grow: 1;
  transition: all 200ms ease-in-out;
}
.uxpcore_treeview__node-label-container--inline {
  justify-content: flex-start;
  gap: 8px;
}
.uxpcore_treeview__select_input {
  width: 15px;
  aspect-ratio: 1;
  margin-right: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.uxpcore_treeview__select_input input[type=checkbox] {
  margin: 0;
}
.uxpcore_treeview__node-label {
  white-space: nowrap;
}
.uxpcore_treeview__node-details-container {
  padding: 8px 4px 8px 40px;
  position: relative;
}
.uxpcore_treeview__node-body {
  width: auto;
  height: auto;
  position: relative;
}
.uxpcore_treeview__children-loading-container {
  max-width: 200px;
  max-height: 100px;
  position: relative;
}
.uxpcore_treeview__children {
  width: auto;
  height: auto;
  padding-left: var(--treeViewIndent);
  position: relative;
}
.uxpcore_treeview__content {
  width: auto;
  height: auto;
}
.uxpcore_treeview__header {
  width: 100%;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.uxpcore_treeview__title {
  width: auto;
  height: auto;
  padding: 10px;
}
.uxpcore_treeview__search {
  width: auto;
  height: auto;
  padding: 10px;
}
.uxpcore_treeview__add-root-node {
  width: auto;
  height: auto;
  padding: 10px;
  white-space: nowrap;
  cursor: pointer;
}
.uxpcore_treeview__node-actions {
  width: auto;
  height: auto;
  align-items: center;
  justify-content: space-between;
  padding: 0 5px;
  display: flex;
  visibility: hidden;
}
.uxpcore_treeview__node-actions--show {
  display: flex;
}
.uxpcore_treeview__node-action-btn {
  width: 20px;
  aspect-ratio: 1;
  border-radius: 50%;
  background-color: var(--treeViewLabelBGColor);
  color: var(--treeViewLabelTextColor);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 4px;
  cursor: pointer;
}
.uxpcore_treeview__node-action-btn svg {
  width: 70%;
  height: 70%;
}
.uxpcore_treeview--primary {
  background-color: var(--accentColor);
  color: white;
}
.uxpcore_treeview--danger {
  background-color: var(--dangerColor);
  color: white;
}
.uxpcore_treeview__drop-line {
  position: absolute;
  left: 0;
  right: 0;
  height: 3px;
  background-color: transparent;
  pointer-events: none;
  z-index: 2;
  transition: all 150ms ease-in-out;
}
.uxpcore_treeview__drop-line--active {
  background-color: var(--accentColor);
  box-shadow: 0 0 8px var(--accentColor), 0 0 4px var(--accentColor);
}
.uxpcore_treeview__drop-line--before {
  top: -2px;
}
.uxpcore_treeview__drop-line--after {
  bottom: -2px;
  top: auto;
}
.uxpcore_treeview__drop-line--child {
  bottom: -2px;
  top: auto;
  left: var(--treeViewIndent);
  background-color: transparent;
}
.uxpcore_treeview__drop-line--child.uxpcore_treeview__drop-line--active {
  background-color: var(--accentColor);
}
.uxpcore_treeview__drop-line--child.uxpcore_treeview__drop-line--active::before {
  content: "↳";
  position: absolute;
  left: -16px;
  top: -8px;
  color: var(--accentColor);
  font-size: 14px;
}

.uxpcore_treeview__node-label-container:hover {
  background-color: var(--treeViewLabelHoverBGColor);
  color: var(--treeViewLabelHoverTextColor);
}
.uxpcore_treeview__node-label-container:hover .uxpcore_treeview__node-actions {
  visibility: visible;
}
.uxpcore_treeview__node-label-container:hover .uxpcore_treeview__node-actions .uxpcore_treeview__node-action-btn {
  background-color: var(--treeViewLabelHoverBGColor);
  color: var(--treeViewLabelHoverTextColor);
  border-color: var(--treeViewLabelHoverTextColor);
}

.uxpcore_treeview__node-container--selected > .uxpcore_treeview__node-head > .uxpcore_treeview__node-label-container {
  background-color: var(--treeViewLabelSelectedBGColor);
  color: var(--treeViewLabelSelectedTextColor);
}

.uxpcore_treeview__node .uxpcore_treeview__node-icon-container {
  margin: 0;
}

.uxpcore_treeview__container--show-path .uxpcore_treeview__children {
  margin-left: var(--treeViewChildrenMarginLeft);
  position: relative;
}
.uxpcore_treeview__container--show-path .uxpcore_treeview__node-container--child {
  position: relative;
}
.uxpcore_treeview__container--show-path .uxpcore_treeview__node-container--child::before {
  content: "";
  position: absolute;
  width: var(--treeViewPathWidth);
  background-color: var(--treeViewPathColor);
  left: calc(var(--treeViewIndent) * -1);
  top: 0;
  height: 100%;
  z-index: 0;
}
.uxpcore_treeview__container--show-path .uxpcore_treeview__node-container--child::after {
  content: "";
  position: absolute;
  width: var(--treeViewHorizontalConnectorLength);
  height: var(--treeViewPathWidth);
  background-color: var(--treeViewPathColor);
  left: calc(var(--treeViewIndent) * -1);
  top: var(--treeViewConnectorOffset);
  z-index: 1;
}
.uxpcore_treeview__container--show-path .uxpcore_treeview__node-container--child.uxpcore_treeview__node-container--first-child::before {
  top: 0;
  height: 100%;
}
.uxpcore_treeview__container--show-path .uxpcore_treeview__node-container--child.uxpcore_treeview__node-container--last-child::before {
  top: 0;
  height: var(--treeViewConnectorOffset);
}

.uxpcore_treeview__container--horizontal-roots .uxpcore_treeview__tree {
  display: flex;
}
.uxpcore_treeview__container--horizontal-roots .uxpcore_treeview__tree .uxpcore_treeview__node-container--root {
  margin-right: 20px;
}

.uxpcore_treeview__node-container--disabled::before, .uxpcore_treeview__node-container--disabled::after {
  opacity: 0.5;
}
.uxpcore_treeview__node-container--disabled > .uxpcore_treeview__node-head {
  opacity: 0.5;
}
.uxpcore_treeview__node-container--disabled > .uxpcore_treeview__node-head > .uxpcore_treeview__node-label-container {
  cursor: not-allowed;
  opacity: 0.5;
}
.uxpcore_treeview__node-container--disabled > .uxpcore_treeview__node-head > .uxpcore_treeview__node-label-container:hover {
  background-color: var(--treeViewDisabledBGColor);
  color: var(--treeViewDisabledTextColor);
  opacity: 0.5;
}
.uxpcore_treeview__node-container--disabled > .uxpcore_treeview__node-body > .uxpcore_treeview__node-details-container {
  cursor: not-allowed;
  opacity: 0.5;
}
.uxpcore_treeview__node-container--disabled > .uxpcore_treeview__node-body > .uxpcore_treeview__children {
  cursor: not-allowed;
}

.uxpcore_treeview__node-label-container--draggable {
  cursor: grab;
  user-select: none;
}
.uxpcore_treeview__node-label-container--draggable:active {
  cursor: grabbing;
}

.uxpcore_treeview__node-container--drop-target-valid > .uxpcore_treeview__node-head {
  border: 2px solid #00ff00;
  background-color: rgba(0, 255, 0, 0.05);
  border-radius: 0.5rem;
}

.uxpcore_treeview__node-container--drop-target-invalid > .uxpcore_treeview__node-head {
  border: 2px solid #ff0000;
  background-color: rgba(255, 0, 0, 0.05);
  border-radius: 0.5rem;
}

.uxpcore_treeview__drag-overlay {
  width: auto;
  height: auto;
  padding: 8px 12px;
  background-color: var(--treeViewLabelBGColor);
  color: var(--treeViewLabelTextColor);
  border: 1px solid var(--treeViewNodeBorderColor);
  border-radius: var(--treeViewLabelBorderRadius);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  opacity: 0.9;
  cursor: grabbing;
  transform: translate(0, -50%);
  transform-origin: top left;
}

.uxpcore_treeview__drag-overlay-content {
  display: flex;
  align-items: center;
  gap: 8px;
}

.uxpcore_treeview__drag-overlay-label {
  white-space: nowrap;
  font-weight: var(--fontWeightMedium);
}

.uxpcore_treeview__reordering-loading {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.1);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
  pointer-events: all;
  cursor: wait;
}

.uxpcore_treeview__drop-zone:not(.uxpcore_treeview__node-head),
.uxpcore_treeview__drop-zone:not(.uxpcore_treeview__node-head) {
  width: 100%;
  height: 24px;
  background: rgba(33, 150, 243, 0.05);
  border-radius: 4px;
  transition: all 150ms ease-in-out;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}

.uxpcore_treeview__drop-zone--active {
  background: rgba(33, 150, 243, 0.2);
  border: 2px solid #2196F3;
  box-shadow: 0 0 8px rgba(33, 150, 243, 0.4);
}

.uxpcore_pagination__container {
  width: auto;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.uxpcore_pagination__count {
  padding: 0.3rem 0.6rem;
  border-radius: 0.4rem;
  cursor: pointer;
  font-size: 12px;
  color: var(--primaryTextColor);
  background-color: var(--primaryBGColor);
  user-select: none;
}
.uxpcore_pagination__count:hover {
  background-color: var(--highlightBGColor);
  color: var(--highlightTextColor);
}
.uxpcore_pagination__pagesize-title {
  padding: 0.5rem;
  opacity: 0.6;
  font-size: 11px;
  text-transform: capitalize;
}
.uxpcore_pagination__pagesize {
  padding: 0.5rem;
  cursor: pointer;
  font-size: 12px;
}
.uxpcore_pagination__pagesize:hover {
  background-color: var(--highlightBGColor);
  color: var(--highlightTextColor);
}
.uxpcore_pagination__pagesize--active {
  background-color: var(--selectedBGColor);
  color: var(--selectedTextColor);
}
.uxpcore_pagination__button {
  height: 25px;
  width: auto;
  min-width: 25px;
  border-radius: 4px;
  border: none;
  outline: none;
  margin: 0 2px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--secondaryBGColor);
  color: var(--secondaryTextColor);
  cursor: pointer;
  transition: background-color 0.3s, color 0.3s, opacity 0.3s;
  user-select: none;
}
.uxpcore_pagination__button:hover:not(:disabled) {
  background-color: var(--secondaryTextColor);
  color: var(--secondaryBGColor);
  opacity: 0.5;
}
.uxpcore_pagination__button:disabled {
  opacity: 0.3;
  cursor: not-allowed;
  pointer-events: none;
}

.uxpcore_itemcard {
  position: relative;
  width: 100%;
  height: auto;
  min-height: 48px;
  background-color: transparent;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
}
.uxpcore_itemcard__image {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.uxpcore_itemcard__content {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.uxpcore_itemcard__title {
  font-size: 1rem;
  font-weight: var(--fontWeightBold);
  color: var(--primaryTextColor);
  overflow-wrap: break-word;
  word-break: break-word;
}
.uxpcore_itemcard__subtitle {
  font-size: 0.9rem;
  color: var(--secondaryTextColor);
  overflow-wrap: break-word;
  word-break: break-word;
}
.uxpcore_itemcard--placeholder .uxpcore_itemcard__content {
  min-width: 110px;
  height: 48px;
  position: relative;
}
.uxpcore_itemcard--placeholder .uxpcore_itemcard__content::before {
  content: "";
  width: 80px;
  height: 16px;
  border-radius: 8px;
  background-color: var(--loaderPrimaryColor);
  position: absolute;
  top: 8px;
}
.uxpcore_itemcard--placeholder .uxpcore_itemcard__content::after {
  content: "";
  width: 100px;
  height: 12px;
  border-radius: 6px;
  background-color: var(--loaderPrimaryColor);
  position: absolute;
  top: 28px;
}

.uxpcore_infocard {
  width: 100%;
  height: auto;
}
.uxpcore_infocard__layout {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  width: 100%;
}
.uxpcore_infocard--collapsed .uxpcore_infocard__layout {
  align-items: flex-start;
}
.uxpcore_infocard--collapsed .uxpcore_infocard__avatar {
  order: 2;
  flex-shrink: 0;
}
.uxpcore_infocard--collapsed .uxpcore_infocard__body {
  order: 1;
}
.uxpcore_infocard__avatar {
  flex-shrink: 0;
}
.uxpcore_infocard__body {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}
.uxpcore_infocard__body--skeleton {
  min-width: 110px;
  height: 48px;
  position: relative;
}
.uxpcore_infocard__body--skeleton::before {
  content: "";
  width: 80px;
  height: 14px;
  border-radius: 7px;
  background-color: var(--loaderPrimaryColor);
  position: absolute;
  top: 6px;
}
.uxpcore_infocard__body--skeleton::after {
  content: "";
  width: 110px;
  height: 11px;
  border-radius: 5px;
  background-color: var(--loaderPrimaryColor);
  position: absolute;
  top: 27px;
}
.uxpcore_infocard__field {
  font-size: 0.875rem;
  line-height: 1.4;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 0.3rem;
}
.uxpcore_infocard__field--primary {
  font-weight: var(--fontWeightSemibold);
  font-size: 1rem;
  color: var(--primaryTextColor);
}
.uxpcore_infocard__field--secondary {
  color: var(--secondaryTextColor);
}
.uxpcore_infocard__field--muted {
  font-size: 0.8rem;
  color: var(--secondaryTextColor);
  opacity: 0.7;
}
.uxpcore_infocard__field--italic {
  font-style: italic;
  color: var(--secondaryTextColor);
}
.uxpcore_infocard__field--link {
  color: var(--primaryButtonBGColor);
  cursor: pointer;
}
.uxpcore_infocard__field--link:hover {
  text-decoration: underline;
}
.uxpcore_infocard__field--clickable {
  cursor: pointer;
}
.uxpcore_infocard__side {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: 0.375rem;
}
.uxpcore_infocard__badges {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  flex-wrap: wrap;
}
.uxpcore_infocard__badges--inline {
  margin-top: 0.25rem;
}
.uxpcore_infocard__actions {
  display: flex;
  align-items: center;
  gap: 0.25rem;
}
.uxpcore_infocard__details {
  min-width: 10rem;
  max-width: 25rem;
}

.uxpcore_infocardgroup {
  width: auto;
  height: auto;
  display: inline-block;
}
.uxpcore_infocardgroup__stack {
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.uxpcore_infocardgroup__stack-item {
  position: relative;
}
.uxpcore_infocardgroup__stack-item:not(:first-of-type) {
  margin-inline-start: -5%;
}
.uxpcore_infocardgroup__dropdown {
  min-width: 250px;
  max-width: 350px;
  display: flex;
  flex-direction: column;
  background-color: var(--primaryBGColor);
  border-radius: 8px;
}
.uxpcore_infocardgroup__items {
  max-height: 400px;
  overflow-y: auto;
  padding: 0;
}
.uxpcore_infocardgroup__items::-webkit-scrollbar {
  width: 6px;
}
.uxpcore_infocardgroup__items::-webkit-scrollbar-track {
  background: transparent;
}
.uxpcore_infocardgroup__items::-webkit-scrollbar-thumb {
  background: var(--secondaryBGColor);
  border-radius: 3px;
}
.uxpcore_infocardgroup__items::-webkit-scrollbar-thumb:hover {
  background: var(--tertiaryBGColor);
}
.uxpcore_infocardgroup__item {
  border-radius: 6px;
  transition: background-color 0.15s ease;
}
.uxpcore_infocardgroup__item:hover {
  background-color: var(--hoverBGColor);
}
.uxpcore_infocardgroup__item .uxpcore_itemcard {
  padding: 8px;
}
.uxpcore_infocardgroup__item-wrapper {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
}
.uxpcore_infocardgroup__item-wrapper .uxpcore_itemcard {
  flex: 1;
}
.uxpcore_infocardgroup__remove-btn {
  flex-shrink: 0;
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 50%;
  background-color: var(--dangerButtonBGColor);
  color: var(--dangerButtonTextColor);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.15s ease;
  border: none;
}
.uxpcore_infocardgroup__remove-btn:hover {
  background-color: var(--dangerButtonHoverBGColor);
  color: var(--dangerButtonHoverTextColor);
}
.uxpcore_infocardgroup__footer {
  padding: 0.5rem;
  border-top: 1px solid var(--secondaryBGColor);
  display: flex;
  justify-content: center;
}
.uxpcore_infocardgroup__add-btn {
  width: 100%;
}
.uxpcore_infocardgroup__details {
  min-width: 15rem;
  max-width: 25rem;
}

.uxpcore_datalist__container {
  position: relative;
  width: 100%;
  height: 100%;
  background-color: var(--primaryBGColor);
  border: none;
  margin: 0;
  padding: 0;
}
.uxpcore_datalist__container .uxpcore_datalist,
.uxpcore_datalist__container .uxpcore_datalist__list {
  position: relative;
  width: 100%;
  height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  background-color: var(--primaryBGColor);
  border: none;
  margin: 0;
  padding: 0;
}
.uxpcore_datalist__container .uxpcore_datalist .end-of-content,
.uxpcore_datalist__container .uxpcore_datalist__list .end-of-content {
  margin-bottom: 20px;
}
.uxpcore_datalist__container .uxpcore_datalist .uxpcore_datalist__item,
.uxpcore_datalist__container .uxpcore_datalist__list .uxpcore_datalist__item {
  width: 100%;
  height: auto;
  border: 0.3px solid transparent;
  border-top: 0.3px solid var(--borderColor);
  color: var(--primaryTextColor);
}
.uxpcore_datalist__container .uxpcore_datalist__footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  height: auto;
  padding: 0;
  background-color: var(--primaryBGColor);
  display: flex;
  align-items: center;
}
.uxpcore_datalist__container .uxpcore_datalist__footer .uxpcore_datalist__scroll-btn {
  position: relative;
  width: 100%;
  height: auto;
  min-height: 25px;
  background-color: var(--secondaryBGColor);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 20px;
}
.uxpcore_datalist__container .uxpcore_datalist__footer .uxpcore_datalist__scroll-btn:hover {
  background-color: var(--secondaryBGColor);
  opacity: 0.8;
}
.uxpcore_datalist__container .uxpcore_datalist__footer.has-both .uxpcore_datalist__scroll-btn {
  justify-content: flex-start;
}
.uxpcore_datalist__container .uxpcore_datalist__footer.has-both .uxpcore_datalist__scroll-btn.uxpcore_datalist__scroll-btn--up {
  justify-content: flex-end;
}
.uxpcore_datalist__container .uxpcore_datalist__footer .uxpcore_datalist__go-up-btn-container {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  box-sizing: border-box;
  height: 120px;
  background-color: var(--primaryBGColor);
  opacity: 0.85;
  display: flex;
  align-items: center;
  justify-content: center;
}
.uxpcore_datalist__container.has-footer {
  padding-bottom: 40px;
}
.uxpcore_datalist__container .uxpcore_datalist__loading {
  width: 100%;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  bottom: 20px;
}

.uxpcore_datatable__container {
  position: relative;
  width: 100%;
  height: 100%;
  background-color: var(--primaryBGColor);
  border: none;
  margin: 0;
  padding: 0;
}
.uxpcore_datatable__container .uxpcore_datatable__list {
  position: relative;
  width: 100%;
  height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  background-color: var(--primaryBGColor);
  border: none;
  margin: 0;
  padding: 0;
}
.uxpcore_datatable__container .uxpcore_datatable__list .uxpcore_datatable {
  width: 100%;
  border: 0;
  border-collapse: collapse;
  background-color: var(--primaryBGColor);
}
.uxpcore_datatable__container .uxpcore_datatable__list .uxpcore_datatable tr {
  border-bottom: 1px solid var(--borderColor);
  border-top: 1px solid var(--borderColor);
  position: relative;
  color: var(--primaryTextColor);
}
.uxpcore_datatable__container .uxpcore_datatable__list .uxpcore_datatable tr td {
  z-index: 0;
  background-color: transparent;
  color: var(--primaryTextColor);
}
.uxpcore_datatable__container .uxpcore_datatable__list .uxpcore_datatable tr:last-child {
  border-bottom: transparent;
}
.uxpcore_datatable__container .uxpcore_datatable__list .uxpcore_datatable tr.active {
  background-color: var(--selectedBGColor);
}
.uxpcore_datatable__container .uxpcore_datatable__list .uxpcore_datatable thead tr {
  background-color: var(--tableHeaderBGColor);
  position: relative;
}
.uxpcore_datatable__container .uxpcore_datatable__list .uxpcore_datatable thead tr th {
  padding: 15px 10px;
  font-size: 12px;
  font-weight: var(--fontWeightBold);
  position: sticky;
  top: -1px;
  z-index: 1;
  background-color: var(--tableHeaderBGColor);
  text-transform: capitalize;
  box-shadow: 0px 1px 1px 0px var(--boxShadowColor);
  color: var(--primaryTextColor);
}
.uxpcore_datatable__container .uxpcore_datatable__list .end-of-content {
  margin-bottom: 20px;
}
.uxpcore_datatable__container .uxpcore_datatable__footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  height: auto;
  padding: 0;
  background-color: var(--primaryBGColor);
  display: flex;
  align-items: center;
}
.uxpcore_datatable__container .uxpcore_datatable__footer .uxpcore_datatable__scroll-btn {
  position: relative;
  width: 100%;
  height: auto;
  min-height: 25px;
  background-color: var(--secondaryBGColor);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 20px;
}
.uxpcore_datatable__container .uxpcore_datatable__footer .uxpcore_datatable__scroll-btn:hover {
  background-color: var(--secondaryBGColor);
  opacity: 0.8;
}
.uxpcore_datatable__container .uxpcore_datatable__footer.has-both .uxpcore_datatable__scroll-btn {
  justify-content: flex-start;
}
.uxpcore_datatable__container .uxpcore_datatable__footer.has-both .uxpcore_datatable__scroll-btn.uxpcore_datatable__scroll-btn--up {
  justify-content: flex-end;
}
.uxpcore_datatable__container .uxpcore_datatable__footer .uxpcore_datatable__go-up-btn-container {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  box-sizing: border-box;
  height: 120px;
  background-color: var(--primaryBGColor);
  opacity: 0.85;
  display: flex;
  align-items: center;
  justify-content: center;
}
.uxpcore_datatable__container.has-footer {
  padding-bottom: 40px;
}
.uxpcore_datatable__container .uxpcore_datatable__loading {
  width: 100%;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  bottom: 20px;
}

.uxpcore_datagrid {
  width: 100%;
  height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  background-color: var(--primaryBGColor);
  padding: 0px 0px;
  display: flex;
  align-items: stretch;
  flex-wrap: wrap;
}
.uxpcore_datagrid .uxpcore_datagrid__column {
  width: auto;
  height: auto;
  display: flex;
  align-items: center;
  border: 1px solid var(--borderColor);
  color: var(--primaryTextColor);
}

.uxpcore_hscrolllist__container {
  position: relative;
  width: 100%;
  height: 100%;
  background-color: var(--primaryBGColor);
  border: none;
  margin: 0;
  padding: 0 30px;
  box-sizing: border-box;
}
.uxpcore_hscrolllist__container * {
  box-sizing: border-box;
  /* Hide scrollbar */
}
.uxpcore_hscrolllist__container *::-webkit-scrollbar {
  display: none;
}
.uxpcore_hscrolllist__container .uxpcore_hscrolllist__items {
  position: relative;
  width: 100%;
  height: 100%;
  overflow-y: hidden;
  overflow-x: auto;
  background-color: var(--primaryBGColor);
  border: none;
  margin: 0;
  padding: 0;
  display: flex;
  align-items: stretch;
  justify-content: flex-start;
}
.uxpcore_hscrolllist__container .uxpcore_hscrolllist__items .uxpcore_hscrolllist__item {
  width: auto;
  height: auto;
  min-width: 100px;
  min-height: 100px;
  background-color: transparent;
  padding: 15px 10px;
  flex-shrink: 0;
  color: var(--primaryTextColor);
}
.uxpcore_hscrolllist__container .uxpcore_hscrolllist__controller {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-color: var(--secondaryBGColor);
  position: absolute;
  cursor: pointer;
  color: var(--primaryTextColor);
  border: 1px solid var(--borderColor);
}
.uxpcore_hscrolllist__container .uxpcore_hscrolllist__controller:hover {
  background-color: var(--primaryBGColor);
  box-shadow: 0 0 8px 2px var(--boxShadowColor);
}
.uxpcore_hscrolllist__container .uxpcore_hscrolllist__controller.uxpcore_hscrolllist__controller--prev {
  top: 50%;
  left: 0;
  transform: translate(50%, -50%);
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJmZWF0aGVyIGZlYXRoZXItY2hldnJvbi1sZWZ0Ij48cG9seWxpbmUgcG9pbnRzPSIxNSAxOCA5IDEyIDE1IDYiPjwvcG9seWxpbmU+PC9zdmc+");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 50%;
}
.uxpcore_hscrolllist__container .uxpcore_hscrolllist__controller.uxpcore_hscrolllist__controller--next {
  top: 50%;
  right: 0;
  transform: translate(-50%, -50%);
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJmZWF0aGVyIGZlYXRoZXItY2hldnJvbi1yaWdodCI+PHBvbHlsaW5lIHBvaW50cz0iOSAxOCAxNSAxMiA5IDYiPjwvcG9seWxpbmU+PC9zdmc+");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 50%;
}

.uxpcore_itemlistcard {
  position: relative;
  width: 100%;
  height: auto;
  min-height: 60px;
  background-color: var(--primaryBGColor);
  border-radius: 10px;
  overflow: hidden;
}
.uxpcore_itemlistcard .uxpcore_itemlistcard__header {
  width: 100%;
  height: auto;
  padding: 10px 15px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background-color: var(--primaryBGColor);
}
.uxpcore_itemlistcard .uxpcore_itemlistcard__header .uxpcore_itemlistcard__title {
  text-transform: uppercase;
  font-size: 11px;
  font-weight: var(--fontWeightBold);
  margin-right: 40px;
  color: var(--primaryTextColor);
}
.uxpcore_itemlistcard .uxpcore_itemlistcard__body {
  width: 100%;
  height: auto;
  padding: 10px 15px;
}
.uxpcore_itemlistcard .uxpcore_itemlistcard__body .uxpcore_itemlistcard__field {
  width: 100%;
  height: auto;
  padding: 5px 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.uxpcore_itemlistcard .uxpcore_itemlistcard__body .uxpcore_itemlistcard__field .uxpcore_itemlistcard__label {
  margin-right: 20px;
  text-transform: uppercase;
  font-size: 10px;
  color: var(--secondaryTextColor);
}
.uxpcore_itemlistcard .uxpcore_itemlistcard__body .uxpcore_itemlistcard__field .uxpcore_itemlistcard__value {
  font-size: 12px;
  color: var(--primaryTextColor);
}

.uxpcore_sortablelist {
  width: 100%;
  height: auto;
  background-color: var(--primaryBGColor);
  color: var(--primaryTextColor);
}

/**
 * Base input styles for all UXP input components (v5)
 * Provides consistent container sizing, states, and modifiers
 *
 * Component-specific styles (input elements, triggers, indicators)
 * should be in their own files (_input.scss, _select.scss, etc.)
 */
.uxpcore_input {
  width: auto;
  min-width: 8rem;
  max-width: 33rem;
  height: auto;
  position: relative;
  display: block;
  border: none;
  outline: none;
}
.uxpcore_input--full-width {
  width: 100%;
  min-width: unset;
  max-width: unset;
}
.uxpcore_input--inline {
  display: inline-flex;
}
.uxpcore_input--disabled {
  opacity: 0.6;
  cursor: not-allowed;
  pointer-events: none;
}
.uxpcore_input--disabled * {
  cursor: not-allowed;
}
.uxpcore_input--readonly {
  cursor: default;
}
.uxpcore_input__clear-btn {
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  align-self: center;
  color: var(--secondaryTextColor);
  transition: color 0.2s ease;
  width: 2rem;
  height: 2rem;
  flex-shrink: 0;
  background: transparent;
  border: none;
  outline: none;
  padding: 0;
}
.uxpcore_input__clear-btn:hover {
  color: var(--primaryTextColor);
}
.uxpcore_input__clear-btn svg {
  width: 50%;
  height: 50%;
}
.uxpcore_input__clear-btn--textarea {
  position: absolute;
  top: 0.35rem;
  right: 0.35rem;
  z-index: 1;
  width: 1.5rem;
  height: 1.5rem;
}
.uxpcore_input--textarea {
  position: relative;
}

.uxpcore_input {
  display: flex;
  align-items: stretch;
  position: relative;
  border-radius: 0.4rem;
  border: 1px solid var(--inputBorderColor);
  background-color: var(--inputBGColor);
  transition: border-color 0.2s ease, background-color 0.2s ease;
  overflow: hidden;
}
.uxpcore_input:hover:not(.uxpcore_input--disabled):not(.uxpcore_input--readonly) {
  background-color: var(--inputHoverBGColor);
  border-color: var(--inputHoverBorderColor);
}
.uxpcore_input--focus:not(.uxpcore_input--invalid):not(.uxpcore_input--valid) {
  background-color: var(--inputFocusBGColor);
  border-color: var(--inputFocusBorderColor);
}
.uxpcore_input--has-content {
  background-color: var(--inputActiveBGColor);
  border-color: var(--inputActiveBorderColor);
}
.uxpcore_input--valid {
  background-color: var(--inputValidBGColor);
  border-color: var(--inputValidBorderColor);
}
.uxpcore_input--valid .uxpcore_input__input {
  color: var(--inputValidTextColor);
}
.uxpcore_input--valid.uxpcore_input--focus {
  border-color: var(--inputValidBorderColor);
  background-color: var(--inputValidBGColor);
}
.uxpcore_input--invalid {
  background-color: var(--inputInvalidBGColor);
  border-color: var(--inputInvalidBorderColor);
}
.uxpcore_input--invalid .uxpcore_input__input {
  color: var(--inputInvalidTextColor);
}
.uxpcore_input--invalid.uxpcore_input--focus {
  border-color: var(--inputInvalidBorderColor);
  background-color: var(--inputInvalidBGColor);
}
.uxpcore_input--disabled {
  background-color: var(--inputDisabledBGColor);
  border-color: var(--inputBorderColor);
  opacity: 0.6;
  cursor: not-allowed;
}
.uxpcore_input--readonly {
  background-color: var(--inputReadonlyBGColor);
  border-color: var(--inputReadonlyBorderColor);
  cursor: default;
}
.uxpcore_input__input {
  flex: 1;
  width: 100%;
  height: auto;
  padding: 0.7rem 1rem;
  border: none;
  border-radius: 0;
  outline: none;
  background-color: transparent;
  color: var(--inputTextColor);
  font-size: 1rem;
  font-family: "Inter", "Noto Sans Arabic", sans-serif !important;
}
.uxpcore_input__input::placeholder {
  color: var(--inputTextColor);
  opacity: 0.6;
}
.uxpcore_input__input:focus {
  outline: none;
  box-shadow: none;
}
.uxpcore_input__input:disabled {
  color: var(--inputDisabledTextColor);
  cursor: not-allowed;
}
.uxpcore_input__input:read-only {
  cursor: default;
}
.uxpcore_input__prefix {
  display: flex;
  align-items: center;
  padding: 0 0.75rem;
  padding-left: 1rem;
  color: var(--secondaryTextColor);
  font-size: 1rem;
  font-family: "Inter", "Noto Sans Arabic", sans-serif !important;
  background-color: transparent;
  white-space: nowrap;
}
.uxpcore_input__prefix--separator {
  padding: 0;
  background-color: var(--secondaryBGColor);
  border-right: 1px solid var(--inputBorderColor);
}
.uxpcore_input__suffix {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0 0.75rem;
  padding-right: 1rem;
  color: var(--secondaryTextColor);
  font-size: 1rem;
  font-family: "Inter", "Noto Sans Arabic", sans-serif !important;
  background-color: transparent;
}
.uxpcore_input__suffix--separator {
  padding: 0;
  background-color: var(--secondaryBGColor);
  border-left: 1px solid var(--inputBorderColor);
}
.uxpcore_input__slot-content {
  display: flex;
  align-items: center;
  height: 100%;
  padding: 0 0.75rem;
  white-space: nowrap;
}
.uxpcore_input__prefix--separator .uxpcore_input__slot-content {
  padding-left: 1rem;
}
.uxpcore_input__suffix--separator .uxpcore_input__slot-content {
  padding-right: 1rem;
}
.uxpcore_input--has-prefix .uxpcore_input__input {
  padding-left: 0.5rem;
}
.uxpcore_input--has-suffix .uxpcore_input__input {
  padding-right: 0.5rem;
}
.uxpcore_input__addon-trigger {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0 0.75rem;
  height: 100%;
  cursor: pointer;
  white-space: nowrap;
  color: var(--primaryTextColor);
  font-size: 0.9rem;
  user-select: none;
  transition: background-color 0.15s ease;
}
.uxpcore_input__addon-trigger:hover {
  background-color: var(--inputHoverBGColor);
}
.uxpcore_input__password-toggle {
  background-color: transparent;
  border: none;
  outline: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--secondaryTextColor);
  transition: color 0.2s ease;
  padding: 0 !important;
  width: 1.5rem;
  height: 1.5rem;
}
.uxpcore_input__password-toggle:hover:not(:disabled) {
  color: var(--primaryTextColor);
}
.uxpcore_input__password-toggle:disabled {
  cursor: not-allowed;
  opacity: 0.5;
}
.uxpcore_input__password-toggle svg {
  width: 100%;
  height: 100%;
}

[dir=rtl] .uxpcore_input__prefix {
  padding-left: 0.75rem;
  padding-right: 1rem;
}
[dir=rtl] .uxpcore_input__prefix--separator {
  border-right: none;
  border-left: 1px solid var(--inputBorderColor);
}
[dir=rtl] .uxpcore_input__suffix {
  padding-right: 0.75rem;
  padding-left: 1rem;
}
[dir=rtl] .uxpcore_input__suffix--separator {
  border-left: none;
  border-right: 1px solid var(--inputBorderColor);
}
[dir=rtl] .uxpcore_input__prefix--separator [dir=rtl] .uxpcore_input__slot-content {
  padding-left: 0.75rem;
  padding-right: 1rem;
}
[dir=rtl] .uxpcore_input__suffix--separator [dir=rtl] .uxpcore_input__slot-content {
  padding-right: 0.75rem;
  padding-left: 1rem;
}
[dir=rtl] .uxpcore_input.uxpcore_input--has-prefix .uxpcore_input__input {
  padding-left: 1rem;
  padding-right: 0.5rem;
}
[dir=rtl] .uxpcore_input.uxpcore_input--has-suffix .uxpcore_input__input {
  padding-right: 1rem;
  padding-left: 0.5rem;
}

.uxpcore_autocomplete__suggestions {
  display: flex;
  flex-direction: column;
  max-height: 12rem;
  overflow-y: auto;
}
.uxpcore_autocomplete__suggestion-item {
  padding: 0.5rem 0.75rem;
  color: var(--primaryTextColor);
  font-size: 1rem;
  font-family: "Inter", "Noto Sans Arabic", sans-serif !important;
  cursor: pointer;
  transition: background 0.15s ease;
}
.uxpcore_autocomplete__suggestion-item:hover, .uxpcore_autocomplete__suggestion-item--active {
  background-color: var(--highlightBGColor);
  color: var(--highlightTextColor);
}
.uxpcore_autocomplete__suggestion-item--selected {
  background-color: var(--selectedBGColor);
  color: var(--selectedTextColor);
}

.uxpcore_form-field {
  width: 100%;
  height: auto;
  padding: 0.5rem 1rem;
  box-sizing: border-box;
  color: var(--primaryTextColor);
  display: block;
}
.uxpcore_form-field--inline {
  width: auto;
  display: inline-block;
}
.uxpcore_form-field--no-padding {
  padding: 0;
}
.uxpcore_form-field--no-margin {
  margin: 0;
}
.uxpcore_form-field--margin-bottom-only {
  margin: 0;
  margin-bottom: 1rem;
}
.uxpcore_form-field * {
  box-sizing: border-box;
}

.uxpcore_form-label {
  width: auto;
  height: auto;
  padding: 0.5rem 0;
  font-size: 1rem;
  display: block;
  margin: 0;
  color: var(--primaryTextColor);
}
.uxpcore_form-label--inline {
  display: inline-block;
  margin: 0;
  margin-right: 1.5rem;
}
.uxpcore_form-label .uxpcore_form-label__icon,
.uxpcore_form-label .uxp-form-label__icon {
  display: inline-block;
  margin-right: 0.5rem;
  font-size: 1.167rem;
}

[dir=rtl] .uxpcore_form-label .uxpcore_form-label__icon,
[dir=rtl] .uxpcore_form-label .uxp-form-label__icon,
[dir=rtl] label.uxp-form-label .uxpcore_form-label__icon,
[dir=rtl] label.uxp-form-label .uxp-form-label__icon {
  margin-right: unset;
  margin-left: 0.5rem;
}
[dir=rtl] .uxpcore_form-label--inline,
[dir=rtl] label.uxp-form-label--inline {
  margin-right: unset;
  margin-left: 1.5rem;
}

.uxpcore_form-feedback {
  width: 100%;
  height: auto;
  padding: 0.4rem 0 1rem 0;
  color: var(--inputActiveTextColor);
  opacity: 0.7;
}
.uxpcore_form-feedback--valid {
  color: var(--inputValidBorderColor);
  opacity: 1;
}
.uxpcore_form-feedback--invalid {
  color: var(--inputInvalidBorderColor);
  opacity: 1;
}

.uxpcore_select {
  position: relative;
}
.uxpcore_select .uxpcore_input--select {
  cursor: pointer;
  user-select: none;
}
.uxpcore_select .uxpcore_input--select:hover, .uxpcore_select .uxpcore_input--select.uxpcore_input--focus {
  background-color: var(--secondaryBGColor);
  box-shadow: 0 0.125rem 0.375rem 0 rgba(0, 0, 0, 0.12);
}
.uxpcore_select .uxpcore_input--select:focus-visible {
  background-color: var(--inputFocusBGColor);
  border-color: var(--inputFocusBorderColor);
  outline: none;
}
.uxpcore_select .uxpcore_input__value {
  flex: 1;
  width: 100%;
  padding: 0.7rem 1rem;
  color: var(--inputTextColor);
  font-size: 1rem;
  font-family: "Inter", "Noto Sans Arabic", sans-serif !important;
  display: flex;
  align-items: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.uxpcore_select .uxpcore_input__value:empty::before {
  content: attr(data-placeholder);
  color: var(--inputTextColor);
  opacity: 0.6;
}
.uxpcore_select .uxpcore_input--has-prefix .uxpcore_input__value {
  padding-left: 0.5rem;
}
.uxpcore_select .uxpcore_input--has-suffix .uxpcore_input__value {
  padding-right: 0.5rem;
}
.uxpcore_select--pill {
  min-width: unset;
}
.uxpcore_select--pill .uxpcore_input--select {
  background-color: var(--secondaryBGColor);
  color: var(--secondaryTextColor);
  border: none;
}
.uxpcore_select__dropdown {
  width: auto;
  max-width: 20rem;
  background-color: var(--secondaryBGColor);
  border-radius: 0.625rem;
  box-shadow: 0 0.125rem 0.375rem 0 rgba(0, 0, 0, 0.12);
  overflow: hidden;
  padding: 0 !important;
}
.uxpcore_select__search {
  width: 100% !important;
  padding: 0;
}
.uxpcore_select__search .search-box-container {
  width: 100% !important;
  border-radius: 0;
}
.uxpcore_select__dropdown-list {
  position: relative;
  min-height: 1.875rem;
  max-height: 12.5rem;
  overflow: auto;
}
.uxpcore_select__dropdown-list .end-of-content {
  padding: 0.625rem;
}
.uxpcore_select__option {
  width: 100%;
  padding: 0;
  border: 1px solid rgba(0, 0, 0, 0.01);
  cursor: pointer;
}
.uxpcore_select__option:hover, .uxpcore_select__option--highlighted {
  background-color: var(--highlightBGColor);
  color: var(--highlightTextColor);
}
.uxpcore_select__option--selected {
  background-color: var(--selectedBGColor);
  color: var(--selectedTextColor);
}
.uxpcore_select__option-content {
  padding: 0.5rem;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.uxpcore_select__option-content--has-icon {
  padding: 0.188rem 0.313rem;
}
.uxpcore_select__option-content--has-icon .uxpcore_select__option-icon {
  width: 1.875rem;
  aspect-ratio: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1rem;
  padding: 0.25rem;
}
.uxpcore_select__option-content--has-icon .uxpcore_select__option-icon .image-icon {
  width: 100%;
  height: 100%;
}
.uxpcore_select__option-content--has-icon .uxpcore_select__option-icon .image-icon .icon {
  width: 100%;
  height: 100%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}
.uxpcore_select__option-content--has-icon .uxpcore_select__option-label {
  padding: 0.75rem 0.625rem;
}
.uxpcore_select__option-icon {
  margin-right: 0.5rem;
}
.uxpcore_select__option-label {
  flex: 1;
}
.uxpcore_select__dropdown-footer {
  width: 100%;
  padding: 0.625rem;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
}
.uxpcore_select__dropdown-footer > .uxp-button {
  margin: 0.25rem;
}
.uxpcore_select__dropdown-footer > .uxp-button.done:hover {
  background-color: var(--primaryButtonHoverBGColor);
  color: var(--primaryButtonHoverTextColor);
}

[dir=rtl] .uxpcore_select .uxpcore_input--has-prefix .uxpcore_input__value {
  padding-left: 1rem;
  padding-right: 0.5rem;
}
[dir=rtl] .uxpcore_select .uxpcore_input--has-suffix .uxpcore_input__value {
  padding-right: 1rem;
  padding-left: 0.5rem;
}
[dir=rtl] .uxpcore_select__option-icon {
  margin-right: unset;
  margin-left: 0.5rem;
}
[dir=rtl] .uxpcore_select__option-content--has-icon .uxpcore_select__option-label {
  padding-right: 0.625rem;
  padding-left: unset;
}

body.uxp-glass-theme .uxpcore_select__dropdown {
  backdrop-filter: blur(6.25rem);
}

.uxpcore_multiselect {
  position: relative;
}
.uxpcore_multiselect .uxpcore_input--multiselect {
  cursor: pointer;
  user-select: none;
}
.uxpcore_multiselect .uxpcore_input--multiselect:hover, .uxpcore_multiselect .uxpcore_input--multiselect.uxpcore_input--focus {
  background-color: var(--secondaryBGColor);
  box-shadow: 0 0.125rem 0.375rem 0 rgba(0, 0, 0, 0.12);
}
.uxpcore_multiselect .uxpcore_input--multiselect:focus-visible {
  background-color: var(--inputFocusBGColor);
  border-color: var(--inputFocusBorderColor);
  outline: none;
}
.uxpcore_multiselect .uxpcore_input__value-multi {
  flex: 1;
  width: 100%;
  padding: 0.5rem 1rem;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  min-height: 2.5rem;
}
.uxpcore_multiselect .uxpcore_input__value-multi .selected {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  width: 100%;
}
.uxpcore_multiselect .uxpcore_input__value-multi .selected.wrapped {
  flex-wrap: nowrap;
  overflow-x: auto;
}
.uxpcore_multiselect .uxpcore_input__value-multi .selected span {
  padding: 0.313rem;
}
.uxpcore_multiselect .uxpcore_input__value-multi .selected .sel-opt {
  display: flex;
  align-items: center;
  padding: 0.25rem 0.625rem;
  padding-right: 0.25rem;
  border-radius: 3.125rem;
  background-color: var(--selectedBGColor);
  margin: 0.125rem;
  position: relative;
}
.uxpcore_multiselect .uxpcore_input__value-multi .selected .sel-opt .text {
  font-size: 0.688rem;
}
.uxpcore_multiselect .uxpcore_input__value-multi .selected .sel-opt .close {
  background-color: var(--secondaryBGColor);
  border-radius: 3.125rem;
  width: 1rem;
  height: 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: 0.625rem;
  font-size: 0.688rem;
  cursor: pointer;
}
.uxpcore_multiselect .uxpcore_input--has-suffix .uxpcore_input__value-multi {
  padding-right: 0.5rem;
}
.uxpcore_multiselect__custom-trigger {
  cursor: pointer;
}
.uxpcore_multiselect__custom-trigger:focus-visible {
  outline: 2px solid var(--inputFocusBorderColor);
  outline-offset: 2px;
}

.uxpcore_select__dropdown--multi .uxpcore_select__option--select-all {
  border-bottom: 1px solid var(--borderColor);
}
.uxpcore_select__dropdown--multi .uxpcore_select__option-content {
  display: flex;
  align-items: center;
  padding: 0.35rem 0.75rem 0.35rem 0.5rem;
}
.uxpcore_select__dropdown--multi .uxpcore_select__option-content .uxp-form-checkbox {
  margin-right: 0.5rem;
}
.uxpcore_select__dropdown--multi .uxpcore_select__option-content--has-icon .uxpcore_select__option-icon {
  margin-left: 0.5rem;
}
.uxpcore_select__dropdown--multi .uxpcore_select__dropdown-footer {
  padding: 0.4rem 0.5rem;
  gap: 0.3rem;
}

[dir=rtl] .uxpcore_multiselect .uxpcore_input--has-suffix .uxpcore_input__value-multi {
  padding-right: 1rem;
  padding-left: 0.5rem;
}
[dir=rtl] .uxpcore_multiselect .uxpcore_input__value-multi .selected .sel-opt {
  padding-left: 0.625rem;
  padding-right: 0.25rem;
}
[dir=rtl] .uxpcore_multiselect .uxpcore_input__value-multi .selected .sel-opt .close {
  margin-left: unset;
  margin-right: 0.625rem;
}
[dir=rtl] .uxpcore_select__dropdown--multi .uxpcore_select__option-content {
  padding-left: 1.563rem;
  padding-right: 0.625rem;
}
[dir=rtl] .uxpcore_select__dropdown--multi .uxpcore_select__option-content .uxp-form-checkbox {
  margin-right: unset;
  margin-left: 0.625rem;
}
[dir=rtl] .uxpcore_select__dropdown--multi .uxpcore_select__option-content--has-icon .uxpcore_select__option-icon {
  margin-left: unset;
  margin-right: 0.625rem;
}

/**
 * SearchBox modifiers for Input component
 * Relies on Input's base styles from _inputs_base.scss and _input.scss
 * Only defines SearchBox-specific overrides
 */
.uxpcore_input.uxpcore_searchbox--collapsed {
  width: 2.5rem;
  height: 2.5rem;
  min-width: 2.5rem;
  max-width: 2.5rem;
  min-height: 2.5rem;
  border-radius: 50%;
  cursor: pointer;
  transition: all 200ms ease-out;
}
.uxpcore_input.uxpcore_searchbox--collapsed .uxpcore_input__input {
  width: 0;
  padding: 0;
  opacity: 0;
  transition: opacity 200ms ease-out;
}
.uxpcore_input.uxpcore_searchbox--collapsed .uxpcore_input__suffix {
  display: none;
}
.uxpcore_input.uxpcore_searchbox--collapsed .uxpcore_input__prefix {
  padding: 0;
  width: 100%;
  justify-content: center;
}

.uxpcore_input.uxpcore_searchbox--right.uxpcore_searchbox--collapsed {
  transform-origin: left center;
}

.uxpcore_input.uxpcore_searchbox--left.uxpcore_searchbox--collapsed {
  transform-origin: right center;
}

.uxpcore_input.uxpcore_searchbox--collapsed.uxpcore_searchbox--expanded {
  width: auto;
  height: auto;
  min-width: 8rem;
  max-width: 33rem;
  border-radius: 0.4rem;
  cursor: default;
}
.uxpcore_input.uxpcore_searchbox--collapsed.uxpcore_searchbox--expanded .uxpcore_input__input {
  flex: 1;
  padding: 0.7rem 0.5rem;
  opacity: 1;
}
.uxpcore_input.uxpcore_searchbox--collapsed.uxpcore_searchbox--expanded .uxpcore_input__suffix {
  display: flex;
}
.uxpcore_input.uxpcore_searchbox--collapsed.uxpcore_searchbox--expanded .uxpcore_input__prefix {
  padding: 0 0.75rem;
  padding-left: 1rem;
  width: auto;
  justify-content: flex-start;
}

.uxpcore_searchbox__wrapper {
  display: inline-block;
}
.uxpcore_searchbox__wrapper--expanded {
  display: block;
}

.uxpcore_searchbox__close-button,
.uxpcore_searchbox__clear-button {
  cursor: pointer;
  display: flex;
  align-items: center;
}

.uxpcore_datepicker {
  position: relative;
}
.uxpcore_datepicker .uxpcore_input--datepicker {
  cursor: pointer;
  user-select: none;
}
.uxpcore_datepicker .uxpcore_input--datepicker:hover, .uxpcore_datepicker .uxpcore_input--datepicker.uxpcore_input--focus {
  background-color: var(--secondaryBGColor);
  box-shadow: 0 0.125rem 0.375rem 0 rgba(0, 0, 0, 0.12);
}
.uxpcore_datepicker .uxpcore_input--datepicker:focus-visible {
  background-color: var(--inputFocusBGColor);
  border-color: var(--inputFocusBorderColor);
  outline: none;
}
.uxpcore_datepicker .uxpcore_input__value {
  flex: 1;
  width: 100%;
  padding: 0.7rem 1rem;
  color: var(--inputTextColor);
  font-size: 1rem;
  font-family: "Inter", "Noto Sans Arabic", sans-serif !important;
  display: flex;
  align-items: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.uxpcore_datepicker .uxpcore_input--has-prefix .uxpcore_input__value {
  padding-left: 0.5rem;
}
.uxpcore_datepicker .uxpcore_input--has-suffix .uxpcore_input__value {
  padding-right: 0.5rem;
}
.uxpcore_datepicker__dropdown {
  width: 20rem;
  min-width: 20rem;
  max-width: 20rem;
  background-color: var(--secondaryBGColor);
  border-radius: 0.5rem;
  overflow: hidden;
  padding: 0 !important;
}
.uxpcore_datepicker__dropdown-content {
  display: flex;
  flex-direction: column;
  width: 100%;
}
.uxpcore_datepicker__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.625rem 0.75rem;
  border-bottom: 1px solid var(--borderColor);
}
.uxpcore_datepicker__title {
  font-size: 0.875rem;
  font-weight: var(--fontWeightSemibold);
  color: var(--primaryTextColor);
}
.uxpcore_datepicker__toggle-input {
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  color: var(--secondaryTextColor);
  transition: color 0.2s ease;
  border-radius: 0.25rem;
}
.uxpcore_datepicker__toggle-input:hover {
  color: var(--primaryTextColor);
  background-color: var(--highlightBGColor);
}
.uxpcore_datepicker__toggle-input svg {
  width: 1rem;
  height: 1rem;
}
.uxpcore_datepicker__input-container {
  padding: 0.625rem 0.75rem;
  border-bottom: 1px solid var(--borderColor);
}
.uxpcore_datepicker__footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: 0.625rem 0.75rem;
  border-top: 1px solid var(--borderColor);
}
.uxpcore_datepicker__done-btn {
  padding: 0.5rem 1rem;
  border: none;
  border-radius: 0.375rem;
  background-color: var(--primaryButtonBGColor);
  color: var(--primaryButtonTextColor);
  font-size: 0.875rem;
  font-weight: var(--fontWeightMedium);
  cursor: pointer;
  transition: background-color 0.2s ease;
}
.uxpcore_datepicker__done-btn:hover {
  background-color: var(--primaryButtonHoverBGColor);
}
.uxpcore_datepicker__done-btn:active {
  transform: scale(0.98);
}

[dir=rtl] .uxpcore_datepicker .uxpcore_input--has-prefix .uxpcore_input__value {
  padding-left: 1rem;
  padding-right: 0.5rem;
}
[dir=rtl] .uxpcore_datepicker .uxpcore_input--has-suffix .uxpcore_input__value {
  padding-right: 1rem;
  padding-left: 0.5rem;
}

body.uxp-glass-theme .uxpcore_datepicker__dropdown {
  backdrop-filter: blur(6.25rem);
}

.uxpcore_daterangepicker {
  position: relative;
}
.uxpcore_daterangepicker .uxpcore_input--daterangepicker {
  cursor: pointer;
  user-select: none;
}
.uxpcore_daterangepicker .uxpcore_input--daterangepicker:hover, .uxpcore_daterangepicker .uxpcore_input--daterangepicker.uxpcore_input--focus {
  background-color: var(--secondaryBGColor);
  box-shadow: 0 0.125rem 0.375rem 0 rgba(0, 0, 0, 0.12);
}
.uxpcore_daterangepicker .uxpcore_input--daterangepicker:focus-visible {
  background-color: var(--inputFocusBGColor);
  border-color: var(--inputFocusBorderColor);
  outline: none;
}
.uxpcore_daterangepicker .uxpcore_input__value {
  flex: 1;
  width: 100%;
  padding: 0.7rem 1rem;
  color: var(--inputTextColor);
  font-size: 1rem;
  font-family: "Inter", "Noto Sans Arabic", sans-serif !important;
  display: flex;
  align-items: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.uxpcore_daterangepicker .uxpcore_input--has-prefix .uxpcore_input__value {
  padding-left: 0.5rem;
}
.uxpcore_daterangepicker .uxpcore_input--has-suffix .uxpcore_input__value {
  padding-right: 0.5rem;
}
.uxpcore_daterangepicker__dropdown {
  width: 20rem;
  min-width: 20rem;
  max-width: 20rem;
  background-color: var(--secondaryBGColor);
  border-radius: 0.5rem;
  overflow: hidden;
  padding: 0 !important;
}
.uxpcore_daterangepicker__dropdown-content {
  display: flex;
  flex-direction: column;
  width: 100%;
}
.uxpcore_daterangepicker__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.625rem 0.75rem;
  border-bottom: 1px solid var(--borderColor);
}
.uxpcore_daterangepicker__title {
  font-size: 0.875rem;
  font-weight: var(--fontWeightSemibold);
  color: var(--primaryTextColor);
}
.uxpcore_daterangepicker__toggle-input {
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  color: var(--secondaryTextColor);
  transition: color 0.2s ease;
  border-radius: 0.25rem;
}
.uxpcore_daterangepicker__toggle-input:hover {
  color: var(--primaryTextColor);
  background-color: var(--highlightBGColor);
}
.uxpcore_daterangepicker__toggle-input svg {
  width: 1rem;
  height: 1rem;
}
.uxpcore_daterangepicker__presets {
  display: flex;
  gap: 0.5rem;
  padding: 0.625rem 0.75rem;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.uxpcore_daterangepicker__presets::-webkit-scrollbar {
  display: none;
}
.uxpcore_daterangepicker__preset-btn {
  flex-shrink: 0;
  padding: 0.375rem 0.75rem;
  border: 1px solid var(--borderColor);
  border-radius: 0.375rem;
  background-color: transparent;
  color: var(--secondaryTextColor);
  font-size: 0.875rem;
  font-family: "Inter", "Noto Sans Arabic", sans-serif !important;
  cursor: pointer;
  transition: all 0.2s ease;
  white-space: nowrap;
}
.uxpcore_daterangepicker__preset-btn:hover {
  background-color: var(--highlightBGColor);
  border-color: var(--primaryTextColor);
  color: var(--primaryTextColor);
}
.uxpcore_daterangepicker__preset-btn.active {
  background-color: var(--primaryButtonBGColor);
  border-color: var(--primaryButtonBGColor);
  color: var(--primaryButtonTextColor);
}
.uxpcore_daterangepicker__input-container {
  padding: 0.625rem 0.75rem;
  border-bottom: 1px solid var(--borderColor);
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
.uxpcore_daterangepicker__footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: 0.625rem 0.75rem;
  border-top: 1px solid var(--borderColor);
}
.uxpcore_daterangepicker__done-btn {
  padding: 0.5rem 1rem;
  border: none;
  border-radius: 0.375rem;
  background-color: var(--primaryButtonBGColor);
  color: var(--primaryButtonTextColor);
  font-size: 0.875rem;
  font-weight: var(--fontWeightMedium);
  cursor: pointer;
  transition: background-color 0.2s ease;
}
.uxpcore_daterangepicker__done-btn:hover {
  background-color: var(--primaryButtonHoverBGColor);
}
.uxpcore_daterangepicker__done-btn:active {
  transform: scale(0.98);
}

[dir=rtl] .uxpcore_daterangepicker .uxpcore_input--has-prefix .uxpcore_input__value {
  padding-left: 1rem;
  padding-right: 0.5rem;
}
[dir=rtl] .uxpcore_daterangepicker .uxpcore_input--has-suffix .uxpcore_input__value {
  padding-right: 1rem;
  padding-left: 0.5rem;
}

body.uxp-glass-theme .uxpcore_daterangepicker__dropdown {
  backdrop-filter: blur(6.25rem);
}

.uxpcore_timepicker {
  position: relative;
}
.uxpcore_timepicker .uxpcore_input--timepicker {
  cursor: pointer;
  user-select: none;
}
.uxpcore_timepicker .uxpcore_input--timepicker:hover, .uxpcore_timepicker .uxpcore_input--timepicker.uxpcore_input--focus {
  background-color: var(--secondaryBGColor);
  box-shadow: 0 0.125rem 0.375rem 0 rgba(0, 0, 0, 0.12);
}
.uxpcore_timepicker .uxpcore_input--timepicker:focus-visible {
  background-color: var(--inputFocusBGColor);
  border-color: var(--inputFocusBorderColor);
  outline: none;
}
.uxpcore_timepicker .uxpcore_input__value {
  flex: 1;
  width: 100%;
  padding: 0.7rem 1rem;
  color: var(--inputTextColor);
  font-size: 1rem;
  font-family: "Inter", "Noto Sans Arabic", sans-serif !important;
  display: flex;
  align-items: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.uxpcore_timepicker .uxpcore_input--has-prefix .uxpcore_input__value {
  padding-left: 0.5rem;
}
.uxpcore_timepicker .uxpcore_input--has-suffix .uxpcore_input__value {
  padding-right: 0.5rem;
}
.uxpcore_timepicker__dropdown {
  width: 15rem;
  min-width: 15rem;
  max-width: 15rem;
  background-color: var(--secondaryBGColor);
  border-radius: 0.5rem;
  overflow: hidden;
  padding: 0 !important;
}
.uxpcore_timepicker__dropdown-content {
  display: flex;
  flex-direction: column;
  width: 100%;
}
.uxpcore_timepicker__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.625rem 0.75rem;
  border-bottom: 1px solid var(--borderColor);
}
.uxpcore_timepicker__title {
  font-size: 0.875rem;
  font-weight: var(--fontWeightSemibold);
  color: var(--primaryTextColor);
}
.uxpcore_timepicker__toggle-input {
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  color: var(--secondaryTextColor);
  transition: color 0.2s ease;
  border-radius: 0.25rem;
}
.uxpcore_timepicker__toggle-input:hover {
  color: var(--primaryTextColor);
  background-color: var(--highlightBGColor);
}
.uxpcore_timepicker__toggle-input svg {
  width: 1rem;
  height: 1rem;
}
.uxpcore_timepicker__input-container {
  padding: 0.625rem 0.75rem;
  border-bottom: 1px solid var(--borderColor);
}
.uxpcore_timepicker__footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: 0.625rem 0.75rem;
  border-top: 1px solid var(--borderColor);
}
.uxpcore_timepicker__done-btn {
  padding: 0.5rem 1rem;
  border: none;
  border-radius: 0.375rem;
  background-color: var(--primaryButtonBGColor);
  color: var(--primaryButtonTextColor);
  font-size: 0.875rem;
  font-weight: var(--fontWeightMedium);
  cursor: pointer;
  transition: background-color 0.2s ease;
}
.uxpcore_timepicker__done-btn:hover {
  background-color: var(--primaryButtonHoverBGColor);
}
.uxpcore_timepicker__done-btn:active {
  transform: scale(0.98);
}

[dir=rtl] .uxpcore_timepicker .uxpcore_input--has-prefix .uxpcore_input__value {
  padding-left: 1rem;
  padding-right: 0.5rem;
}
[dir=rtl] .uxpcore_timepicker .uxpcore_input--has-suffix .uxpcore_input__value {
  padding-right: 1rem;
  padding-left: 0.5rem;
}

body.uxp-glass-theme .uxpcore_timepicker__dropdown {
  backdrop-filter: blur(6.25rem);
}

.uxpcore_timerangepicker {
  position: relative;
}
.uxpcore_timerangepicker .uxpcore_input--timerangepicker {
  cursor: pointer;
  user-select: none;
}
.uxpcore_timerangepicker .uxpcore_input--timerangepicker:hover, .uxpcore_timerangepicker .uxpcore_input--timerangepicker.uxpcore_input--focus {
  background-color: var(--secondaryBGColor);
  box-shadow: 0 0.125rem 0.375rem 0 rgba(0, 0, 0, 0.12);
}
.uxpcore_timerangepicker .uxpcore_input--timerangepicker:focus-visible {
  background-color: var(--inputFocusBGColor);
  border-color: var(--inputFocusBorderColor);
  outline: none;
}
.uxpcore_timerangepicker .uxpcore_input__value {
  flex: 1;
  width: 100%;
  padding: 0.7rem 0.5rem;
  color: var(--inputTextColor);
  font-size: 1rem;
  font-family: "Inter", "Noto Sans Arabic", sans-serif !important;
  display: flex;
  align-items: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.uxpcore_timerangepicker .uxpcore_input--has-prefix .uxpcore_input__value {
  padding-left: 0.5rem;
}
.uxpcore_timerangepicker .uxpcore_input--has-suffix .uxpcore_input__value {
  padding-right: 0.5rem;
}
.uxpcore_timerangepicker__display {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.uxpcore_timerangepicker__label {
  font-size: 0.75rem;
  font-weight: var(--fontWeightMedium);
  color: var(--secondaryTextColor);
  text-transform: uppercase;
}
.uxpcore_timerangepicker__time {
  font-size: 0.875rem;
  font-weight: var(--fontWeightMedium);
  color: var(--primaryTextColor);
}
.uxpcore_timerangepicker__separator {
  font-size: 0.875rem;
  color: var(--secondaryTextColor);
  margin: 0 0.25rem;
}
.uxpcore_timerangepicker__dropdown {
  width: 15rem;
  min-width: 15rem;
  max-width: 15rem;
  background-color: var(--secondaryBGColor);
  border-radius: 0.5rem;
  overflow: hidden;
  padding: 0 !important;
}
.uxpcore_timerangepicker__dropdown-content {
  display: flex;
  flex-direction: column;
  width: 100%;
}
.uxpcore_timerangepicker__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.625rem 0.75rem;
  border-bottom: 1px solid var(--borderColor);
}
.uxpcore_timerangepicker__title {
  font-size: 0.875rem;
  font-weight: var(--fontWeightSemibold);
  color: var(--primaryTextColor);
}
.uxpcore_timerangepicker__toggle-input {
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  color: var(--secondaryTextColor);
  transition: color 0.2s ease;
  border-radius: 0.25rem;
}
.uxpcore_timerangepicker__toggle-input:hover {
  color: var(--primaryTextColor);
  background-color: var(--highlightBGColor);
}
.uxpcore_timerangepicker__toggle-input svg {
  width: 1rem;
  height: 1rem;
}
.uxpcore_timerangepicker__input-container {
  padding: 0.625rem 0.75rem;
  border-bottom: 1px solid var(--borderColor);
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.uxpcore_timerangepicker__clock-section {
  border-bottom: 1px solid var(--borderColor);
}
.uxpcore_timerangepicker__clock-section:last-of-type {
  border-bottom: none;
}
.uxpcore_timerangepicker__footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: 0.625rem 0.75rem;
  border-top: 1px solid var(--borderColor);
}

[dir=rtl] .uxpcore_timerangepicker .uxpcore_input--has-prefix .uxpcore_input__value {
  padding-left: 1rem;
  padding-right: 0.5rem;
}
[dir=rtl] .uxpcore_timerangepicker .uxpcore_input--has-suffix .uxpcore_input__value {
  padding-right: 1rem;
  padding-left: 0.5rem;
}
[dir=rtl] .uxpcore_timerangepicker__display {
  flex-direction: row-reverse;
}

body.uxp-glass-theme .uxpcore_timerangepicker__dropdown {
  backdrop-filter: blur(6.25rem);
}

.uxpcore_datetimepicker {
  position: relative;
}
.uxpcore_datetimepicker .uxpcore_input--datetimepicker {
  cursor: pointer;
  user-select: none;
}
.uxpcore_datetimepicker .uxpcore_input--datetimepicker:hover, .uxpcore_datetimepicker .uxpcore_input--datetimepicker.uxpcore_input--focus {
  background-color: var(--secondaryBGColor);
  box-shadow: 0 0.125rem 0.375rem 0 rgba(0, 0, 0, 0.12);
}
.uxpcore_datetimepicker .uxpcore_input--datetimepicker:focus-visible {
  background-color: var(--inputFocusBGColor);
  border-color: var(--inputFocusBorderColor);
  outline: none;
}
.uxpcore_datetimepicker .uxpcore_input__value {
  flex: 1;
  width: 100%;
  padding: 0.7rem 1rem;
  color: var(--inputTextColor);
  font-size: 1rem;
  font-family: "Inter", "Noto Sans Arabic", sans-serif !important;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.uxpcore_datetimepicker .uxpcore_datetimepicker__date-display,
.uxpcore_datetimepicker .uxpcore_datetimepicker__time-display {
  display: flex;
  align-items: center;
  gap: 0.25rem;
}
.uxpcore_datetimepicker .uxpcore_datetimepicker__separator {
  color: var(--secondaryTextColor);
  margin: 0 0.25rem;
}
.uxpcore_datetimepicker .uxpcore_input--has-prefix .uxpcore_input__value {
  padding-left: 0.5rem;
}
.uxpcore_datetimepicker .uxpcore_input--has-suffix .uxpcore_input__value {
  padding-right: 0.5rem;
}
.uxpcore_datetimepicker__dropdown {
  width: 20rem;
  min-width: 20rem;
  max-width: 20rem;
  background-color: var(--secondaryBGColor);
  border-radius: 0.5rem;
  overflow: hidden;
  padding: 0 !important;
}
.uxpcore_datetimepicker__dropdown-content {
  display: flex;
  flex-direction: column;
  width: 100%;
}
.uxpcore_datetimepicker__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.625rem 0.75rem;
  border-bottom: 1px solid var(--borderColor);
}
.uxpcore_datetimepicker__title {
  font-size: 0.875rem;
  font-weight: var(--fontWeightSemibold);
  color: var(--primaryTextColor);
}
.uxpcore_datetimepicker__toggle-input {
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  color: var(--secondaryTextColor);
  transition: color 0.2s ease;
  border-radius: 0.25rem;
}
.uxpcore_datetimepicker__toggle-input:hover {
  color: var(--primaryTextColor);
  background-color: var(--highlightBGColor);
}
.uxpcore_datetimepicker__toggle-input svg {
  width: 1rem;
  height: 1rem;
}
.uxpcore_datetimepicker__input-container {
  padding: 0.625rem 0.75rem;
  border-bottom: 1px solid var(--borderColor);
}
.uxpcore_datetimepicker__clock-container {
  border-top: 1px solid var(--borderColor);
}
.uxpcore_datetimepicker__divider {
  width: 100%;
  height: 1px;
  background-color: var(--borderColor);
  border: none;
  margin: 0;
}
.uxpcore_datetimepicker__footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: 0.625rem 0.75rem;
  border-top: 1px solid var(--borderColor);
}
.uxpcore_datetimepicker__done-btn {
  padding: 0.5rem 1rem;
  border: none;
  border-radius: 0.375rem;
  background-color: var(--primaryButtonBGColor);
  color: var(--primaryButtonTextColor);
  font-size: 0.875rem;
  font-weight: var(--fontWeightMedium);
  cursor: pointer;
  transition: background-color 0.2s ease;
}
.uxpcore_datetimepicker__done-btn:hover {
  background-color: var(--primaryButtonHoverBGColor);
}
.uxpcore_datetimepicker__done-btn:active {
  transform: scale(0.98);
}

[dir=rtl] .uxpcore_datetimepicker .uxpcore_input--has-prefix .uxpcore_input__value {
  padding-left: 1rem;
  padding-right: 0.5rem;
}
[dir=rtl] .uxpcore_datetimepicker .uxpcore_input--has-suffix .uxpcore_input__value {
  padding-right: 1rem;
  padding-left: 0.5rem;
}
[dir=rtl] .uxpcore_datetimepicker .uxpcore_datetimepicker__date-display,
[dir=rtl] .uxpcore_datetimepicker .uxpcore_datetimepicker__time-display {
  flex-direction: row-reverse;
}

body.uxp-glass-theme .uxpcore_datetimepicker__dropdown {
  backdrop-filter: blur(6.25rem);
}

/**
 * ColorPicker component styles
 * Follows DatePicker/TimePicker pattern with header, input mode toggle, and footer
 */
.uxpcore_colorpicker {
  position: relative;
}
.uxpcore_colorpicker .uxpcore_input--colorpicker {
  cursor: pointer;
  user-select: none;
}
.uxpcore_colorpicker .uxpcore_input--colorpicker:hover, .uxpcore_colorpicker .uxpcore_input--colorpicker.uxpcore_input--focus {
  background-color: var(--secondaryBGColor);
  box-shadow: 0 0.125rem 0.375rem 0 rgba(0, 0, 0, 0.12);
}
.uxpcore_colorpicker .uxpcore_input--colorpicker:focus-visible {
  background-color: var(--inputFocusBGColor);
  border-color: var(--inputFocusBorderColor);
  outline: none;
}
.uxpcore_colorpicker .uxpcore_input__value {
  flex: 1;
  width: 100%;
  padding: 0.7rem 1rem;
  color: var(--inputTextColor);
  font-size: 1rem;
  font-family: "Inter", "Noto Sans Arabic", sans-serif !important;
  display: flex;
  align-items: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.uxpcore_colorpicker .uxpcore_input--has-prefix .uxpcore_input__value {
  padding-left: 0.5rem;
}
.uxpcore_colorpicker .uxpcore_input--has-suffix .uxpcore_input__value {
  padding-right: 0.5rem;
}
.uxpcore_colorpicker__color-dot {
  width: 1.25rem;
  height: 1.25rem;
  border-radius: 50%;
  border: 1px solid var(--borderColor);
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1) inset;
}
.uxpcore_colorpicker__dropdown {
  background-color: var(--primaryBGColor);
  border: 1px solid var(--borderColor);
  border-radius: 0.5rem;
  box-shadow: 0 0.25rem 0.5rem var(--boxShadowColor);
  overflow: hidden;
}
.uxpcore_colorpicker__dropdown-content {
  display: flex;
  flex-direction: column;
  width: 100%;
}
.uxpcore_colorpicker__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.75rem 1rem;
  background-color: var(--secondaryBGColor);
  border-bottom: 1px solid var(--borderColor);
}
.uxpcore_colorpicker__title {
  font-weight: var(--fontWeightSemibold);
  color: var(--primaryTextColor);
}
.uxpcore_colorpicker__toggle-input {
  width: 1.5rem;
  height: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: var(--secondaryTextColor);
  transition: color 0.2s ease;
  border-radius: 0.25rem;
}
.uxpcore_colorpicker__toggle-input:hover {
  color: var(--primaryTextColor);
  background-color: var(--highlightBGColor);
}
.uxpcore_colorpicker__toggle-input svg {
  width: 1rem;
  height: 1rem;
}
.uxpcore_colorpicker__input-container {
  padding: 1rem;
  background-color: var(--primaryBGColor);
}
.uxpcore_colorpicker__palette-container {
  padding: 1rem;
  background-color: var(--primaryBGColor);
  display: flex;
  justify-content: center;
}
.uxpcore_colorpicker__palette-container .w-color-sketch {
  box-shadow: none !important;
  border: none !important;
  background: transparent !important;
  --sketch-background: var(--primaryBGColor);
  --sketch-box-shadow: var(--boxShadowColor);
  --sketch-swatch-border-top: var(--borderColor);
  --sketch-input-background: var(--inputBGColor);
  --sketch-input-border: var(--inputBorderColor);
  --sketch-input-color: var(--inputTextColor);
}
.uxpcore_colorpicker__footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: 0.75rem 1rem;
  background-color: var(--secondaryBGColor);
  border-top: 1px solid var(--borderColor);
}
.uxpcore_colorpicker__done-btn {
  padding: 0.5rem 1.5rem;
  background-color: var(--primaryButtonBGColor);
  color: var(--primaryButtonTextColor);
  border: 1px solid var(--primaryButtonBorderColor);
  border-radius: 0.375rem;
  font-weight: var(--fontWeightMedium);
  cursor: pointer;
  transition: all 0.2s ease;
}
.uxpcore_colorpicker__done-btn:hover {
  background-color: var(--primaryButtonHoverBGColor);
  border-color: var(--primaryButtonHoverBorderColor);
}
.uxpcore_colorpicker__done-btn:active {
  background-color: var(--primaryButtonActiveBGColor);
  border-color: var(--primaryButtonActiveBorderColor);
}

[dir=rtl] .uxpcore_colorpicker .uxpcore_input--has-prefix .uxpcore_input__value {
  padding-left: 1rem;
  padding-right: 0.5rem;
}
[dir=rtl] .uxpcore_colorpicker .uxpcore_input--has-suffix .uxpcore_input__value {
  padding-right: 1rem;
  padding-left: 0.5rem;
}

body.uxp-glass-theme .uxpcore_colorpicker__dropdown {
  backdrop-filter: blur(6.25rem);
}

/**
 * FileInput component styles (v5)
 * Drag and drop file upload with preview
 * Follows v5 input pattern with theme support
 */
.uxpcore_fileinput {
  min-height: 6.25rem;
  cursor: pointer;
  user-select: none;
}
.uxpcore_fileinput:hover:not(.uxpcore_input--disabled):not(.uxpcore_input--readonly) {
  background-color: var(--secondaryBGColor);
  box-shadow: 0 0.125rem 0.375rem 0 rgba(0, 0, 0, 0.12);
}
.uxpcore_fileinput.uxpcore_input--focus:not(.uxpcore_input--invalid):not(.uxpcore_input--valid) {
  background-color: var(--inputFocusBGColor);
  border-color: var(--inputFocusBorderColor);
  outline: none;
}
.uxpcore_fileinput.uxpcore_input--invalid {
  border-color: var(--inputInvalidBorderColor);
}
.uxpcore_fileinput.uxpcore_input--invalid.uxpcore_input--focus {
  border-color: var(--inputInvalidBorderColor);
  background-color: var(--inputInvalidBGColor);
}
.uxpcore_fileinput.uxpcore_input--valid {
  border-color: var(--inputValidBorderColor);
}
.uxpcore_fileinput.uxpcore_input--valid.uxpcore_input--focus {
  border-color: var(--inputValidBorderColor);
  background-color: var(--inputValidBGColor);
}
.uxpcore_fileinput.uxpcore_input--disabled {
  cursor: not-allowed;
}
.uxpcore_fileinput__content {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 6.25rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.uxpcore_fileinput__input {
  display: none;
}
.uxpcore_fileinput__preview-container {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.625rem;
}
.uxpcore_fileinput__preview {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
}
.uxpcore_fileinput__preview--empty .uxpcore_fileinput__icon {
  width: 1.875rem;
  height: 1.875rem;
  font-size: 1.25rem;
  color: var(--secondaryTextColor);
  opacity: 0.5;
}
.uxpcore_fileinput__preview--empty .uxpcore_fileinput__text {
  padding: 0.3125rem;
  font-size: 1rem;
  color: var(--secondaryTextColor);
}
.uxpcore_fileinput__image {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}
.uxpcore_fileinput__video {
  max-width: 100%;
  max-height: 100%;
}
.uxpcore_fileinput__file {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.625rem;
  max-width: 90%;
  overflow: hidden;
}
.uxpcore_fileinput__file .uxpcore_fileinput__icon {
  font-size: 1.25rem;
  color: var(--primaryTextColor);
  flex-shrink: 0;
}
.uxpcore_fileinput__file .uxpcore_fileinput__text {
  color: var(--primaryTextColor);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.uxpcore_fileinput__invalid {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.625rem;
  max-width: 90%;
  color: var(--toastErrorBGColor);
}
.uxpcore_fileinput__invalid .uxpcore_fileinput__icon {
  font-size: 1.25rem;
  flex-shrink: 0;
}
.uxpcore_fileinput__invalid .uxpcore_fileinput__text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.uxpcore_fileinput__hover-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: rgba(0, 0, 0, 0.7);
  z-index: 1;
  transition: opacity 0.2s ease;
}
.uxpcore_fileinput__hover-text {
  color: var(--primaryBGColor);
  font-size: 0.875rem;
  text-align: center;
  padding: 0.625rem;
}

.uxpcore_fileinput--dragging {
  border-color: var(--inputFocusBorderColor);
  background-color: var(--inputFocusBGColor);
}
.uxpcore_fileinput--dragging .uxpcore_fileinput__preview--empty .uxpcore_fileinput__icon {
  opacity: 1;
  color: var(--primaryTextColor);
}
.uxpcore_fileinput--dragging .uxpcore_fileinput__preview--empty .uxpcore_fileinput__text {
  color: var(--primaryTextColor);
  opacity: 1;
}

.uxpcore_fileinput--compact.uxpcore_fileinput--dragging {
  border-color: var(--inputFocusBorderColor);
  background-color: var(--inputFocusBGColor);
}
.uxpcore_fileinput--compact.uxpcore_fileinput--dragging .uxpcore_fileinput__compact-label {
  opacity: 1;
  color: var(--primaryTextColor);
}

.uxpcore_fileinput--compact {
  min-height: unset;
  cursor: pointer;
}

.uxpcore_fileinput__compact-label {
  flex: 1;
  padding: 0.7rem 0.5rem 0.7rem 1rem;
  font-size: 1rem;
  font-family: "Inter", "Noto Sans Arabic", sans-serif !important;
  color: var(--inputTextColor);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  align-self: center;
}
.uxpcore_fileinput__compact-label--placeholder {
  opacity: 0.6;
}

[dir=rtl] .uxpcore_fileinput__file, [dir=rtl] .uxpcore_fileinput__invalid {
  flex-direction: row-reverse;
}

body.uxp-glass-theme .uxpcore_fileinput__hover-overlay {
  backdrop-filter: blur(0.625rem);
  background-color: rgba(0, 0, 0, 0.5);
}

/**
 * ToggleFilter component styles (v5)
 * Radio button group with pill-style options
 * Follows v5 input pattern with theme support and responsive behavior
 *
 * Sizing (width, min-width, max-width) comes from _inputs_base.scss via .uxpcore_input class
 */
.uxpcore_togglefilter {
  min-height: 2.8rem;
  margin: 0;
  padding: 0.3125rem;
  background-color: var(--secondaryBGColor);
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: nowrap;
  overflow-x: auto;
  overflow-y: hidden;
  border-radius: 3.75rem;
  transition: opacity 0.2s ease;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.uxpcore_togglefilter::-webkit-scrollbar {
  display: none;
}
.uxpcore_togglefilter.uxpcore_input--disabled {
  opacity: 0.6;
  cursor: not-allowed;
}
.uxpcore_togglefilter.uxpcore_input--readonly {
  opacity: 0.8;
}
.uxpcore_togglefilter__option {
  flex: 1;
  min-width: max-content;
  height: auto;
  padding: 0.5rem 1.5rem;
  border-radius: 3.125rem;
  background-color: transparent;
  font-size: 0.6875rem;
  cursor: pointer;
  text-transform: uppercase;
  margin: 0.25rem;
  color: var(--primaryTextColor);
  transition: all 0.2s ease;
  outline: none;
  white-space: nowrap;
  text-align: center;
}
.uxpcore_togglefilter__option:focus {
  outline: 0.125rem solid var(--inputFocusBorderColor);
  outline-offset: 0.125rem;
}
.uxpcore_togglefilter__option--selected {
  box-shadow: 0 0.125rem 0.375rem 0.125rem rgba(0, 0, 0, 0.12);
  background-color: var(--primaryBGColor);
  color: var(--primaryTextColor);
}
.uxpcore_togglefilter__option:hover:not(.uxpcore_togglefilter__option--disabled):not(.uxpcore_togglefilter__option--readonly) {
  box-shadow: 0 0.125rem 0.375rem 0.125rem rgba(0, 0, 0, 0.12);
}
.uxpcore_togglefilter__option--disabled {
  cursor: not-allowed;
  opacity: 0.6;
}
.uxpcore_togglefilter__option--readonly {
  cursor: default;
}

body.uxp-glass-theme .uxpcore_togglefilter {
  background-color: rgba(var(--secondaryBGColorRGB), 0.8);
  backdrop-filter: blur(0.625rem);
}
body.uxp-glass-theme .uxpcore_togglefilter__option--selected {
  background-color: rgba(var(--primaryBGColorRGB), 0.9);
  backdrop-filter: blur(0.3125rem);
}

.uxpcore_input.uxpcore_checkbox-wrapper {
  border: none !important;
  background-color: transparent !important;
  min-width: unset !important;
}
.uxpcore_input.uxpcore_checkbox-wrapper:hover {
  background-color: transparent !important;
  border: none !important;
}
.uxpcore_input.uxpcore_checkbox-wrapper.uxpcore_input--focus {
  background-color: transparent !important;
  border: none !important;
}
.uxpcore_input.uxpcore_checkbox-wrapper.uxpcore_input--valid, .uxpcore_input.uxpcore_checkbox-wrapper.uxpcore_input--invalid {
  background-color: transparent !important;
  border: none !important;
}

.uxpcore_checkbox {
  display: block;
  width: auto;
  height: auto;
  background-color: transparent;
  position: relative;
  cursor: pointer;
  transition: all 200ms ease-in-out;
}
.uxpcore_checkbox__label {
  all: unset;
  display: inline-flex;
  cursor: pointer;
  position: relative;
  margin: 0;
}
.uxpcore_checkbox--disabled {
  opacity: 0.6;
  cursor: not-allowed;
  pointer-events: none;
}
.uxpcore_checkbox--disabled * {
  cursor: not-allowed;
}
.uxpcore_checkbox--readonly {
  cursor: default;
}
.uxpcore_checkbox--readonly * {
  cursor: default;
}
.uxpcore_checkbox__input {
  width: 1.5rem;
  height: 1.5rem;
  opacity: 0;
  z-index: 1;
  margin: 0;
  cursor: pointer;
}
.uxpcore_checkbox__placeholder {
  width: 1.5rem;
  height: 1.5rem;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  border-radius: 0.5rem;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--inputBGColor);
  color: var(--inputTextColor);
  border: 1px solid var(--inputBorderColor);
  transition: all 200ms ease-in-out;
}
.uxpcore_checkbox__placeholder--checked, .uxpcore_checkbox__placeholder--intermediate {
  background-color: var(--inputActiveBGColor);
  color: var(--inputActiveBorderColor);
  border-color: var(--inputActiveBorderColor);
}
.uxpcore_checkbox__placeholder--checked .uxpcore_checkbox__icon, .uxpcore_checkbox__placeholder--intermediate .uxpcore_checkbox__icon {
  opacity: 1;
}
.uxpcore_checkbox:not(.uxpcore_checkbox--disabled):not(.uxpcore_checkbox--readonly):hover .uxpcore_checkbox__placeholder:not(.uxpcore_checkbox__placeholder--checked):not(.uxpcore_checkbox__placeholder--intermediate) {
  background-color: var(--inputHoverBGColor);
  border-color: var(--inputHoverBorderColor);
}
.uxpcore_checkbox:focus-visible:not(.uxpcore_checkbox--disabled):not(.uxpcore_checkbox--readonly) {
  outline: none;
}
.uxpcore_checkbox:focus-visible:not(.uxpcore_checkbox--disabled):not(.uxpcore_checkbox--readonly) .uxpcore_checkbox__placeholder {
  box-shadow: 0 0 0 3px rgba(var(--inputActiveBorderColor-rgb, 59, 130, 246), 0.2);
}
.uxpcore_checkbox__icon-container {
  width: 100%;
  height: 100%;
  background-color: transparent;
  display: flex;
  align-items: center;
  justify-content: center;
}
.uxpcore_checkbox__icon {
  opacity: 1;
  color: currentColor;
}
.uxpcore_checkbox__icon--faded {
  opacity: 0.4;
}
.uxpcore_checkbox__switch_btn {
  width: 100%;
  height: 100%;
  position: relative;
}
.uxpcore_checkbox__text {
  padding-inline-start: 0.8rem;
  display: flex;
  align-items: center;
  cursor: pointer;
}
.uxpcore_checkbox--valid .uxpcore_checkbox__placeholder--checked, .uxpcore_checkbox--valid .uxpcore_checkbox__placeholder--intermediate {
  background-color: var(--inputValidBGColor);
  color: var(--inputValidBorderColor);
  border-color: var(--inputValidBorderColor);
}
.uxpcore_checkbox--invalid .uxpcore_checkbox__placeholder--checked, .uxpcore_checkbox--invalid .uxpcore_checkbox__placeholder--intermediate {
  background-color: var(--inputInvalidBGColor);
  color: var(--inputInvalidBorderColor);
  border-color: var(--inputInvalidBorderColor);
}
.uxpcore_checkbox--switch-line .uxpcore_checkbox__input {
  width: 4rem;
  height: 1.75rem;
}
.uxpcore_checkbox--switch-line .uxpcore_checkbox__placeholder {
  width: 4rem;
  height: 0.4rem;
  border-radius: 0.875rem;
  background-color: rgba(var(--inputBorderColor-rgb, 128, 128, 128), 0.25);
  border: 1px solid rgba(var(--inputBorderColor-rgb, 128, 128, 128), 0.4);
  transition: all 250ms cubic-bezier(0.4, 0, 0.2, 1);
}
.uxpcore_checkbox--switch-line .uxpcore_checkbox__placeholder .uxpcore_checkbox__switch_btn:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 2px;
  transform: translateY(-50%);
  width: 1.2rem;
  height: 1.2rem;
  z-index: 2;
  border-radius: 50%;
  background-color: var(--primaryBGColor);
  border: 1px solid var(--inputBorderColor);
  transition: all 250ms cubic-bezier(0.4, 0, 0.2, 1);
}
.uxpcore_checkbox--switch-line .uxpcore_checkbox__placeholder--checked {
  background-color: var(--accentColor);
  border-color: var(--accentColor);
}
.uxpcore_checkbox--switch-line .uxpcore_checkbox__placeholder--checked .uxpcore_checkbox__switch_btn:before {
  transform: translateX(2.25rem) translateY(-50%);
  border-color: var(--inputActiveTextColor);
  background-color: var(--inputActiveBGColor);
}
.uxpcore_checkbox--switch-line .uxpcore_checkbox__placeholder--intermediate {
  background-color: var(--inputActiveTextColor);
  border-color: var(--inputActiveBorderColor);
}
.uxpcore_checkbox--switch-line .uxpcore_checkbox__placeholder--intermediate .uxpcore_checkbox__switch_btn:before {
  transform: translateX(1.125rem) translateY(-50%);
  border-color: var(--inputActiveTextColor);
  background-color: var(--inputActiveBGColor);
}
.uxpcore_checkbox--switch-line:not(.uxpcore_checkbox--disabled):not(.uxpcore_checkbox--readonly):hover .uxpcore_checkbox__placeholder:not(.uxpcore_checkbox__placeholder--checked):not(.uxpcore_checkbox__placeholder--intermediate) {
  background-color: rgba(var(--inputBorderColor-rgb, 128, 128, 128), 0.35);
  border-color: rgba(var(--inputBorderColor-rgb, 128, 128, 128), 0.5);
}
.uxpcore_checkbox--switch-line:focus-visible:not(.uxpcore_checkbox--disabled):not(.uxpcore_checkbox--readonly) {
  outline: none;
}
.uxpcore_checkbox--switch-line:focus-visible:not(.uxpcore_checkbox--disabled):not(.uxpcore_checkbox--readonly) .uxpcore_checkbox__placeholder {
  box-shadow: 0 0 0 3px rgba(var(--inputActiveBorderColor-rgb, 59, 130, 246), 0.2);
}
.uxpcore_checkbox--switch-line.uxpcore_checkbox--valid .uxpcore_checkbox__placeholder--checked, .uxpcore_checkbox--switch-line.uxpcore_checkbox--valid .uxpcore_checkbox__placeholder--intermediate {
  background-color: var(--inputValidBorderColor);
  border-color: var(--inputValidBorderColor);
}
.uxpcore_checkbox--switch-line.uxpcore_checkbox--invalid .uxpcore_checkbox__placeholder--checked, .uxpcore_checkbox--switch-line.uxpcore_checkbox--invalid .uxpcore_checkbox__placeholder--intermediate {
  background-color: var(--inputInvalidBorderColor);
  border-color: var(--inputInvalidBorderColor);
}
.uxpcore_checkbox--switch-box .uxpcore_checkbox__input {
  width: 4rem;
  height: 1.75rem;
}
.uxpcore_checkbox--switch-box .uxpcore_checkbox__placeholder {
  width: 4rem;
  height: 1.75rem;
  border-radius: 0.875rem;
  padding: 2px;
  background-color: rgba(var(--inputBorderColor-rgb, 128, 128, 128), 0.3);
  border: 1px solid rgba(var(--inputBorderColor-rgb, 128, 128, 128), 0.5);
  transition: all 250ms cubic-bezier(0.4, 0, 0.2, 1);
}
.uxpcore_checkbox--switch-box .uxpcore_checkbox__placeholder .uxpcore_checkbox__switch_btn {
  height: 100%;
  position: relative;
}
.uxpcore_checkbox--switch-box .uxpcore_checkbox__placeholder .uxpcore_checkbox__switch_btn:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  width: 1.2rem;
  height: 1.2rem;
  z-index: 1;
  border-radius: 50%;
  background-color: var(--primaryBGColor);
  border: 1px solid var(--inputBorderColor);
  transition: all 250ms cubic-bezier(0.4, 0, 0.2, 1);
}
.uxpcore_checkbox--switch-box .uxpcore_checkbox__placeholder--checked {
  background-color: var(--accentColor);
  border-color: var(--accentColor);
}
.uxpcore_checkbox--switch-box .uxpcore_checkbox__placeholder--checked .uxpcore_checkbox__switch_btn:before {
  transform: translateX(2.25rem) translateY(-50%);
  border-color: var(--inputActiveTextColor);
  background-color: var(--inputActiveBGColor);
}
.uxpcore_checkbox--switch-box .uxpcore_checkbox__placeholder--intermediate {
  background-color: var(--inputActiveTextColor);
  border-color: var(--inputActiveBorderColor);
}
.uxpcore_checkbox--switch-box .uxpcore_checkbox__placeholder--intermediate .uxpcore_checkbox__switch_btn:before {
  transform: translateX(1.125rem) translateY(-50%);
  border-color: var(--inputActiveTextColor);
  background-color: var(--inputActiveBGColor);
}
.uxpcore_checkbox--switch-box:not(.uxpcore_checkbox--disabled):not(.uxpcore_checkbox--readonly):hover .uxpcore_checkbox__placeholder:not(.uxpcore_checkbox__placeholder--checked):not(.uxpcore_checkbox__placeholder--intermediate) {
  background-color: rgba(var(--inputBorderColor-rgb, 128, 128, 128), 0.4);
  border-color: rgba(var(--inputBorderColor-rgb, 128, 128, 128), 0.6);
}
.uxpcore_checkbox--switch-box:focus-visible:not(.uxpcore_checkbox--disabled):not(.uxpcore_checkbox--readonly) {
  outline: none;
}
.uxpcore_checkbox--switch-box:focus-visible:not(.uxpcore_checkbox--disabled):not(.uxpcore_checkbox--readonly) .uxpcore_checkbox__placeholder {
  box-shadow: 0 0 0 3px rgba(var(--inputActiveBorderColor-rgb, 59, 130, 246), 0.2);
}
.uxpcore_checkbox--switch-box.uxpcore_checkbox--valid .uxpcore_checkbox__placeholder--checked, .uxpcore_checkbox--switch-box.uxpcore_checkbox--valid .uxpcore_checkbox__placeholder--intermediate {
  background-color: var(--inputValidBorderColor);
  border-color: var(--inputValidBorderColor);
}
.uxpcore_checkbox--switch-box.uxpcore_checkbox--invalid .uxpcore_checkbox__placeholder--checked, .uxpcore_checkbox--switch-box.uxpcore_checkbox--invalid .uxpcore_checkbox__placeholder--intermediate {
  background-color: var(--inputInvalidBorderColor);
  border-color: var(--inputInvalidBorderColor);
}

.uxpcore_recaptcha-field {
  min-height: 78px;
  display: flex;
  align-items: center;
  justify-content: center;
  max-width: 100%;
  margin: 0 auto;
}
.uxpcore_recaptcha-field--loading {
  min-height: 78px;
}
.uxpcore_recaptcha-field__container {
  display: block;
}
.uxpcore_recaptcha-field__container--hidden {
  display: none;
}

.uxpcore_input--codeeditor {
  cursor: text;
  padding: 0;
  overflow: hidden;
  height: 100%;
  min-height: 15rem;
  position: relative;
  display: flex;
  flex-direction: column;
}
.uxpcore_input--codeeditor.uxpcore_input--focus {
  border-color: var(--inputFocusBorderColor);
  background-color: var(--inputFocusBGColor);
  outline: none;
}
.uxpcore_input--codeeditor.uxpcore_input--codeeditor--autoheight {
  height: auto;
  min-height: 0;
}
.uxpcore_input--codeeditor.uxpcore_input--codeeditor--autoheight .uxpcore_codeeditor__editor-area {
  flex: none;
  overflow: visible;
}
.uxpcore_input--codeeditor.uxpcore_input--disabled, .uxpcore_input--codeeditor.uxpcore_input--readonly {
  cursor: default;
  opacity: 0.6;
}
.uxpcore_input--codeeditor .uxpcore_codeeditor__editor-area {
  flex: 1;
  overflow: hidden;
  min-height: 0;
}
.uxpcore_input--codeeditor .uxpcore_codeeditor__toolbar {
  position: absolute;
  top: 1rem;
  right: 1rem;
  z-index: 10;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.15s ease;
  transition-delay: 0.25s;
}
.uxpcore_input--codeeditor .uxpcore_codeeditor__toolbar--compact {
  display: flex;
  align-items: center;
  gap: 0;
  top: 4px;
  right: 4px;
}
.uxpcore_input--codeeditor:hover .uxpcore_codeeditor__toolbar {
  opacity: 1;
  pointer-events: auto;
  transition-delay: 0s;
}
.uxpcore_input--codeeditor .uxpcore_cm_wrapper {
  width: 100%;
  height: 100%;
}
.uxpcore_input--codeeditor .cm-editor {
  width: 100%;
  height: 100%;
  min-height: 6rem;
  background-color: transparent;
  border: none;
  font-family: "Inter", "Noto Sans Arabic", sans-serif !important;
  font-size: 1rem;
  line-height: 1.6;
}
.uxpcore_input--codeeditor .cm-editor.cm-focused {
  outline: none;
}
.uxpcore_input--codeeditor .cm-editor.cm-focused .cm-cursor {
  border-left-color: var(--primaryTextColor);
}
.uxpcore_input--codeeditor .cm-editor .cm-scroller {
  overflow: auto;
}
.uxpcore_input--codeeditor .cm-editor .cm-content {
  padding: 0.667rem 0.833rem;
  caret-color: var(--primaryTextColor);
  font-family: "Inter", "Noto Sans Arabic", sans-serif !important;
}
.uxpcore_input--codeeditor .cm-editor .cm-activeLine {
  background-color: rgba(0, 0, 0, 0.04);
}
.uxpcore_input--codeeditor .cm-editor .cm-gutters {
  background-color: transparent;
  border-right: 1px solid var(--borderColor);
  color: var(--secondaryTextColor);
  font-size: 0.917rem;
}
.uxpcore_input--codeeditor .cm-editor .cm-lineNumbers .cm-gutterElement {
  padding: 0 0.667rem 0 0.333rem;
  min-width: 2.5rem;
}
.uxpcore_input--codeeditor .cm-editor .cm-placeholder {
  color: var(--secondaryTextColor);
  opacity: 0.6;
}
.uxpcore_input--codeeditor .cm-editor .cm-selectionBackground {
  background-color: var(--primaryButtonBGColor);
  opacity: 0.2;
}
.uxpcore_input--codeeditor .cm-editor.cm-focused .cm-selectionBackground {
  opacity: 0.3;
}

.uxpcore_codeeditor__fullscreen-overlay {
  position: fixed;
  inset: 0;
  z-index: 1000;
  background-color: var(--inputBGColor, #fff);
  overflow: hidden;
  padding: 2rem;
  padding-inline-end: 0;
  padding-inline-start: 1rem;
}
.uxpcore_codeeditor__fullscreen-overlay .uxpcore_codeeditor__toolbar {
  position: absolute;
  top: 2rem;
  right: 2rem;
  z-index: 1000;
}

.uxpcore_markdown_preview {
  font-size: 1.167rem;
  line-height: 1.7;
  color: inherit;
  /* Compact / clamped variant used by inline triggers (e.g. block
   * Documentation previews in the model designer's PropertyPanel and
   * PinListEditor). Pure-CSS line clamp; no extra DOM. Consumers pass
   * the line count via `--line-clamp` (defaults to 5). */
}
.uxpcore_markdown_preview p {
  margin: 0 0 0.833rem;
}
.uxpcore_markdown_preview p:last-child {
  margin-bottom: 0;
}
.uxpcore_markdown_preview h1,
.uxpcore_markdown_preview h2,
.uxpcore_markdown_preview h3,
.uxpcore_markdown_preview h4,
.uxpcore_markdown_preview h5,
.uxpcore_markdown_preview h6 {
  margin: 1.333rem 0 0.667rem;
  font-weight: var(--fontWeightSemibold);
  line-height: 1.3;
}
.uxpcore_markdown_preview h1:first-child,
.uxpcore_markdown_preview h2:first-child,
.uxpcore_markdown_preview h3:first-child,
.uxpcore_markdown_preview h4:first-child,
.uxpcore_markdown_preview h5:first-child,
.uxpcore_markdown_preview h6:first-child {
  margin-top: 0;
}
.uxpcore_markdown_preview ul,
.uxpcore_markdown_preview ol {
  margin: 0.667rem 0;
  padding-left: 1.667rem;
}
.uxpcore_markdown_preview li {
  margin-bottom: 0.333rem;
}
.uxpcore_markdown_preview code {
  font-family: "Inter", "Noto Sans Arabic", sans-serif !important;
  font-size: 1rem;
  padding: 0.167rem 0.417rem;
  border-radius: 0.333rem;
  background: var(--secondaryBGColor);
}
.uxpcore_markdown_preview pre {
  background: var(--secondaryBGColor);
  border-radius: 0.5rem;
  padding: 1rem 1.333rem;
  overflow-x: auto;
  font-size: 1rem;
}
.uxpcore_markdown_preview pre code {
  background: none;
  padding: 0;
}
.uxpcore_markdown_preview blockquote {
  border-left: 0.25rem solid var(--borderColor);
  margin: 0.667rem 0;
  padding: 0.333rem 1rem;
  color: var(--secondaryTextColor);
}
.uxpcore_markdown_preview a {
  color: inherit;
  text-decoration: underline;
}
.uxpcore_markdown_preview hr {
  border: none;
  border-top: 1px solid var(--borderColor);
  margin: 1.333rem 0;
}
.uxpcore_markdown_preview table {
  width: 100%;
  border-collapse: collapse;
  margin: 0.833rem 0;
  font-size: 1rem;
}
.uxpcore_markdown_preview table th,
.uxpcore_markdown_preview table td {
  padding: 0.5rem 0.833rem;
  border: 1px solid var(--borderColor);
  text-align: left;
}
.uxpcore_markdown_preview table th {
  background-color: var(--secondaryBGColor);
  font-weight: var(--fontWeightSemibold);
}
.uxpcore_markdown_preview table tr:nth-child(even) td {
  background-color: var(--secondaryBGColor);
}
.uxpcore_markdown_preview__empty {
  margin: 0;
  opacity: 0.5;
  font-size: 1.167rem;
  font-style: italic;
}
.uxpcore_markdown_preview--compact {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: var(--line-clamp, 5);
  line-clamp: var(--line-clamp, 5);
  overflow: hidden;
  max-height: calc(var(--line-clamp, 5) * 1.7em);
}

.uxpcore_markdown_editor {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 15rem;
  border: 1px solid var(--inputBorderColor);
  border-radius: 0.4rem;
  overflow: hidden;
  background-color: var(--inputBGColor);
  box-sizing: border-box;
}
.uxpcore_markdown_editor--full-width {
  width: 100%;
}
.uxpcore_markdown_editor--disabled, .uxpcore_markdown_editor--readonly {
  opacity: 0.6;
  cursor: default;
}
.uxpcore_markdown_editor__tabs {
  display: flex;
  border-bottom: 1px solid var(--borderColor);
  flex-shrink: 0;
  background-color: var(--secondaryBGColor);
}
.uxpcore_markdown_editor__tab {
  padding: 0.5rem 1.333rem;
  font-size: 1rem;
  font-family: "Inter", "Noto Sans Arabic", sans-serif !important;
  border: none;
  background: transparent;
  color: var(--secondaryTextColor);
  cursor: pointer;
  border-bottom: 0.2rem solid transparent;
  margin-bottom: -1px;
  transition: color 0.15s ease, border-color 0.15s ease;
}
.uxpcore_markdown_editor__tab.--active {
  color: var(--primaryTextColor);
  border-bottom-color: var(--primaryButtonBGColor);
  font-weight: var(--fontWeightSemibold);
}
.uxpcore_markdown_editor__tab:hover:not(.--active) {
  color: var(--primaryTextColor);
}
.uxpcore_markdown_editor__pane {
  flex: 1;
  min-height: 0;
  overflow: hidden;
}
.uxpcore_markdown_editor__pane .uxpcore_input--codeeditor {
  border: none;
  border-radius: 0;
  height: 100%;
}
.uxpcore_markdown_editor__pane--preview {
  overflow-y: auto;
  padding: 1.333rem;
}
.uxpcore_markdown_editor__pane[hidden] {
  display: none;
}

.uxpcore_pillinput {
  position: relative;
}
.uxpcore_pillinput .uxpcore_input--pillinput {
  cursor: text;
}
.uxpcore_pillinput .uxpcore_input--pillinput:hover:not(.uxpcore_input--disabled):not(.uxpcore_input--readonly) {
  background-color: var(--secondaryBGColor);
}
.uxpcore_pillinput .uxpcore_input--pillinput.uxpcore_input--has-content {
  background-color: var(--secondaryBGColor);
}
.uxpcore_pillinput .uxpcore_input--pillinput.uxpcore_input--focus {
  border-color: var(--inputFocusBorderColor);
  background-color: var(--inputFocusBGColor);
}
.uxpcore_pillinput .uxpcore_input--pillinput:focus-visible {
  background-color: var(--inputFocusBGColor);
  border-color: var(--inputFocusBorderColor);
  outline: none;
}
.uxpcore_pillinput__editor {
  position: relative;
  width: 100%;
  height: 100%;
  background-color: transparent;
  padding: 0;
  flex: 1;
}
.uxpcore_pillinput__editor .cm-editor {
  height: auto;
  min-height: 30px;
  background-color: inherit;
  border: none;
  font-family: inherit;
  font-size: inherit;
}
.uxpcore_pillinput__editor .cm-editor.cm-focused {
  outline: none;
}
.uxpcore_pillinput__editor .cm-editor.cm-focused .cm-cursor {
  border-left: 1px solid var(--secondaryTextColor);
}
.uxpcore_pillinput__editor .cm-editor .cm-activeLine {
  background-color: transparent !important;
}
.uxpcore_pillinput__editor .cm-editor .cm-content {
  outline: none;
}
.uxpcore_pillinput__editor .cm-editor .cm-placeholder {
  color: var(--disabledTextColor);
  font-style: italic;
}
.uxpcore_pillinput__code-mirror {
  width: 100%;
  height: auto;
}
.uxpcore_pillinput__code-mirror .CodeMirror {
  height: auto;
  min-height: 30px;
  background-color: inherit;
  border: none;
  font-family: inherit;
  font-size: inherit;
}
.uxpcore_pillinput__code-mirror .CodeMirror .CodeMirror-lines {
  padding: 2px 0;
}
.uxpcore_pillinput__code-mirror .CodeMirror .CodeMirror-lines .CodeMirror-cursors .CodeMirror-cursor {
  height: 100%;
  border-left: 1px solid var(--secondaryTextColor);
}
.uxpcore_pillinput__code-mirror .CodeMirror .CodeMirror-lines .CodeMirror-code {
  outline: none;
}
.uxpcore_pillinput__code-mirror .CodeMirror .CodeMirror-lines .CodeMirror-code .CodeMirror-line {
  padding: 2px 0;
  line-height: 1.4;
}
.uxpcore_pillinput__code-mirror .CodeMirror .CodeMirror-placeholder {
  color: var(--secondaryTextColor);
  font-style: italic;
}
.uxpcore_pillinput__code-mirror .CodeMirror.CodeMirror-focused .CodeMirror-cursor {
  opacity: 1;
}
.uxpcore_pillinput__pill-container {
  display: inline-block;
  padding: 2px;
  cursor: pointer;
  vertical-align: middle;
}
.uxpcore_pillinput__pill {
  display: inline-flex;
  border: 1px solid var(--borderColor);
  border-left: 0;
  outline: none;
  border-radius: 5px;
  overflow: hidden;
  cursor: pointer;
  font-size: 11px;
  transition: all 0.2s ease;
}
.uxpcore_pillinput__pill:hover {
  transform: scale(1.05);
}
.uxpcore_pillinput__pill-icon {
  width: 20px;
  height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
}
.uxpcore_pillinput__pill-icon svg {
  width: 12px;
  height: 12px;
}
.uxpcore_pillinput__pill-icon-url {
  width: 15px;
  height: 15px;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}
.uxpcore_pillinput__pill-text {
  padding: 3px 6px;
  background-color: var(--secondaryBGColor);
  color: var(--secondaryTextColor);
  display: flex;
  align-items: center;
  border-radius: 0 4px 4px 0;
  font-weight: var(--fontWeightMedium);
  white-space: nowrap;
  min-width: 0;
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.uxpcore_pillinput__formatter {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.uxpcore_pillinput__formatter-preview {
  padding: 0 5px 0 10px;
  position: relative;
  cursor: pointer;
}
.uxpcore_pillinput__formatter-preview::before {
  content: "|";
  position: absolute;
  top: 50%;
  left: 4px;
  translate: 0 -50%;
}
.uxpcore_pillinput__formatter-content {
  padding: 0;
}
.uxpcore_pillinput__formatter-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: 5px 0;
}
.uxpcore_pillinput__formatter-actions .uxp-button {
  margin: 0 2px;
  padding: 6px 10px;
}
.uxpcore_pillinput__panel {
  width: 100%;
  height: auto;
  max-height: 250px;
  display: flex;
  flex-direction: column;
}
.uxpcore_pillinput__sections {
  width: 100%;
  height: auto;
  min-height: 40px;
  max-height: 250px;
  overflow-y: auto;
  flex: 1;
}
.uxpcore_pillinput__values-section {
  width: 100%;
  height: auto;
  margin-bottom: 8px;
}
.uxpcore_pillinput__values-section:last-child {
  margin-bottom: 0;
}
.uxpcore_pillinput__values-section-header {
  background: var(--secondaryBGColor);
  backdrop-filter: blur(150px);
  -webkit-backdrop-filter: blur(150px);
  border: 1px solid var(--borderColor);
  width: 100%;
  height: auto;
  font-weight: var(--fontWeightSemibold);
  padding: 6px 10px;
  color: var(--secondaryTextColor);
  position: sticky;
  top: 0;
  z-index: 1;
}
.uxpcore_pillinput__values {
  width: 100%;
  height: auto;
  padding: 6px 10px;
}
.uxpcore_pillinput__values-item {
  padding: 3px 0;
}
.uxpcore_pillinput__values-item .uxpcore_pillinput__pill {
  cursor: pointer;
  transition: all 0.2s ease;
}
.uxpcore_pillinput__values-item .uxpcore_pillinput__pill:hover {
  transform: translateX(4px);
}
.uxpcore_pillinput__values-item .uxpcore_pillinput__pill:active {
  transform: translateX(2px) scale(0.98);
}

.uxpcore_taginput {
  height: auto !important;
  padding: 0.4rem 1rem;
  cursor: text;
  align-items: flex-start;
  flex-wrap: wrap;
}
.uxpcore_taginput__inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.3rem;
  width: 100%;
  min-height: 1.5rem;
}
.uxpcore_taginput__input {
  flex: 1;
  min-width: 4rem;
  border: none;
  outline: none;
  background: transparent;
  color: var(--inputTextColor);
  font-size: 1rem;
  font-family: inherit;
  line-height: 1.5;
  padding: 0.15rem 0;
}
.uxpcore_taginput__input::placeholder {
  color: var(--inputTextColor);
  opacity: 0.6;
}
.uxpcore_taginput__input:disabled {
  cursor: not-allowed;
}
.uxpcore_taginput__suggestions {
  display: flex;
  flex-direction: column;
  max-height: 12rem;
  overflow-y: auto;
}
.uxpcore_taginput__suggestion-item {
  padding: 0.5rem 0.75rem;
  color: var(--primaryTextColor);
  font-size: 0.875rem;
  cursor: pointer;
  transition: background 0.15s ease;
}
.uxpcore_taginput__suggestion-item:hover, .uxpcore_taginput__suggestion-item--active {
  background: var(--highlightBGColor);
  color: var(--highlightTextColor);
}

.uxpcore_cascadingselect--unified {
  border: 1px solid var(--inputBorderColor);
  border-radius: var(--inputBorderRadius, 0.375rem);
  overflow: hidden;
  background-color: var(--inputBGColor);
}
.uxpcore_cascadingselect--unified:focus-within {
  border-color: var(--inputFocusBorderColor);
}
.uxpcore_cascadingselect--unified .uxpcore_select .uxpcore_input--select {
  border: none;
  border-radius: 0;
  box-shadow: none;
  background-color: transparent;
  min-width: 0;
}
.uxpcore_cascadingselect--unified .uxpcore_select .uxpcore_input--select:hover, .uxpcore_cascadingselect--unified .uxpcore_select .uxpcore_input--select.uxpcore_input--focus {
  background-color: var(--secondaryBGColor);
  box-shadow: none;
}
.uxpcore_cascadingselect--unified .uxpcore_select + .uxpcore_select {
  border-left: 1px solid var(--inputBorderColor);
}
.uxpcore_cascadingselect--unified .uxpcore_select {
  flex: 1;
  min-width: 0;
}

/**
 * IconPicker Component - v5 Pattern
 * Supports two modes:
 * 1. Standard input height mode (default): icon + code with dropdown indicator
 * 2. Compact square mode: 3rem x 3rem icon-only button
 */
.uxpcore_iconpicker {
  position: relative;
}
.uxpcore_iconpicker .uxpcore_input--iconpicker {
  cursor: pointer;
  user-select: none;
}
.uxpcore_iconpicker .uxpcore_input--iconpicker:hover:not(.uxpcore_input--disabled):not(.uxpcore_input--readonly) {
  background-color: var(--inputHoverBGColor);
  border-color: var(--inputHoverBorderColor);
}
.uxpcore_iconpicker .uxpcore_input--iconpicker.uxpcore_input--focus {
  background-color: var(--inputFocusBGColor);
  border-color: var(--inputFocusBorderColor);
}
.uxpcore_iconpicker .uxpcore_input--iconpicker:focus-visible {
  background-color: var(--inputFocusBGColor);
  border-color: var(--inputFocusBorderColor);
  outline: none;
}
.uxpcore_iconpicker .uxpcore_input--iconpicker.uxpcore_input--error {
  border-color: var(--inputInvalidBorderColor);
}
.uxpcore_iconpicker .uxpcore_input--iconpicker .uxpcore_input__prefix {
  width: auto;
  aspect-ratio: 1;
  padding: 0.4rem;
  justify-content: center;
}
.uxpcore_iconpicker .uxpcore_input--iconpicker .uxpcore_input__prefix .uxpcore_icon {
  width: 1.6rem;
  height: 1.6rem;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: color 0.2s ease, opacity 0.2s ease;
  color: var(--inputTextColor);
}
.uxpcore_iconpicker .uxpcore_input--iconpicker:not(.uxpcore_input--has-content) .uxpcore_input__prefix .uxpcore_icon {
  color: var(--secondaryTextColor);
  opacity: 0.3;
}
.uxpcore_iconpicker .uxpcore_input--iconpicker:not(.uxpcore_input--has-content):hover:not(.uxpcore_input--disabled):not(.uxpcore_input--readonly) .uxpcore_input__prefix .uxpcore_icon {
  opacity: 0.5;
}
.uxpcore_iconpicker .uxpcore_input--iconpicker.uxpcore_input--has-content .uxpcore_input__prefix .uxpcore_icon {
  color: var(--inputTextColor);
  opacity: 1;
}
.uxpcore_iconpicker .uxpcore_input__value {
  flex: 1;
  width: 100%;
  padding: 0.7rem 1rem;
  color: var(--inputTextColor);
  font-size: 1rem;
  font-family: "Inter", "Noto Sans Arabic", sans-serif !important;
  display: flex;
  align-items: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.uxpcore_iconpicker .uxpcore_input--has-prefix .uxpcore_input__value {
  padding-left: 0.5rem;
}
.uxpcore_iconpicker .uxpcore_input--has-suffix .uxpcore_input__value {
  padding-right: 0.5rem;
}
.uxpcore_iconpicker .uxpcore_input--iconpicker-compact {
  width: 3rem !important;
  height: 3rem !important;
  min-width: 3rem !important;
  max-width: 3rem !important;
  aspect-ratio: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  user-select: none;
  border-radius: 0.625rem;
}
.uxpcore_iconpicker .uxpcore_input--iconpicker-compact:hover:not(.uxpcore_input--disabled):not(.uxpcore_input--readonly) {
  background-color: var(--inputHoverBGColor);
  border-color: var(--inputHoverBorderColor);
}
.uxpcore_iconpicker .uxpcore_input--iconpicker-compact.uxpcore_input--focus {
  background-color: var(--inputFocusBGColor);
  border-color: var(--inputFocusBorderColor);
}
.uxpcore_iconpicker .uxpcore_input--iconpicker-compact:focus-visible {
  background-color: var(--inputFocusBGColor);
  border-color: var(--inputFocusBorderColor);
  outline: none;
}
.uxpcore_iconpicker .uxpcore_input--iconpicker-compact.uxpcore_input--error {
  border-color: var(--inputInvalidBorderColor);
}
.uxpcore_iconpicker .uxpcore_input--iconpicker-compact .uxpcore_icon {
  transition: color 0.2s ease, opacity 0.2s ease;
  color: var(--inputTextColor);
}
.uxpcore_iconpicker .uxpcore_input--iconpicker-compact:not(.uxpcore_input--has-content) .uxpcore_icon {
  color: var(--secondaryTextColor);
  opacity: 0.3;
}
.uxpcore_iconpicker .uxpcore_input--iconpicker-compact:not(.uxpcore_input--has-content):hover:not(.uxpcore_input--disabled):not(.uxpcore_input--readonly) .uxpcore_icon {
  opacity: 0.5;
}
.uxpcore_iconpicker .uxpcore_input--iconpicker-compact.uxpcore_input--has-content .uxpcore_icon {
  color: var(--inputTextColor);
  opacity: 1;
}

.uxpcore_icon-picker-modal .modal-panel {
  max-width: 85rem;
  min-height: 75vh;
  max-height: 90vh;
  position: relative;
  overflow: hidden;
}
.uxpcore_icon-picker-modal .modal-panel .modal-header {
  padding: 1.1rem !important;
}
.uxpcore_icon-picker-modal .modal-panel .modal-body {
  padding: 0 !important;
  margin: 0 !important;
}
.uxpcore_icon-picker-modal__custom-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  width: 100%;
  padding: 0 1rem;
}
.uxpcore_icon-picker-modal__title {
  font-size: 1.125rem;
  font-weight: var(--fontWeightSemibold);
  color: var(--primaryTextColor);
  flex-shrink: 0;
}
.uxpcore_icon-picker-modal__search {
  flex: 1;
  max-width: 25rem;
}
.uxpcore_icon-picker-modal__content {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: row;
  gap: 0;
  position: relative;
  overflow: hidden;
}
.uxpcore_icon-picker-modal__main {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  overflow: hidden;
  transition: all 0.3s ease;
}
.uxpcore_icon-picker-modal__results {
  flex: 1;
  overflow-y: auto;
  padding: 1rem;
}
.uxpcore_icon-picker-modal__loading, .uxpcore_icon-picker-modal__empty {
  width: 100%;
  padding: 3rem 1rem;
  text-align: center;
  color: var(--secondaryTextColor);
  font-size: 0.875rem;
}
.uxpcore_icon-picker-modal__pagination {
  border-top: 1px solid var(--borderColor);
  flex-shrink: 0;
  display: flex;
  align-items: center;
  height: 5rem;
}
.uxpcore_icon-picker-modal__icon-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(8rem, 1fr));
  gap: 1rem;
}
.uxpcore_icon-picker-modal__icon-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  padding: 1.25rem 0.75rem;
  border: 1px solid var(--borderColor);
  border-radius: 0.5rem;
  background-color: var(--secondaryBGColor);
  cursor: pointer;
  transition: all 0.2s ease;
}
.uxpcore_icon-picker-modal__icon-card:hover {
  border-color: var(--primaryColor);
  background-color: var(--primaryBGColor);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  transform: scale(1.01);
}
.uxpcore_icon-picker-modal__icon-card--selected {
  border-color: var(--primaryColor);
  background-color: rgba(var(--primaryColorRGB), 0.1);
}
.uxpcore_icon-picker-modal__icon-card--selected .uxpcore_icon-picker-modal__icon-card-icon {
  color: var(--primaryColor);
}
.uxpcore_icon-picker-modal__icon-card--selected .uxpcore_icon-picker-modal__icon-card-name {
  color: var(--primaryColor);
  font-weight: var(--fontWeightSemibold);
}
.uxpcore_icon-picker-modal__icon-card-icon {
  width: 3rem;
  height: 3rem;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--primaryTextColor);
  transition: color 0.2s ease;
}
.uxpcore_icon-picker-modal__icon-card-icon .uxpcore_icon {
  width: 100%;
  height: 100%;
}
.uxpcore_icon-picker-modal__icon-card-name {
  font-size: 0.75rem;
  color: var(--secondaryTextColor);
  text-align: center;
  line-height: 1.3;
  transition: color 0.2s ease;
  width: 100%;
}
.uxpcore_icon-picker-modal__side-panel {
  width: 0;
  height: 100%;
  background-color: var(--primaryBGColor);
  border-left: 1px solid var(--borderColor);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  transition: width 0.3s ease;
  flex-shrink: 0;
}
.uxpcore_icon-picker-modal__side-panel--open {
  width: 25rem;
}
.uxpcore_icon-picker-modal__side-panel-content {
  flex: 1;
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  overflow-y: auto;
}
.uxpcore_icon-picker-modal__side-panel-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 1.5rem;
  border-bottom: 1px solid var(--borderColor);
  flex-shrink: 0;
  gap: 1rem;
}
.uxpcore_icon-picker-modal__side-panel-title {
  font-size: 1.25rem;
  font-weight: var(--fontWeightBold);
  color: var(--primaryTextColor);
  line-height: 1.3;
  flex: 1;
}
.uxpcore_icon-picker-modal__side-panel-viewchanger {
  width: 3rem;
  height: 3rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.8rem;
  border-radius: 50%;
  border: 1px solid var(--borderColor);
  cursor: pointer;
  background-color: var(--secondaryBGColor);
  color: var(--secondaryTextColor);
}
.uxpcore_icon-picker-modal__side-panel-viewchanger:hover {
  background-color: var(--secondaryTextColor);
  color: var(--secondaryBGColor);
}
.uxpcore_icon-picker-modal__side-panel-preview {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2rem;
  width: 100%;
  min-height: 8rem;
  height: auto;
}
.uxpcore_icon-picker-modal__side-panel-preview .uxpcore_icon {
  color: var(--primaryColor);
}
.uxpcore_icon-picker-modal__side-panel-code {
  font-size: 0.875rem;
  color: var(--secondaryTextColor);
  font-family: monospace;
  text-align: center;
  padding: 0.5rem;
}
.uxpcore_icon-picker-modal__view-toggle {
  margin-bottom: 0.5rem;
}
.uxpcore_icon-picker-modal__side-panel-options {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.uxpcore_icon-picker-modal__side-panel-section {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
.uxpcore_icon-picker-modal__side-panel-section-label {
  font-size: 0.75rem;
  font-weight: var(--fontWeightSemibold);
  color: var(--secondaryTextColor);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.uxpcore_icon-picker-modal__side-panel-info {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: 1rem;
  background-color: var(--secondaryBGColor);
  border-radius: 0.5rem;
  border: 1px solid var(--borderColor);
}
.uxpcore_icon-picker-modal__side-panel-icon-code {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  cursor: pointer;
  transition: all 0.2s ease;
}
.uxpcore_icon-picker-modal__side-panel-icon-code:hover .uxpcore_icon-picker-modal__side-panel-icon-code-value {
  background-color: var(--primaryBGColor);
  border-color: var(--primaryColor);
  color: var(--primaryColor);
}
.uxpcore_icon-picker-modal__side-panel-icon-code-label {
  font-size: 0.7rem;
  font-weight: var(--fontWeightSemibold);
  color: var(--secondaryTextColor);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.uxpcore_icon-picker-modal__side-panel-icon-code-value {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  padding: 0.75rem;
  font-size: 0.875rem;
  font-family: monospace;
  color: var(--primaryTextColor);
  background-color: var(--primaryBGColor);
  border: 1px solid var(--borderColor);
  border-radius: 0.25rem;
  transition: all 0.2s ease;
}
.uxpcore_icon-picker-modal__side-panel-icon-code-value .uxpcore_icon {
  flex-shrink: 0;
  opacity: 0.6;
}
.uxpcore_icon-picker-modal__side-panel-tags {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.uxpcore_icon-picker-modal__side-panel-tags-label {
  font-size: 0.7rem;
  font-weight: var(--fontWeightSemibold);
  color: var(--secondaryTextColor);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.uxpcore_icon-picker-modal__side-panel-tags-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}
.uxpcore_icon-picker-modal__side-panel-tag {
  padding: 0.25rem 0.75rem;
  font-size: 0.7rem;
  color: var(--primaryTextColor);
  background-color: var(--primaryBGColor);
  border: 1px solid var(--borderColor);
  border-radius: 1rem;
}
.uxpcore_icon-picker-modal__side-panel-variants {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.75rem;
  height: auto;
}
.uxpcore_icon-picker-modal__variant-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 1rem 0.5rem;
  border: 1px solid var(--borderColor);
  border-radius: 0.5rem;
  background-color: var(--secondaryBGColor);
  cursor: pointer;
  transition: all 0.2s ease;
}
.uxpcore_icon-picker-modal__variant-card:hover {
  border-color: var(--primaryColor);
  background-color: var(--primaryBGColor);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  transform: translateY(-1px);
}
.uxpcore_icon-picker-modal__variant-card--selected {
  border-color: var(--primaryColor);
  background-color: rgba(var(--primaryColorRGB), 0.1);
}
.uxpcore_icon-picker-modal__variant-card--selected .uxpcore_icon-picker-modal__variant-card-icon {
  color: var(--primaryColor);
}
.uxpcore_icon-picker-modal__variant-card--selected .uxpcore_icon-picker-modal__variant-card-label {
  color: var(--primaryColor);
  font-weight: var(--fontWeightSemibold);
}
.uxpcore_icon-picker-modal__variant-card-icon {
  width: 2.5rem;
  height: 2.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--primaryTextColor);
  transition: color 0.2s ease;
}
.uxpcore_icon-picker-modal__variant-card-icon .uxpcore_icon {
  width: 100%;
  height: 100%;
}
.uxpcore_icon-picker-modal__variant-card-label {
  font-size: 0.7rem;
  color: var(--secondaryTextColor);
  text-align: center;
  transition: color 0.2s ease;
}
.uxpcore_icon-picker-modal__side-panel-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 1rem 1.5rem;
  border-top: 1px solid var(--borderColor);
  flex-shrink: 0;
  height: 5rem;
}
.uxpcore_icon-picker-modal__confirm-btn {
  flex: 1;
}
.uxpcore_icon-picker-modal__close-btn {
  width: 2.5rem;
  height: 2.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.25rem;
  cursor: pointer;
  color: var(--secondaryTextColor);
  background-color: var(--secondaryBGColor);
  border: 1px solid var(--borderColor);
  transition: all 0.2s ease;
  flex-shrink: 0;
}
.uxpcore_icon-picker-modal__close-btn:hover {
  background-color: var(--primaryBGColor);
  border-color: var(--primaryColor);
  color: var(--primaryColor);
}

@media (max-width: 768px) {
  .uxpcore_icon-picker-modal .modal-panel {
    max-width: 95%;
    min-height: 80vh;
  }
  .uxpcore_icon-picker-modal__custom-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 1rem;
  }
  .uxpcore_icon-picker-modal__search {
    max-width: 100%;
  }
  .uxpcore_icon-picker-modal__icon-grid {
    grid-template-columns: repeat(auto-fill, minmax(6rem, 1fr));
    gap: 0.75rem;
  }
  .uxpcore_icon-picker-modal__icon-card {
    padding: 1rem 0.5rem;
  }
  .uxpcore_icon-picker-modal__icon-card-icon {
    width: 2.5rem;
    height: 2.5rem;
  }
  .uxpcore_icon-picker-modal__side-panel--open {
    width: 20rem;
  }
  .uxpcore_icon-picker-modal__side-panel-variants {
    grid-template-columns: 1fr;
  }
}
.uxpcore_timerangeslider {
  width: 100%;
  padding: 0.5rem;
}
.uxpcore_timerangeslider__title {
  font-size: 1.167rem;
  font-weight: var(--fontWeightMedium);
  color: var(--primaryTextColor);
  margin-bottom: 1rem;
}
.uxpcore_timerangeslider__values {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.uxpcore_timerangeslider__value {
  display: flex;
  align-items: center;
  font-size: 1rem;
}
.uxpcore_timerangeslider__value-label {
  color: var(--secondaryTextColor);
  font-weight: var(--fontWeightRegular);
  font-size: 0.9rem;
}
.uxpcore_timerangeslider__value-time {
  color: var(--primaryTextColor);
  font-weight: var(--fontWeightSemibold);
}
.uxpcore_timerangeslider__slider {
  position: relative;
  height: 3rem;
}
.uxpcore_timerangeslider__track {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  right: 0;
  height: 0.5rem;
  background-color: var(--inputBorderColor);
  border-radius: 0.25rem;
  pointer-events: none;
}
.uxpcore_timerangeslider__range {
  position: absolute;
  top: 0;
  height: 100%;
  background-color: var(--inputActiveBorderColor);
  border-radius: 0.25rem;
  transition: left 0.05s ease, width 0.05s ease;
  pointer-events: none;
}
.uxpcore_timerangeslider__input {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  right: 0;
  width: 100%;
  height: 3.333rem;
  margin: 0;
  padding: 0;
  -webkit-appearance: none;
  appearance: none;
  background: transparent;
  pointer-events: none;
  cursor: pointer;
}
.uxpcore_timerangeslider__input::-webkit-slider-track {
  width: 100%;
  height: 0.5rem;
  background: transparent;
  border: none;
  border-radius: 0.25rem;
}
.uxpcore_timerangeslider__input::-moz-range-track {
  width: 100%;
  height: 0.5rem;
  background: transparent;
  border: none;
  border-radius: 0.25rem;
}
.uxpcore_timerangeslider__input::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 50%;
  background-color: var(--inputActiveBorderColor);
  border: 0.167rem solid #ffffff;
  box-shadow: 0 0.167rem 0.333rem rgba(0, 0, 0, 0.2);
  cursor: grab;
  pointer-events: auto;
  position: relative;
  transition: transform 0.1s ease, box-shadow 0.1s ease;
}
.uxpcore_timerangeslider__input::-webkit-slider-thumb:hover {
  transform: scale(1.15);
  box-shadow: 0 0.167rem 0.667rem rgba(0, 0, 0, 0.3);
}
.uxpcore_timerangeslider__input::-webkit-slider-thumb:active {
  cursor: grabbing;
  transform: scale(1.1);
  box-shadow: 0 0.167rem 0.5rem rgba(0, 0, 0, 0.4);
}
.uxpcore_timerangeslider__input::-moz-range-thumb {
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 50%;
  background-color: var(--inputActiveBorderColor);
  border: 0.167rem solid #ffffff;
  box-shadow: 0 0.167rem 0.333rem rgba(0, 0, 0, 0.2);
  cursor: grab;
  pointer-events: auto;
  position: relative;
  transition: transform 0.1s ease, box-shadow 0.1s ease;
}
.uxpcore_timerangeslider__input::-moz-range-thumb:hover {
  transform: scale(1.15);
  box-shadow: 0 0.167rem 0.667rem rgba(0, 0, 0, 0.3);
}
.uxpcore_timerangeslider__input::-moz-range-thumb:active {
  cursor: grabbing;
  transform: scale(1.1);
  box-shadow: 0 0.167rem 0.5rem rgba(0, 0, 0, 0.4);
}
.uxpcore_timerangeslider__input--start {
  z-index: 1;
}
.uxpcore_timerangeslider__input--end {
  z-index: 2;
}
.uxpcore_timerangeslider__input--start.is-active {
  z-index: 3;
}
.uxpcore_timerangeslider__input--end.is-active {
  z-index: 3;
}
.uxpcore_timerangeslider__input:focus {
  outline: none;
}
.uxpcore_timerangeslider__input:focus::-webkit-slider-thumb {
  box-shadow: 0 0 0 0.25rem rgba(43, 62, 234, 0.2), 0 0.167rem 0.333rem rgba(0, 0, 0, 0.2);
}
.uxpcore_timerangeslider__input:focus::-moz-range-thumb {
  box-shadow: 0 0 0 0.25rem rgba(43, 62, 234, 0.2), 0 0.167rem 0.333rem rgba(0, 0, 0, 0.2);
}
.uxpcore_timerangeslider__input:disabled {
  cursor: not-allowed;
}
.uxpcore_timerangeslider__input:disabled::-webkit-slider-thumb {
  cursor: not-allowed;
  background-color: var(--inputBorderColor);
  pointer-events: none;
}
.uxpcore_timerangeslider__input:disabled::-moz-range-thumb {
  cursor: not-allowed;
  background-color: var(--inputBorderColor);
  pointer-events: none;
}
.uxpcore_timerangeslider__labels {
  display: flex;
  justify-content: space-between;
}
.uxpcore_timerangeslider__label {
  font-size: 1rem;
  color: var(--secondaryTextColor);
}
.uxpcore_timerangeslider--disabled {
  opacity: 0.6;
  pointer-events: none;
}
.uxpcore_timerangeslider--disabled .uxpcore_timerangeslider__range {
  background-color: var(--inputBorderColor);
}
.uxpcore_timerangeslider--dragging {
  user-select: none;
}
.uxpcore_timerangeslider--dragging .uxpcore_timerangeslider__input::-webkit-slider-thumb {
  cursor: grabbing;
}
.uxpcore_timerangeslider--dragging .uxpcore_timerangeslider__input::-moz-range-thumb {
  cursor: grabbing;
}

.uxpcore_calendar, .uxp-calendar-container {
  width: 100%;
  height: auto;
  background-color: var(--secondaryBGColor);
  overflow: hidden;
  border-radius: 0.5rem;
}
.uxpcore_calendar *, .uxp-calendar-container * {
  font-family: "Inter", "Noto Sans Arabic", sans-serif !important;
}
.uxpcore_calendar__month {
  width: 100%;
  height: auto;
  padding: 0 0.75rem 0.75rem 0.75rem;
}
.uxpcore_calendar__month table {
  width: 100%;
  height: auto;
}
.uxpcore_calendar__month table tr th {
  color: var(--secondaryTextColor);
  width: 14.2%;
  font-size: 0.75rem;
  font-weight: var(--fontWeightRegular);
  padding: 0.25rem 0;
}
.uxpcore_calendar__date {
  width: 100%;
  height: auto;
  min-height: 2rem;
  font-size: 0.75rem;
  background-color: transparent;
  border: 1px solid transparent;
  outline: none;
  padding: 2px;
  cursor: pointer;
  border-radius: 40px;
  background-clip: content-box;
  border-spacing: 1px;
  color: var(--secondaryTextColor);
  display: flex;
  align-items: center;
  justify-content: center;
}
.uxpcore_calendar__date--active {
  background-color: var(--primaryTextColor);
  color: var(--primaryBGColor);
}
.uxpcore_calendar__date:disabled {
  cursor: default;
  border: 1px solid transparent;
  opacity: 0.5;
}
.uxpcore_calendar__date:disabled.uxpcore_calendar__date--active {
  background-color: var(--secondaryBGColor);
  color: var(--primaryTextColor);
}
.uxpcore_calendar__date:disabled:hover, .uxpcore_calendar__date:disabled.uxpcore_calendar__date--in-range {
  border: 1px solid transparent;
}
.uxpcore_calendar__date:hover, .uxpcore_calendar__date--in-range {
  border: 1px solid var(--primaryTextColor);
}
.uxpcore_calendar__date div {
  width: 100%;
  height: auto;
  box-sizing: border-box;
}
.uxpcore_calendar__controllers {
  width: 100%;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  box-sizing: border-box;
  padding: 0.75rem;
}
.uxpcore_calendar__controllers-left, .uxpcore_calendar__controllers-right {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.uxpcore_calendar__pill {
  padding: 0.375rem 0.75rem;
  border: 1px solid var(--borderColor);
  border-radius: 0.375rem;
  background-color: transparent;
  color: var(--primaryTextColor);
  font-size: 0.875rem;
  cursor: pointer;
  transition: background-color 0.2s ease, border-color 0.2s ease;
  white-space: nowrap;
}
.uxpcore_calendar__pill:hover {
  background-color: var(--highlightBGColor);
  border-color: var(--primaryTextColor);
}
.uxpcore_calendar__pill--year {
  min-width: 4rem;
  text-align: center;
}
.uxpcore_calendar__pill--month {
  min-width: 6rem;
  text-align: center;
}
.uxpcore_calendar__navbtn {
  width: 2rem;
  height: 2rem;
  border-radius: 0.25rem;
  background-color: transparent;
  border: 1px solid var(--borderColor);
  outline: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--secondaryTextColor);
  transition: background-color 0.2s ease, border-color 0.2s ease;
}
.uxpcore_calendar__navbtn:hover:not(:disabled) {
  background-color: var(--highlightBGColor);
  border-color: var(--primaryTextColor);
}
.uxpcore_calendar__navbtn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
.uxpcore_calendar__navbtn svg {
  width: 0.875rem;
  height: 0.875rem;
}
.uxpcore_calendar__navbtn--today svg {
  width: 0.5rem;
  height: 0.5rem;
}
.uxpcore_calendar:hover, .uxp-calendar-container:hover {
  background-color: var(--secondaryBGColor);
}

.uxp-calendar-component-expanded {
  background-color: var(--secondaryBGColor);
  width: 315px;
  padding: 10px;
}
.uxp-calendar-component-expanded > .uxpcore_calendar, .uxp-calendar-component-expanded > .uxp-calendar-container {
  margin-top: 0;
}

.uxpcore_clock {
  width: 100%;
  padding: 1rem 0.75rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
}
.uxpcore_clock__title {
  font-size: 0.875rem;
  font-weight: var(--fontWeightSemibold);
  color: var(--primaryTextColor);
  margin-bottom: 0.5rem;
}
.uxpcore_clock__time-display {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}
.uxpcore_clock__field {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.375rem;
}
.uxpcore_clock__input-button {
  width: 100%;
  height: auto;
  aspect-ratio: unset;
  background-color: transparent;
  border-color: transparent;
}
.uxpcore_clock__input-button:hover {
  background-color: var(--secondartButtonHoverBGColor);
  color: var(--secondartButtonHoverTextColor);
  border-color: var(--secondartButtonHoverBorderColor);
}
.uxpcore_clock__input-wrapper .uxpcore_input {
  min-width: 3rem;
  width: 3rem;
  height: 3rem;
}
.uxpcore_clock__input-wrapper .uxpcore_input__input {
  width: 100%;
  height: 100%;
  font-size: 1rem;
  font-weight: var(--fontWeightSemibold);
  text-align: center;
  padding: 0;
  border-radius: 0.375rem;
}
.uxpcore_clock__separator {
  font-size: 2rem;
  font-weight: var(--fontWeightSemibold);
  color: var(--secondaryTextColor);
  user-select: none;
  margin: 0 0.25rem;
}
.uxpcore_clock__ampm-group {
  display: flex;
  flex-direction: column;
  gap: 2px;
  width: 3rem;
  height: 3rem;
}
.uxpcore_clock__ampm-group .uxpcore_button {
  width: 100%;
  flex: 1;
  min-height: 0;
  margin: 0;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.uxpcore_clock__ampm-group .uxpcore_button:first-of-type {
  border-radius: 0.3rem 0.3rem 0 0;
}
.uxpcore_clock__ampm-group .uxpcore_button:last-of-type {
  border-radius: 0 0 0.3rem 0.3rem;
}

[dir=rtl] .uxpcore_clock__time-display {
  flex-direction: row-reverse;
}

body.uxp-glass-theme .uxpcore_clock__input-wrapper .uxpcore_input__input {
  backdrop-filter: blur(0.625rem);
}

.uxpcore_configview {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  background-color: var(--primaryBGColor);
  color: var(--primaryTextColor);
}
.uxpcore_configview__header {
  padding: 0 1.5rem;
  position: relative;
  width: 100%;
  height: 5rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-shrink: 0;
}
.uxpcore_configview__header:after {
  content: "";
  position: absolute;
  bottom: 0;
  right: 1.5rem;
  left: 1.5rem;
  height: 1px;
  background-color: var(--borderColor);
}
.uxpcore_configview__header-actions {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-shrink: 0;
}
.uxpcore_configview__title {
  font-size: 1.4rem;
  font-weight: var(--fontWeightBold);
}
.uxpcore_configview__body {
  width: 100%;
  display: flex;
  flex-grow: 1;
  min-height: 0;
}
.uxpcore_configview__page-body {
  flex-grow: 1;
  min-height: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.uxpcore_configview__sidebar {
  height: 100%;
  width: 20rem;
  display: flex;
  flex-direction: column;
  position: relative;
  flex-shrink: 0;
}
.uxpcore_configview__sidebar:after {
  content: "";
  position: absolute;
  bottom: 0;
  top: 2px;
  right: 0;
  width: 1px;
  background-color: var(--borderColor);
}
.uxpcore_configview__search {
  padding: 1.5rem;
}
.uxpcore_configview__list {
  width: 100%;
  height: 100%;
  flex-grow: 1;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
}
.uxpcore_configview__list-item {
  font-size: 1.1rem;
  padding: 0.9rem;
  cursor: pointer;
}
.uxpcore_configview__list-item--selected {
  color: var(--selectedTextColor);
  background-color: var(--selectedBGColor);
}
.uxpcore_configview__content {
  height: 100%;
  min-width: 0;
  min-height: 0;
  flex-grow: 1;
  display: flex;
  flex-direction: column;
}
.uxpcore_configview__content-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-right: 1rem;
}
.uxpcore_configview__content-title {
  font-size: 1.3rem;
  padding: 1rem 0.5rem;
}
.uxpcore_configview__content-actions {
  display: flex;
  gap: 0.5rem;
  align-items: center;
}
.uxpcore_configview__content-body {
  flex-grow: 1;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  display: flex;
  flex-direction: column;
}

.uxpcore_simpleconfigtable {
  width: 100%;
  height: auto;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  padding: 1rem;
}
.uxpcore_simpleconfigtable__addnew {
  cursor: pointer;
  color: var(--accentColor);
  transition: opacity 0.2s;
}
.uxpcore_simpleconfigtable__addnew:hover {
  opacity: 0.8;
}

.uxpcore_slideinform__panel {
  background-color: var(--primaryBGColor);
  color: var(--primaryTextColor);
}
.uxpcore_slideinform__content {
  position: relative;
  width: 100%;
  height: 100%;
  border-radius: inherit;
  display: flex;
  flex-direction: column;
  background-color: var(--primaryBGColor);
  color: var(--primaryTextColor);
}
.uxpcore_slideinform__header {
  width: 100%;
  height: auto;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.8rem 1rem;
  border-bottom: 1px solid var(--borderColor);
}
.uxpcore_slideinform__header-title {
  padding: 0.5rem;
  font-size: 1.2rem;
  font-weight: var(--fontWeightBold);
}
.uxpcore_slideinform__header-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.75rem;
}
.uxpcore_slideinform__header-actions-instructions {
  padding: 0.5rem;
}
.uxpcore_slideinform__body {
  flex: 1;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 1.5rem;
}

.uxpcore_slide_panel__wrapper--modal .uxpcore_slideinform__body {
  max-height: calc(90vh - 5rem);
}

[dir=rtl] .uxpcore_slideinform__header-actions {
  flex-direction: row-reverse;
}

.uxpcore_dynamicform__container {
  width: 100%;
  height: 100%;
  background-color: var(--primaryBGColor);
  overflow: hidden;
}
.uxpcore_dynamicform__form {
  width: 100%;
  height: 100%;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.uxpcore_dynamicform__body {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 10px;
}
.uxpcore_dynamicform__footer {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  padding: 0.75rem 1.5rem;
}
.uxpcore_dynamicform__footer .uxp-button {
  margin: 0;
}
.uxpcore_dynamicform__form-section {
  width: 100%;
  height: auto;
}
.uxpcore_dynamicform__form-section--has-seperator {
  border-bottom: 1px solid silver;
}
.uxpcore_dynamicform__form-section-label {
  width: 100%;
  height: auto;
  padding: 20px 10px 10px 10px;
  font-size: 13px;
  font-weight: var(--fontWeightBold);
}
.uxpcore_dynamicform__form-section-content {
  width: 100%;
  height: auto;
  padding: 0px;
  font-size: 12px;
  font-weight: var(--fontWeightBold);
  padding-inline-start: 1rem;
}
.uxpcore_dynamicform__form-row {
  width: 100%;
  height: auto;
  display: grid;
  column-gap: 5rem;
}
.uxpcore_dynamicform__form-field {
  min-width: 0;
  padding-bottom: 3px;
}
.uxpcore_dynamicform__form-field .uxp-form-label {
  font-weight: var(--fontWeightLight);
  opacity: 0.8;
}
.uxpcore_dynamicform__field-header {
  display: flex;
  align-items: center;
  gap: 0.3rem;
}
.uxpcore_dynamicform__field-description {
  font-size: 0.9rem;
  font-style: italic;
  opacity: 0.6;
  padding: 0.15rem 0 0.25rem;
  line-height: 1.3;
}
.uxpcore_dynamicform__field-input-row {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  width: 100%;
}
.uxpcore_dynamicform__field-input-row > :first-child {
  flex: 1;
  min-width: 0;
}
.uxpcore_dynamicform__required-mark {
  color: var(--inputInvalidBorderColor);
}
.uxpcore_dynamicform__spacer {
  width: 100%;
  height: 100%;
}
.uxpcore_dynamicform__field-error {
  width: 100%;
  flex-shrink: 0;
  height: auto;
  padding: 10px;
  font-size: 11px;
  color: var(--inputInvalidBorderColor);
}
.uxpcore_dynamicform__skeleton {
  pointer-events: none;
  user-select: none;
  opacity: 0.7;
}

.uxpcore_wizardstep__container {
  width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  padding: 1.5rem 1rem;
  background-color: var(--primaryBGColor);
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.uxpcore_wizardstep__container::-webkit-scrollbar {
  display: none;
}
.uxpcore_wizardstep__scroll-container {
  display: flex;
  align-items: center;
  gap: 0;
  min-width: min-content;
}
.uxpcore_wizardstep__step {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.75rem;
  flex-shrink: 0;
  position: relative;
  transition: opacity 0.3s ease;
}
.uxpcore_wizardstep__step--clickable {
  cursor: pointer;
}
.uxpcore_wizardstep__step--clickable:hover {
  opacity: 0.8;
}
.uxpcore_wizardstep__step--clickable:focus {
  outline: 2px solid var(--onGoingStatsuBGColor);
  outline-offset: 4px;
  border-radius: 8px;
}
.uxpcore_wizardstep__step-circle {
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1rem;
  font-weight: var(--fontWeightSemibold);
  background-color: var(--inactiveStatusBGColor);
  color: var(--inactiveStatusTextColor);
  transition: all 0.3s ease;
  position: relative;
  z-index: 2;
  flex-shrink: 0;
}
.uxpcore_wizardstep__step-circle svg {
  width: 1.25rem;
  height: 1.25rem;
}
.uxpcore_wizardstep__step-label {
  font-size: 1rem;
  color: var(--inactiveStatusTextColor);
  text-align: left;
  white-space: nowrap;
  line-height: 1.3;
  font-weight: var(--fontWeightMedium);
  transition: all 0.3s ease;
}
.uxpcore_wizardstep__step--active .uxpcore_wizardstep__step-circle {
  background-color: var(--onGoingStatsuBGColor);
  color: var(--onGoingStatusTextColor);
}
.uxpcore_wizardstep__step--active .uxpcore_wizardstep__step-label {
  color: var(--onGoingStatusTextColor);
}
.uxpcore_wizardstep__step--completed .uxpcore_wizardstep__step-circle {
  background-color: var(--activeStatusBGColor);
  color: var(--activeStatusTextColor);
}
.uxpcore_wizardstep__step--completed .uxpcore_wizardstep__step-label {
  color: var(--activeStatusTextColor);
}
.uxpcore_wizardstep__step--error .uxpcore_wizardstep__step-circle {
  background-color: var(--inputInvalidBorderColor);
  color: white;
}
.uxpcore_wizardstep__step--error .uxpcore_wizardstep__step-label {
  color: var(--inputInvalidBorderColor);
}
.uxpcore_wizardstep__connector {
  height: 2px;
  flex: 0 0 3rem;
  background-color: var(--inactiveStatusBGColor);
  position: relative;
  z-index: 1;
  transition: background-color 0.3s ease;
}
.uxpcore_wizardstep__connector--active {
  background-color: var(--activeStatusBGColor);
}

[dir=rtl] .uxpcore_wizardstep__scroll-container {
  flex-direction: row-reverse;
}
[dir=rtl] .uxpcore_wizardstep__step-label {
  text-align: right;
}

@media (max-width: 768px) {
  .uxpcore_wizardstep__step {
    gap: 0.5rem;
  }
  .uxpcore_wizardstep__step-circle {
    width: 2.5rem;
    height: 2.5rem;
    font-size: 0.875rem;
  }
  .uxpcore_wizardstep__step-circle svg {
    width: 1rem;
    height: 1rem;
  }
  .uxpcore_wizardstep__step-label {
    font-size: 0.75rem;
  }
  .uxpcore_wizardstep__connector {
    flex: 0 0 2rem;
  }
}
.uxpcore_wizard__container {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  background-color: var(--primaryBGColor);
  border-radius: 0.5rem;
  overflow: hidden;
}

.uxpcore_wizard__empty {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2rem;
  color: var(--primaryTextColor);
  font-size: 1rem;
  opacity: 0.6;
}

.uxpcore_wizard__step {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.uxpcore_wizard__header {
  width: 100%;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.8rem 1rem;
  border-bottom: 1px solid var(--borderColor);
  gap: 1rem;
}

.uxpcore_wizard__header-indicator {
  flex: 1;
  min-width: 0;
  overflow: hidden;
}

.uxpcore_wizard__header-actions {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-shrink: 0;
}

.uxpcore_wizard__content {
  flex: 1;
  width: 100%;
  padding: 1.5rem;
  overflow-y: auto;
  overflow-x: hidden;
  background-color: var(--primaryBGColor);
  scroll-behavior: smooth;
}
.uxpcore_wizard__content::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
.uxpcore_wizard__content::-webkit-scrollbar-track {
  background: var(--portalBGColor);
}
.uxpcore_wizard__content::-webkit-scrollbar-thumb {
  border-radius: 10px;
  background-color: var(--primaryTextColor);
  border: 4px solid transparent;
  background-clip: padding-box;
}
.uxpcore_wizard__content::-webkit-scrollbar-thumb:hover {
  border: 0;
}

.uxpcore_piechart {
  width: 100%;
  height: 100%;
  background-color: var(--portalBGColor);
}
.uxpcore_piechart .uxpcore_chart__responsive-container {
  background-color: var(--portalBGColor);
}

.uxpcore_trendchart {
  width: 100%;
  height: 100%;
  background-color: var(--portalBGColor);
}
.uxpcore_trendchart .uxpcore_chart__responsive-container {
  background-color: var(--portalBGColor);
}

.uxpcore_customtooltip {
  width: auto;
  height: auto;
  background-color: var(--portalBGColor);
  box-shadow: 0 0 16px 4px rgba(0, 0, 0, 0.12);
  padding: 10px;
}
.uxpcore_customtooltip .name {
  font-size: 10px;
  color: var(--primaryTextColor);
  font-weight: var(--fontWeightBold);
  margin-bottom: 6px;
}
.uxpcore_customtooltip .trend {
  display: flex;
  align-items: center;
  justify-content: start;
  font-size: 12px;
  margin-bottom: 4px;
}

.uxpcore_radialgauge {
  width: 100%;
  height: 100%;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  background-color: var(--primaryBGColor);
}
.uxpcore_radialgauge .gauge-face-container {
  position: relative;
  overflow: hidden;
  padding: 1px;
  margin: 0 auto;
  flex-shrink: 0;
}
.uxpcore_radialgauge .gauge-face-container .gauge-face {
  position: relative;
  overflow: hidden;
}
.uxpcore_radialgauge .gauge-face-container .gauge-face .gauge-bg {
  position: absolute;
  top: 0;
  left: 0;
}
.uxpcore_radialgauge .gauge-face-container .gauge-face .tick-container {
  background-color: transparent;
  position: absolute;
  top: 0;
  left: 0;
}
.uxpcore_radialgauge .gauge-face-container .gauge-face .tick-container .tick {
  position: absolute;
}
.uxpcore_radialgauge .gauge-face-container .gauge-number-cont {
  position: absolute;
}
.uxpcore_radialgauge .gauge-face-container .gauge-number-cont .number-cont {
  position: relative;
  width: 100%;
  height: 100%;
}
.uxpcore_radialgauge .gauge-face-container .gauge-number-cont .number-cont .number {
  position: absolute;
}
.uxpcore_radialgauge .gauge-face-container .gauge-mask {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: transparent;
}
.uxpcore_radialgauge .gauge-face-container .gauge-mask svg {
  min-width: 100%;
  min-height: 100%;
  width: 100%;
  height: 100%;
}
.uxpcore_radialgauge .gauge-face-container .needle-cont {
  position: absolute;
  z-index: 1;
  background-color: transparent;
  transition: transform 500ms cubic-bezier(1, 1.01, 0.44, 1.32);
}
.uxpcore_radialgauge .gauge-face-container .needle-cont .needle {
  width: var(--needleWidth);
  height: var(--needleHeight);
  position: relative;
}
.uxpcore_radialgauge .gauge-face-container .needle-cont .needle:after {
  content: "";
  width: 100%;
  height: 100%;
  background-color: var(--needleColor);
  position: absolute;
  top: 0;
  left: 0;
  clip-path: polygon(40% 0%, 60% 0%, 100% 100%, 0% 100%);
}
.uxpcore_radialgauge .gauge-face-container .needle-cont .needle:before {
  content: "";
  width: var(--smallEdgeWidth);
  height: var(--smallEdgeWidth);
  border-radius: 50%;
  background-color: var(--needleColor);
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 1;
}
.uxpcore_radialgauge .gauge-face-container .needle-cont .needle .circle {
  width: var(--largeEdgeWidth);
  height: var(--largeEdgeWidth);
  border-radius: 50%;
  background-color: var(--needleColor);
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translate(-50%, 50%);
  z-index: 1;
}
.uxpcore_radialgauge .gauge-face-container .needle-cont .needle .circle:before {
  content: "";
  width: 50%;
  height: 50%;
  border-radius: 50%;
  background-color: white;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translate(-50%, -50%);
}
.uxpcore_radialgauge .gauge-label-cont {
  width: 100%;
  height: auto;
  padding: 10px;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}
.uxpcore_radialgauge .gauge-label-cont .label {
  position: relative;
  flex-grow: 0;
}
.uxpcore_radialgauge .gauge-legend-cont {
  width: 100%;
  height: auto;
  padding: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-top: 30px;
}
.uxpcore_radialgauge .gauge-legend-cont .colors-cont {
  width: 100%;
  height: 8px;
  display: flex;
}
.uxpcore_radialgauge .gauge-legend-cont .colors-cont .tile {
  height: 100%;
  position: relative;
}
.uxpcore_radialgauge .gauge-legend-cont .colors-cont .tile:before {
  content: "";
  width: 2px;
  height: 18px;
  background-color: var(--lableColor);
  border-radius: 6px;
  position: absolute;
  top: 0;
  left: 0;
  transform: translate(-50%, -10px);
}
.uxpcore_radialgauge .gauge-legend-cont .colors-cont .tile:last-child:after {
  content: "";
  width: 2px;
  height: 18px;
  background-color: var(--lableColor);
  position: absolute;
  top: 0;
  right: 0;
  transform: translate(50%, -10px);
}
.uxpcore_radialgauge .gauge-legend-cont .colors-cont .tile .label {
  width: auto;
  height: auto;
  position: absolute;
  padding: 0;
  top: -10px;
  display: inline;
  text-align: center;
}
.uxpcore_radialgauge .gauge-legend-cont .colors-cont .tile .label:first-child {
  left: 0;
  transform: translate(-50%, -100%);
}
.uxpcore_radialgauge .gauge-legend-cont .colors-cont .tile .label:last-child {
  right: 0;
  transform: translate(50%, -100%);
}
.uxpcore_radialgauge .gauge-cont-spacer {
  width: 100%;
  height: 0;
}

/**
 * Map Component - v5 Pattern
 * Leaflet-based map with full theme support
 */
.uxpcore_mapcontainer {
  width: 100%;
  height: 100%;
}

.uxpcore_map__default-marker {
  background: transparent !important;
  border: none !important;
}
.uxpcore_map__default-marker::before {
  content: "";
  display: block;
  width: 20px;
  height: 20px;
  background-color: var(--accentColor, #3388ff);
  border: 2px solid #fff;
  border-radius: 50% 50% 50% 0;
  transform: rotate(-45deg);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
}
.uxpcore_map__default-marker::after {
  content: "";
  display: block;
  width: 6px;
  height: 6px;
  background: #fff;
  border-radius: 50%;
  position: absolute;
  top: 7px;
  left: 7px;
}

.leaflet-container {
  background-color: var(--secondaryBGColor);
  color: var(--primaryTextColor);
  font-family: inherit;
}

.leaflet-popup-content-wrapper {
  background-color: var(--primaryBGColor);
  color: var(--primaryTextColor);
  border: 1px solid var(--borderColor);
  border-radius: 0.5rem;
  box-shadow: 0 3px 14px var(--boxShadowColor);
}

.leaflet-popup-tip {
  background-color: var(--primaryBGColor);
  border: 1px solid var(--borderColor);
}

.leaflet-popup-close-button {
  color: var(--secondaryTextColor) !important;
}
.leaflet-popup-close-button:hover {
  color: var(--primaryTextColor) !important;
}

.leaflet-tooltip {
  background-color: var(--primaryBGColor);
  color: var(--primaryTextColor);
  border: 1px solid var(--borderColor);
  border-radius: 0.5rem;
  box-shadow: 0 1px 3px var(--boxShadowColor);
}
.leaflet-tooltip.leaflet-tooltip-top:before, .leaflet-tooltip.leaflet-tooltip-bottom:before, .leaflet-tooltip.leaflet-tooltip-left:before, .leaflet-tooltip.leaflet-tooltip-right:before {
  border-top-color: var(--borderColor);
  border-bottom-color: var(--borderColor);
  border-left-color: var(--borderColor);
  border-right-color: var(--borderColor);
}

.leaflet-bar {
  border: 1px solid var(--borderColor);
  border-radius: 0.5rem;
  box-shadow: 0 1px 5px var(--boxShadowColor);
}
.leaflet-bar a {
  background-color: var(--primaryBGColor);
  color: var(--primaryTextColor);
  border-bottom: 1px solid var(--borderColor);
}
.leaflet-bar a:hover {
  background-color: var(--secondaryBGColor);
}
.leaflet-bar a:focus {
  outline: 2px solid var(--focusRingColor);
  outline-offset: 2px;
}
.leaflet-bar a.leaflet-disabled {
  background-color: var(--disabledBGColor);
  color: var(--disabledTextColor);
  cursor: not-allowed;
}
.leaflet-bar a:last-child {
  border-bottom: none;
}

.leaflet-control-zoom a {
  width: 30px;
  height: 30px;
  line-height: 30px;
  font-size: 1.25rem;
  font-weight: var(--fontWeightBold);
}

.leaflet-control-attribution {
  background-color: var(--primaryBGColor);
  color: var(--secondaryTextColor);
  border: 1px solid var(--borderColor);
}
.leaflet-control-attribution a {
  color: var(--linkColor);
}
.leaflet-control-attribution a:hover {
  color: var(--linkHoverColor);
}

.leaflet-control-layers {
  background-color: var(--primaryBGColor);
  border: 1px solid var(--borderColor);
  border-radius: 0.5rem;
  box-shadow: 0 1px 5px var(--boxShadowColor);
}

.leaflet-control-layers-toggle {
  background-color: var(--primaryBGColor);
}
.leaflet-control-layers-toggle:hover {
  background-color: var(--secondaryBGColor);
}

.leaflet-control-layers-list {
  color: var(--primaryTextColor);
}
.leaflet-control-layers-list label {
  color: var(--primaryTextColor);
}
.leaflet-control-layers-list input[type=radio]:focus,
.leaflet-control-layers-list input[type=checkbox]:focus {
  outline: 2px solid var(--focusRingColor);
  outline-offset: 2px;
}

.leaflet-control-scale-line {
  background-color: var(--primaryBGColor);
  border: 2px solid var(--borderColor);
  color: var(--primaryTextColor);
}

body.uxp-glass-theme .leaflet-popup-content-wrapper {
  background: var(--secondaryBGColor);
  backdrop-filter: blur(150px);
  -webkit-backdrop-filter: blur(150px);
  border: 1px solid var(--borderColor);
}
body.uxp-glass-theme .leaflet-bar a {
  background: var(--secondaryBGColor);
  backdrop-filter: blur(150px);
  -webkit-backdrop-filter: blur(150px);
  border: 1px solid var(--borderColor);
  border-bottom: 1px solid var(--borderColor);
}
body.uxp-glass-theme .leaflet-control-attribution,
body.uxp-glass-theme .leaflet-control-layers {
  background: var(--secondaryBGColor);
  backdrop-filter: blur(150px);
  -webkit-backdrop-filter: blur(150px);
  border: 1px solid var(--borderColor);
}

.uxpcore_toast__container {
  position: fixed;
  background: transparent;
  width: auto;
  max-width: 33rem;
  height: auto;
  max-height: 40rem;
  overflow-y: auto;
  overflow-x: hidden;
  z-index: 9999;
  padding: 1rem;
  -ms-overflow-style: none;
  /* IE and Edge */
  scrollbar-width: none;
  /* Firefox */
}
.uxpcore_toast__container::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}

.uxpcore_toast {
  width: 100%;
  height: auto;
  box-sizing: border-box;
  padding: 1.25rem;
  border-radius: 0.8rem;
  margin: 0.8rem auto;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  position: relative;
  border: 1px solid var(--borderColor);
  background: var(--secondaryBGColor);
  backdrop-filter: blur(150px);
  -webkit-backdrop-filter: blur(150px);
  border: 1px solid var(--borderColor);
}
.uxpcore_toast__icon {
  width: 3rem;
  height: 3rem;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2rem;
  margin-right: 1rem;
}
.uxpcore_toast__content {
  width: auto;
  min-width: 16.667rem;
  height: auto;
  background-color: transparent;
  padding: 0;
  flex: 1;
}
.uxpcore_toast__title {
  width: auto;
  height: auto;
  display: block;
  font-weight: var(--fontWeightSemibold);
  padding: 0 0 0.333rem 0;
  font-size: 1.4rem;
  color: var(--primaryTextColor);
  line-height: 1.4;
}
.uxpcore_toast__body {
  width: auto;
  height: auto;
  display: block;
  padding: 0;
  font-size: 1rem;
  text-align: left;
  color: var(--primaryTextColor);
  line-height: 1.5;
}
.uxpcore_toast__close {
  position: absolute;
  top: 4px;
  right: 4px;
}
.uxpcore_toast--success {
  background-color: var(--toastSuccessBGColor);
  color: var(--toastSuccessTextColor);
}
.uxpcore_toast--success .uxpcore_toast__title,
.uxpcore_toast--success .uxpcore_toast__body {
  color: var(--toastSuccessTextColor);
}
.uxpcore_toast--error {
  background-color: var(--toastErrorBGColor);
  color: var(--toastErrorTextColor);
}
.uxpcore_toast--error .uxpcore_toast__title,
.uxpcore_toast--error .uxpcore_toast__body {
  color: var(--toastErrorTextColor);
}
.uxpcore_toast--warning {
  background-color: var(--toastWarningBGColor);
  color: var(--toastWarningTextColor);
}
.uxpcore_toast--warning .uxpcore_toast__title,
.uxpcore_toast--warning .uxpcore_toast__body {
  color: var(--toastWarningTextColor);
}
.uxpcore_toast--info {
  background-color: var(--toastInfoBGColor);
  color: var(--toastInfoTextColor);
}
.uxpcore_toast--info .uxpcore_toast__title,
.uxpcore_toast--info .uxpcore_toast__body {
  color: var(--toastInfoTextColor);
}
.uxpcore_toast--custom {
  background-color: var(--primaryBGColor);
  color: var(--primaryTextColor);
}
.uxpcore_toast--custom .uxpcore_toast__title,
.uxpcore_toast--custom .uxpcore_toast__body {
  color: var(--primaryTextColor);
}
.uxpcore_toast--show {
  animation: slide-to-left-from-right 300ms cubic-bezier(0.72, 0.87, 0.25, 1);
  animation-fill-mode: forwards;
}
.uxpcore_toast--hide {
  animation: slide-to-right 300ms cubic-bezier(0.72, 0.87, 0.25, 1);
  animation-fill-mode: forwards;
}

.uxpcore_toast__container.bottom-right {
  bottom: 1.667rem;
  right: 1.667rem;
}
.uxpcore_toast__container.bottom-right .uxpcore_toast--show {
  animation: slide-to-left-from-right 300ms cubic-bezier(0.72, 0.87, 0.25, 1);
  animation-fill-mode: forwards;
}
.uxpcore_toast__container.bottom-right .uxpcore_toast--hide {
  animation: slide-to-right 300ms cubic-bezier(0.72, 0.87, 0.25, 1);
  animation-fill-mode: forwards;
}
.uxpcore_toast__container.bottom-left {
  bottom: 1.667rem;
  left: 1.667rem;
}
.uxpcore_toast__container.bottom-left .uxpcore_toast--show {
  animation: slide-to-right-from-left 300ms cubic-bezier(0.72, 0.87, 0.25, 1);
  animation-fill-mode: forwards;
}
.uxpcore_toast__container.bottom-left .uxpcore_toast--hide {
  animation: slide-to-left 300ms cubic-bezier(0.72, 0.87, 0.25, 1);
  animation-fill-mode: forwards;
}
.uxpcore_toast__container.top-right {
  top: 1.667rem;
  right: 1.667rem;
}
.uxpcore_toast__container.top-right .uxpcore_toast--show {
  animation: slide-to-left-from-right 300ms cubic-bezier(0.72, 0.87, 0.25, 1);
  animation-fill-mode: forwards;
}
.uxpcore_toast__container.top-right .uxpcore_toast--hide {
  animation: slide-to-right 300ms cubic-bezier(0.72, 0.87, 0.25, 1);
  animation-fill-mode: forwards;
}
.uxpcore_toast__container.top-left {
  top: 1.667rem;
  left: 1.667rem;
}
.uxpcore_toast__container.top-left .uxpcore_toast--show {
  animation: slide-to-right-from-left 300ms cubic-bezier(0.72, 0.87, 0.25, 1);
  animation-fill-mode: forwards;
}
.uxpcore_toast__container.top-left .uxpcore_toast--hide {
  animation: slide-to-left 300ms cubic-bezier(0.72, 0.87, 0.25, 1);
  animation-fill-mode: forwards;
}

@keyframes slide-to-left-from-right {
  from {
    left: 100%;
  }
  to {
    left: 0;
  }
}
@keyframes slide-to-right-from-left {
  from {
    left: -100%;
  }
  to {
    left: 0;
  }
}
@keyframes slide-to-right {
  from {
    left: 0;
  }
  to {
    left: 100%;
  }
}
@keyframes slide-to-left {
  from {
    left: 0;
  }
  to {
    left: -100%;
  }
}
@keyframes fade-out {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes alert-zoom-in {
  0% {
    transform: scale(0);
  }
  100% {
    transform: scale(1);
  }
}
@keyframes alert-zoom-out {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(0);
  }
}
.uxpcore_alert-container {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: rgba(0, 0, 0, 0.12);
  z-index: 999;
}

.uxpcore_alert {
  position: relative;
  min-width: 29.167rem;
  min-height: 12.5rem;
  max-width: 95%;
  max-height: 95%;
  border-radius: 0.833rem;
  background-color: var(--primaryBGColor);
  color: var(--primaryTextColor);
  border: 1px solid var(--borderColor);
  transform-origin: center;
  display: flex;
  flex-direction: column;
  background: var(--secondaryBGColor);
  backdrop-filter: blur(150px);
  -webkit-backdrop-filter: blur(150px);
  border: 1px solid var(--borderColor);
}
.uxpcore_alert--show {
  animation: alert-zoom-in 300ms cubic-bezier(0.72, 0.87, 0.25, 1);
  animation-fill-mode: forwards;
}
.uxpcore_alert--hide {
  animation: alert-zoom-out 300ms cubic-bezier(0.72, 0.87, 0.25, 1);
  animation-fill-mode: forwards;
}
.uxpcore_alert__header {
  width: 100%;
  height: 4.167rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid var(--borderColor);
  padding: 0 0.833rem;
  flex-shrink: 0;
  gap: 0.5rem;
}
.uxpcore_alert__header-actions {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-shrink: 0;
}
.uxpcore_alert__title {
  width: auto;
  height: auto;
}
.uxpcore_alert__title-content {
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.uxpcore_alert__icon {
  width: 2.083rem;
  height: 2.083rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.667rem;
  margin-right: 0.833rem;
}
.uxpcore_alert__title-text {
  font-weight: var(--fontWeightBold);
  text-transform: capitalize;
  font-size: 1.167rem;
}
.uxpcore_alert__body {
  padding: 1.667rem 1.25rem;
  font-size: 1.083rem;
  position: relative;
  flex: 1;
  overflow: auto;
  white-space: pre;
}
.uxpcore_alert__footer {
  width: 100%;
  height: 4.167rem;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: 0 1.25rem;
  flex-shrink: 0;
}
.uxpcore_alert--confirm-alert .uxpcore_alert__footer {
  justify-content: flex-end;
  gap: 0.833rem;
}
.uxpcore_alert--confirm-alert .uxpcore_alert__verification-pill {
  display: inline-block;
  padding: 0.1rem 0.5rem;
  margin: 2px;
  background-color: var(--selectedBGColor);
  color: var(--selectedTextColor);
  border-radius: 0.25rem;
  font-weight: var(--fontWeightSemibold);
}
.uxpcore_alert--form-alert {
  min-width: 33.333rem;
}
.uxpcore_alert--form-alert .uxpcore_alert__body {
  padding: 1.25rem;
  white-space: normal;
}
.uxpcore_alert--form-alert .uxpcore_alert__body .instructions {
  margin-bottom: 1.25rem;
  line-height: 1.5;
}
.uxpcore_alert--form-alert .uxpcore_alert__body .uxpcore_dynamicform__container {
  width: 100%;
  background-color: transparent;
}
.uxpcore_alert--form-alert .uxpcore_alert__body .uxpcore_dynamicform__body {
  padding: 0;
}
.uxpcore_alert--form-alert .uxpcore_alert__body .uxpcore_dynamicform__footer {
  padding: 1.25rem 0 0 0;
  border-top: 1px solid var(--borderColor);
  margin-top: 1.25rem;
}
.uxpcore_alert--info {
  border-color: var(--alertInfoBorderColor);
  color: var(--alertInfoTextColor);
  background-color: var(--alertInfoBGColor);
}
.uxpcore_alert--error {
  border-color: var(--alertErrorBorderColor);
  color: var(--alertErrorTextColor);
  background-color: var(--alertErrorBGColor);
}
.uxpcore_alert--warning {
  border-color: var(--alertWarningBorderColor);
  color: var(--alertWarningTextColor);
  background-color: var(--alertWarningBGColor);
}
.uxpcore_alert--success {
  border-color: var(--alertSuccessBorderColor);
  color: var(--alertSuccessTextColor);
  background-color: var(--alertSuccessBGColor);
}

.uxpcore_localisation_form {
  width: 100%;
  height: auto;
  background-color: var(--primaryBGColor);
  padding: 1rem;
  border-radius: 8px;
}
.uxpcore_localisation_form .uxpcore_localisation_form__content {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  max-height: 55vh;
  overflow-y: auto;
  padding-right: 0.5rem;
}
.uxpcore_localisation_form .uxpcore_localisation_form__label {
  width: 100%;
  height: auto;
  padding: 0.5rem 0;
}
.uxpcore_localisation_form .uxpcore_localisation_form__label .uxpcore_localisation_form__language_name {
  font-weight: var(--fontWeightBold);
  color: var(--primaryTextColor);
}
.uxpcore_localisation_form .uxpcore_localisation_form__footer {
  width: 100%;
  height: auto;
  padding-top: 1rem;
  margin-top: 0.5rem;
  border-top: 1px solid var(--borderColor);
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.5rem;
}
.uxpcore_localisation_form .uxpcore_localisation_form__footer .uxp-button {
  margin: 0;
}
.uxpcore_localisation_form .uxpcore_localisation_form__footer .uxp-button.active.uxpcore_localisation_form__save_btn {
  color: var(--white);
}
.uxpcore_localisation_form .uxpcore_localisation_form__skeleton {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: 0.5rem 0;
}
.uxpcore_localisation_form .uxpcore_localisation_form__skeleton .uxpcore_localisation_form__skeleton_item {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.uxpcore_localisation_form__translatebutton {
  min-width: 1.5rem;
  min-height: 2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.4rem;
  cursor: pointer;
  color: var(--primaryTextColor);
}
.uxpcore_localisation_form__translatebutton:hover:not(.uxpcore_localisation_form__translatebutton--translating) {
  color: var(--primaryColor);
}
.uxpcore_localisation_form__translatebutton.uxpcore_localisation_form__translatebutton--translating {
  cursor: not-allowed;
  opacity: 0.7;
}

.uxpcore_localisation_form_modal__dialog .uxpcore_modal__body {
  min-width: 40rem;
  padding: 0;
  margin: 0;
}

.main-block {
  background-color: white;
}
.main-block.render-ui .content-block {
  flex-basis: 100%;
}
.main-block.render-ui .content-block.no-header .main-content-block {
  height: 100% !important;
  position: relative;
}
.main-block.render-ui .content-block.no-header .main-content-block .uxp-responsive-page-container {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  background-color: inherit;
}
.main-block.render-ui .content-block.no-header .main-content-block .uxp-responsive-page-container.mobile .widget-wrapper {
  box-shadow: none !important;
  border-radius: 0;
}

.curved-triangle-shape {
  position: relative;
  width: 200px;
  height: 400px;
  background: linear-gradient(180deg, rgba(147, 167, 234, 0.4) 0%, rgba(147, 167, 234, 0.8) 100%);
  clip-path: path("M 50 0 Q -30 200, 50 400 L 200 400 L 200 0 Z");
}

body.uxp-glass-theme {
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  background-attachment: fixed;
}
body.uxp-glass-theme #root {
  background-color: transparent;
}

.uxpcore_glasseffect {
  background: var(--secondaryBGColor);
  backdrop-filter: blur(150px);
  -webkit-backdrop-filter: blur(150px);
  border: 1px solid var(--borderColor);
}

.uxpcore_auth_app__container {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--bg-primary);
}
.uxpcore_auth_app__wrapper {
  width: 100%;
  max-width: 500px;
  padding: 2rem;
}

.uxpcore_authlayout__container {
  min-height: 100vh;
  width: 100%;
  height: 100%;
  position: relative;
  overflow: auto;
}

.uxpcore_loginform__container {
  width: 100%;
  min-height: 100vh;
  position: relative;
}
.uxpcore_loginform__island-wrapper {
  min-height: 100vh;
  display: flex;
}
.uxpcore_loginform__island-wrapper--center {
  justify-content: center;
  align-items: center;
  padding: var(--auth-island-spacing-y, 0) var(--auth-island-spacing-x, 0);
}
.uxpcore_loginform__island-wrapper--top-left {
  justify-content: flex-start;
  align-items: flex-start;
  padding-top: var(--auth-island-spacing-y, 0);
  padding-left: var(--auth-island-spacing-x, 0);
}
.uxpcore_loginform__island-wrapper--top-right {
  justify-content: flex-end;
  align-items: flex-start;
  padding-top: var(--auth-island-spacing-y, 0);
  padding-right: var(--auth-island-spacing-x, 0);
}
.uxpcore_loginform__island-wrapper--bottom-left {
  justify-content: flex-start;
  align-items: flex-end;
  padding-bottom: var(--auth-island-spacing-y, 0);
  padding-left: var(--auth-island-spacing-x, 0);
}
.uxpcore_loginform__island-wrapper--bottom-right {
  justify-content: flex-end;
  align-items: flex-end;
  padding-bottom: var(--auth-island-spacing-y, 0);
  padding-right: var(--auth-island-spacing-x, 0);
}
.uxpcore_loginform__island {
  width: 100%;
  padding: var(--auth-island-padding, 0);
  border-radius: var(--auth-island-border-radius, 0);
  background: var(--auth-island-bg, transparent);
  border: var(--auth-island-border-width, 0) solid var(--auth-island-border-color, transparent);
  box-shadow: var(--auth-island-shadow, none);
  position: relative;
}
.uxpcore_loginform__island--horizontal {
  max-width: var(--auth-island-max-width, 0);
}
.uxpcore_loginform__island--vertical {
  display: flex;
  gap: var(--auth-island-gap, 0);
  max-width: var(--auth-island-max-width, 0);
}
.uxpcore_loginform__island--vertical .uxpcore_loginform__island-left {
  flex: var(--auth-island-left-width, 1);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: var(--auth-island-left-padding, 0);
  gap: 1.5rem;
  background: var(--auth-island-left-bg, transparent);
  border-radius: inherit;
}
.uxpcore_loginform__island--vertical .uxpcore_loginform__island-left .uxpcore_loginform__branding,
.uxpcore_loginform__island--vertical .uxpcore_loginform__island-left .uxpcore_loginform__title,
.uxpcore_loginform__island--vertical .uxpcore_loginform__island-left .uxpcore_loginform__description {
  color: var(--auth-island-left-text, inherit);
}
.uxpcore_loginform__island--vertical .uxpcore_loginform__island-left .uxpcore_loginform__title {
  font-size: 2rem;
}
.uxpcore_loginform__island--vertical .uxpcore_loginform__island-left .uxpcore_loginform__description {
  font-size: 1.1rem;
}
.uxpcore_loginform__island--vertical .uxpcore_loginform__island-right {
  flex: var(--auth-island-right-width, 1);
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: var(--auth-island-right-padding, 0);
  background: var(--auth-island-right-bg, transparent);
  border-radius: inherit;
}
.uxpcore_loginform__island--vertical .uxpcore_loginform__island-right * {
  color: var(--auth-island-right-text, inherit);
}
.uxpcore_loginform__island--glass {
  background: rgba(255, 255, 255, 0.1) !important;
  backdrop-filter: blur(150px);
  -webkit-backdrop-filter: blur(150px);
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
}
.uxpcore_loginform__island--glass * {
  color: white !important;
}
.uxpcore_loginform__fullpage {
  display: flex;
  min-height: 100vh;
}
.uxpcore_loginform__fullpage-left {
  flex: var(--auth-fullpage-left-width, 1);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: var(--auth-fullpage-left-padding, 0);
  gap: 2rem;
  background: var(--auth-fullpage-left-bg, transparent);
  color: var(--auth-fullpage-left-text, inherit);
}
.uxpcore_loginform__fullpage-left .uxpcore_loginform__branding,
.uxpcore_loginform__fullpage-left .uxpcore_loginform__title,
.uxpcore_loginform__fullpage-left .uxpcore_loginform__description {
  color: var(--auth-fullpage-left-text, inherit);
}
.uxpcore_loginform__fullpage-left .uxpcore_loginform__title {
  font-size: 2.5rem;
}
.uxpcore_loginform__fullpage-left .uxpcore_loginform__description {
  font-size: 1.2rem;
}
.uxpcore_loginform__fullpage-right {
  flex: var(--auth-fullpage-right-width, 1);
  display: flex;
  justify-content: center;
  align-items: center;
  padding: var(--auth-fullpage-right-padding, 0);
  background: var(--auth-fullpage-right-bg, transparent);
  color: var(--auth-fullpage-right-text, inherit);
}
.uxpcore_loginform__form-container {
  width: 100%;
  max-width: 28rem;
}
.uxpcore_loginform__branding {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 1.5rem;
}
.uxpcore_loginform__logo {
  max-width: 15rem;
  max-height: 5rem;
  object-fit: contain;
}
.uxpcore_loginform__title {
  font-size: 1.75rem;
  font-weight: var(--fontWeightBold);
  padding: 0.4rem;
  text-align: center;
  color: var(--auth-island-text-color, inherit);
  margin: 0;
}
.uxpcore_loginform__description {
  font-size: 1rem;
  padding: 0.5rem;
  text-align: center;
  line-height: 1.5;
  margin: 0;
  color: var(--auth-island-text-color, inherit);
}
.uxpcore_loginform__flash-message {
  padding: 1rem;
  margin-bottom: 1.5rem;
  border-radius: 0.5rem;
  background-color: rgba(33, 150, 243, 0.1);
  border: 1px solid rgba(33, 150, 243, 0.3);
  color: #1976d2;
  font-size: 0.95rem;
  line-height: 1.4;
}
.uxpcore_loginform__form-fields {
  display: flex;
  flex-direction: column;
  padding: 1rem;
  justify-content: center;
  align-items: center;
}
.uxpcore_loginform__form-fields .uxpcore_form-field {
  padding: 0.5rem;
}
.uxpcore_loginform__form-fields .uxpcore_input:not(.uxpcore_checkbox-wrapper) {
  background-color: var(--auth-input-bg, transparent) !important;
  color: var(--auth-input-text, inherit) !important;
  border: 1px solid var(--auth-input-border, transparent) !important;
  border-radius: var(--auth-input-border-radius, 0) !important;
}
.uxpcore_loginform__form-fields .uxpcore_input:not(.uxpcore_checkbox-wrapper):focus {
  border-color: var(--auth-input-border-focus, transparent) !important;
}
.uxpcore_loginform__form-fields .uxpcore_input:not(.uxpcore_checkbox-wrapper).uxpcore_input--invalid {
  border-color: var(--auth-error-border, #D92D20) !important;
}
.uxpcore_loginform__form-fields .uxpcore_checkbox-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.5rem;
  color: var(--auth-island-text-color, inherit);
}
.uxpcore_loginform__form-fields .uxpcore_checkbox-wrapper .checkbox-placeholder {
  border: 1px solid var(--auth-input-border, transparent) !important;
}
.uxpcore_loginform__actions {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
}
.uxpcore_loginform__login-btn {
  width: auto;
  border-radius: var(--auth-btn-border-radius, 0) !important;
  padding: 0.6rem 3rem;
  font-size: 1.3rem;
  font-weight: var(--fontWeightSemibold);
  background: var(--auth-btn-bg, transparent) !important;
  color: var(--auth-btn-text, inherit) !important;
  border: 1px solid var(--auth-btn-border, transparent) !important;
  transition: all 0.2s;
}
.uxpcore_loginform__login-btn:hover:not(:disabled) {
  background: var(--auth-btn-bg-hover, transparent) !important;
  color: var(--auth-btn-text-hover, inherit) !important;
  border-color: var(--auth-btn-border-hover, transparent) !important;
}
.uxpcore_loginform__login-btn:disabled {
  background: var(--auth-btn-bg-disabled, transparent) !important;
  color: var(--auth-btn-text-disabled, inherit) !important;
  cursor: not-allowed;
}
.uxpcore_loginform__login-btn:active:not(:disabled) {
  background: var(--auth-btn-bg-hover, transparent) !important;
  color: var(--auth-btn-text-hover, inherit) !important;
  border-color: var(--auth-btn-border-hover, transparent) !important;
}
.uxpcore_loginform__footer {
  margin-top: 0.5rem;
  text-align: center;
}
.uxpcore_loginform__forgot-link {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  border-radius: 2rem;
  background-color: transparent;
  color: var(--auth-link-color, inherit);
  text-decoration: none;
  font-size: 0.875rem;
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease;
}
.uxpcore_loginform__forgot-link:hover {
  background-color: rgba(0, 0, 0, 0.05);
  color: var(--auth-link-color-hover, inherit);
}
.uxpcore_loginform__error-message {
  width: 100%;
  padding: 0.5rem;
  text-align: center;
  color: var(--auth-error-border, #D92D20) !important;
}
.uxpcore_loginform__language-selector-wrapper {
  position: absolute;
  top: 0;
  inset-inline-end: 0;
  padding: 0.8rem;
}

.uxpcore_resetpasswordform__container {
  width: 100%;
  min-height: 100vh;
  position: relative;
}
.uxpcore_resetpasswordform__island-wrapper {
  min-height: 100vh;
  display: flex;
}
.uxpcore_resetpasswordform__island-wrapper--center {
  justify-content: center;
  align-items: center;
  padding: var(--auth-island-spacing-y, 0) var(--auth-island-spacing-x, 0);
}
.uxpcore_resetpasswordform__island-wrapper--top-left {
  justify-content: flex-start;
  align-items: flex-start;
  padding-top: var(--auth-island-spacing-y, 0);
  padding-left: var(--auth-island-spacing-x, 0);
}
.uxpcore_resetpasswordform__island-wrapper--top-right {
  justify-content: flex-end;
  align-items: flex-start;
  padding-top: var(--auth-island-spacing-y, 0);
  padding-right: var(--auth-island-spacing-x, 0);
}
.uxpcore_resetpasswordform__island-wrapper--bottom-left {
  justify-content: flex-start;
  align-items: flex-end;
  padding-bottom: var(--auth-island-spacing-y, 0);
  padding-left: var(--auth-island-spacing-x, 0);
}
.uxpcore_resetpasswordform__island-wrapper--bottom-right {
  justify-content: flex-end;
  align-items: flex-end;
  padding-bottom: var(--auth-island-spacing-y, 0);
  padding-right: var(--auth-island-spacing-x, 0);
}
.uxpcore_resetpasswordform__island {
  width: 100%;
  padding: var(--auth-island-padding, 0);
  border-radius: var(--auth-island-border-radius, 0);
  background: var(--auth-island-bg, transparent);
  border: var(--auth-island-border-width, 0) solid var(--auth-island-border-color, transparent);
  box-shadow: var(--auth-island-shadow, none);
  position: relative;
}
.uxpcore_resetpasswordform__island--horizontal {
  max-width: var(--auth-island-max-width, 0);
}
.uxpcore_resetpasswordform__island--vertical {
  display: flex;
  gap: var(--auth-island-gap, 0);
  max-width: var(--auth-island-max-width, 0);
}
.uxpcore_resetpasswordform__island--vertical .uxpcore_resetpasswordform__island-left {
  flex: var(--auth-island-left-width, 1);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: var(--auth-island-left-padding, 0);
  gap: 1.5rem;
  background: var(--auth-island-left-bg, transparent);
  border-radius: inherit;
}
.uxpcore_resetpasswordform__island--vertical .uxpcore_resetpasswordform__island-left .uxpcore_resetpasswordform__branding,
.uxpcore_resetpasswordform__island--vertical .uxpcore_resetpasswordform__island-left .uxpcore_resetpasswordform__title,
.uxpcore_resetpasswordform__island--vertical .uxpcore_resetpasswordform__island-left .uxpcore_resetpasswordform__description {
  color: var(--auth-island-left-text, inherit);
}
.uxpcore_resetpasswordform__island--vertical .uxpcore_resetpasswordform__island-left .uxpcore_resetpasswordform__title {
  font-size: 2rem;
}
.uxpcore_resetpasswordform__island--vertical .uxpcore_resetpasswordform__island-left .uxpcore_resetpasswordform__description {
  font-size: 1.1rem;
}
.uxpcore_resetpasswordform__island--vertical .uxpcore_resetpasswordform__island-right {
  flex: var(--auth-island-right-width, 1);
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: var(--auth-island-right-padding, 0);
  background: var(--auth-island-right-bg, transparent);
  border-radius: inherit;
}
.uxpcore_resetpasswordform__island--vertical .uxpcore_resetpasswordform__island-right * {
  color: var(--auth-island-right-text, inherit);
}
.uxpcore_resetpasswordform__island--glass {
  background: rgba(255, 255, 255, 0.1) !important;
  backdrop-filter: blur(150px);
  -webkit-backdrop-filter: blur(150px);
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
}
.uxpcore_resetpasswordform__island--glass * {
  color: white !important;
}
.uxpcore_resetpasswordform__fullpage {
  display: flex;
  min-height: 100vh;
}
.uxpcore_resetpasswordform__fullpage-left {
  flex: var(--auth-fullpage-left-width, 1);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: var(--auth-fullpage-left-padding, 0);
  gap: 2rem;
  background: var(--auth-fullpage-left-bg, transparent);
  color: var(--auth-fullpage-left-text, inherit);
}
.uxpcore_resetpasswordform__fullpage-left .uxpcore_resetpasswordform__branding,
.uxpcore_resetpasswordform__fullpage-left .uxpcore_resetpasswordform__title,
.uxpcore_resetpasswordform__fullpage-left .uxpcore_resetpasswordform__description {
  color: var(--auth-fullpage-left-text, inherit);
}
.uxpcore_resetpasswordform__fullpage-left .uxpcore_resetpasswordform__title {
  font-size: 2.5rem;
}
.uxpcore_resetpasswordform__fullpage-left .uxpcore_resetpasswordform__description {
  font-size: 1.2rem;
}
.uxpcore_resetpasswordform__fullpage-right {
  flex: var(--auth-fullpage-right-width, 1);
  display: flex;
  justify-content: center;
  align-items: center;
  padding: var(--auth-fullpage-right-padding, 0);
  background: var(--auth-fullpage-right-bg, transparent);
  color: var(--auth-fullpage-right-text, inherit);
}
.uxpcore_resetpasswordform__form-container {
  width: 100%;
  max-width: 28rem;
}
.uxpcore_resetpasswordform__branding {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 1.5rem;
}
.uxpcore_resetpasswordform__logo {
  max-width: 15rem;
  max-height: 5rem;
  object-fit: contain;
}
.uxpcore_resetpasswordform__title {
  font-size: 1.75rem;
  font-weight: var(--fontWeightBold);
  padding: 0.4rem;
  text-align: center;
  color: var(--auth-island-text-color, inherit);
  margin: 0;
}
.uxpcore_resetpasswordform__description {
  font-size: 1rem;
  padding: 0.5rem;
  text-align: center;
  line-height: 1.5;
  margin: 0;
  color: var(--auth-island-text-color, inherit);
}
.uxpcore_resetpasswordform__form-title {
  font-size: 1.5rem;
  font-weight: var(--fontWeightSemibold);
  text-align: center;
  color: var(--auth-island-text-color, inherit);
  margin: 0 0 0.5rem 0;
}
.uxpcore_resetpasswordform__form-description {
  font-size: 0.875rem;
  text-align: center;
  color: var(--auth-island-text-color, inherit);
  opacity: 0.8;
  margin: 0 0 1.5rem 0;
}
.uxpcore_resetpasswordform__status {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  padding: 2rem 1rem;
  text-align: center;
}
.uxpcore_resetpasswordform__status-title {
  font-size: 1.5rem;
  font-weight: var(--fontWeightSemibold);
  color: var(--auth-island-text-color, inherit);
  margin: 0;
}
.uxpcore_resetpasswordform__status-message {
  font-size: 1rem;
  line-height: 1.5;
  color: var(--auth-island-text-color, inherit);
  margin: 0;
}
.uxpcore_resetpasswordform__link {
  color: var(--auth-link-color, #1976d2);
  text-decoration: none;
  font-weight: var(--fontWeightMedium);
}
.uxpcore_resetpasswordform__link:hover {
  color: var(--auth-link-color-hover, #1565c0);
  text-decoration: underline;
}
.uxpcore_resetpasswordform__form-fields {
  display: flex;
  flex-direction: column;
  padding: 1rem;
  justify-content: center;
  align-items: center;
}
.uxpcore_resetpasswordform__form-fields .uxpcore_form-field {
  padding: 0.5rem;
}
.uxpcore_resetpasswordform__form-fields .uxpcore_input:not(.uxpcore_checkbox-wrapper) {
  background-color: var(--auth-input-bg, transparent) !important;
  color: var(--auth-input-text, inherit) !important;
  border: 1px solid var(--auth-input-border, transparent) !important;
  border-radius: var(--auth-input-border-radius, 0) !important;
}
.uxpcore_resetpasswordform__form-fields .uxpcore_input:not(.uxpcore_checkbox-wrapper):focus {
  border-color: var(--auth-input-border-focus, transparent) !important;
}
.uxpcore_resetpasswordform__form-fields .uxpcore_input:not(.uxpcore_checkbox-wrapper):disabled {
  opacity: 0.6;
  cursor: not-allowed;
}
.uxpcore_resetpasswordform__form-fields .uxpcore_input:not(.uxpcore_checkbox-wrapper).uxpcore_input--invalid {
  border-color: var(--auth-error-border, #D92D20) !important;
}
.uxpcore_resetpasswordform__error-message {
  width: 100%;
  padding: 0.5rem;
  text-align: center;
  color: var(--auth-error-border, #D92D20) !important;
}
.uxpcore_resetpasswordform__success-message {
  width: 100%;
  padding: 1rem;
  margin-bottom: 0.5rem;
  font-size: 1rem;
  line-height: 1.5;
  text-align: center;
  color: var(--auth-island-text-color, inherit);
}
.uxpcore_resetpasswordform__actions {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  margin-top: 1rem;
}
.uxpcore_resetpasswordform__submit-btn {
  width: auto;
  border-radius: var(--auth-btn-border-radius, 0) !important;
  padding: 0.6rem 3rem;
  font-size: 1.3rem;
  font-weight: var(--fontWeightSemibold);
  background: var(--auth-btn-bg, transparent) !important;
  color: var(--auth-btn-text, inherit) !important;
  border: 1px solid var(--auth-btn-border, transparent) !important;
  transition: all 0.2s;
}
.uxpcore_resetpasswordform__submit-btn:hover:not(:disabled) {
  background: var(--auth-btn-bg-hover, transparent) !important;
  color: var(--auth-btn-text-hover, inherit) !important;
  border-color: var(--auth-btn-border-hover, transparent) !important;
}
.uxpcore_resetpasswordform__submit-btn:disabled {
  background: var(--auth-btn-bg-disabled, transparent) !important;
  color: var(--auth-btn-text-disabled, inherit) !important;
  cursor: not-allowed;
}
.uxpcore_resetpasswordform__submit-btn:active:not(:disabled) {
  background: var(--auth-btn-bg-hover, transparent) !important;
  color: var(--auth-btn-text-hover, inherit) !important;
  border-color: var(--auth-btn-border-hover, transparent) !important;
}
.uxpcore_resetpasswordform__language-selector-wrapper {
  position: absolute;
  top: 0;
  inset-inline-end: 0;
  padding: 0.8rem;
}
.uxpcore_resetpasswordform__language-selector-wrapper--absolute {
  position: absolute;
  top: 0;
  inset-inline-end: 0;
  padding: 0.8rem;
}

.uxpcore_securityquestionform__container {
  width: 100%;
  min-height: 100vh;
  position: relative;
}
.uxpcore_securityquestionform__island-wrapper {
  min-height: 100vh;
  display: flex;
}
.uxpcore_securityquestionform__island-wrapper--center {
  justify-content: center;
  align-items: center;
  padding: var(--auth-island-spacing-y, 0) var(--auth-island-spacing-x, 0);
}
.uxpcore_securityquestionform__island-wrapper--top-left {
  justify-content: flex-start;
  align-items: flex-start;
  padding-top: var(--auth-island-spacing-y, 0);
  padding-left: var(--auth-island-spacing-x, 0);
}
.uxpcore_securityquestionform__island-wrapper--top-right {
  justify-content: flex-end;
  align-items: flex-start;
  padding-top: var(--auth-island-spacing-y, 0);
  padding-right: var(--auth-island-spacing-x, 0);
}
.uxpcore_securityquestionform__island-wrapper--bottom-left {
  justify-content: flex-start;
  align-items: flex-end;
  padding-bottom: var(--auth-island-spacing-y, 0);
  padding-left: var(--auth-island-spacing-x, 0);
}
.uxpcore_securityquestionform__island-wrapper--bottom-right {
  justify-content: flex-end;
  align-items: flex-end;
  padding-bottom: var(--auth-island-spacing-y, 0);
  padding-right: var(--auth-island-spacing-x, 0);
}
.uxpcore_securityquestionform__island {
  width: 100%;
  padding: var(--auth-island-padding, 0);
  border-radius: var(--auth-island-border-radius, 0);
  background: var(--auth-island-bg, transparent);
  border: var(--auth-island-border-width, 0) solid var(--auth-island-border-color, transparent);
  box-shadow: var(--auth-island-shadow, none);
  position: relative;
}
.uxpcore_securityquestionform__island--horizontal {
  max-width: var(--auth-island-max-width, 0);
}
.uxpcore_securityquestionform__island--vertical {
  display: flex;
  gap: var(--auth-island-gap, 0);
  max-width: var(--auth-island-max-width, 0);
}
.uxpcore_securityquestionform__island--vertical .uxpcore_securityquestionform__island-left {
  flex: var(--auth-island-left-width, 1);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: var(--auth-island-left-padding, 0);
  gap: 1.5rem;
  background: var(--auth-island-left-bg, transparent);
  border-radius: inherit;
}
.uxpcore_securityquestionform__island--vertical .uxpcore_securityquestionform__island-left .uxpcore_securityquestionform__branding,
.uxpcore_securityquestionform__island--vertical .uxpcore_securityquestionform__island-left .uxpcore_securityquestionform__title,
.uxpcore_securityquestionform__island--vertical .uxpcore_securityquestionform__island-left .uxpcore_securityquestionform__description {
  color: var(--auth-island-left-text, inherit);
}
.uxpcore_securityquestionform__island--vertical .uxpcore_securityquestionform__island-left .uxpcore_securityquestionform__title {
  font-size: 2rem;
}
.uxpcore_securityquestionform__island--vertical .uxpcore_securityquestionform__island-left .uxpcore_securityquestionform__description {
  font-size: 1.1rem;
}
.uxpcore_securityquestionform__island--vertical .uxpcore_securityquestionform__island-right {
  flex: var(--auth-island-right-width, 1);
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: var(--auth-island-right-padding, 0);
  background: var(--auth-island-right-bg, transparent);
  border-radius: inherit;
}
.uxpcore_securityquestionform__island--vertical .uxpcore_securityquestionform__island-right * {
  color: var(--auth-island-right-text, inherit);
}
.uxpcore_securityquestionform__island--glass {
  background: rgba(255, 255, 255, 0.1) !important;
  backdrop-filter: blur(150px);
  -webkit-backdrop-filter: blur(150px);
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
}
.uxpcore_securityquestionform__island--glass * {
  color: white !important;
}
.uxpcore_securityquestionform__fullpage {
  display: flex;
  min-height: 100vh;
}
.uxpcore_securityquestionform__fullpage-left {
  flex: var(--auth-fullpage-left-width, 1);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: var(--auth-fullpage-left-padding, 0);
  gap: 2rem;
  background: var(--auth-fullpage-left-bg, transparent);
  color: var(--auth-fullpage-left-text, inherit);
}
.uxpcore_securityquestionform__fullpage-left .uxpcore_securityquestionform__branding,
.uxpcore_securityquestionform__fullpage-left .uxpcore_securityquestionform__title,
.uxpcore_securityquestionform__fullpage-left .uxpcore_securityquestionform__description {
  color: var(--auth-fullpage-left-text, inherit);
}
.uxpcore_securityquestionform__fullpage-left .uxpcore_securityquestionform__title {
  font-size: 2.5rem;
}
.uxpcore_securityquestionform__fullpage-left .uxpcore_securityquestionform__description {
  font-size: 1.2rem;
}
.uxpcore_securityquestionform__fullpage-right {
  flex: var(--auth-fullpage-right-width, 1);
  display: flex;
  justify-content: center;
  align-items: center;
  padding: var(--auth-fullpage-right-padding, 0);
  background: var(--auth-fullpage-right-bg, transparent);
  color: var(--auth-fullpage-right-text, inherit);
}
.uxpcore_securityquestionform__form-container {
  width: 100%;
  max-width: 28rem;
}
.uxpcore_securityquestionform__branding {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 1.5rem;
}
.uxpcore_securityquestionform__logo {
  max-width: 15rem;
  max-height: 5rem;
  object-fit: contain;
}
.uxpcore_securityquestionform__title {
  font-size: 1.75rem;
  font-weight: var(--fontWeightBold);
  padding: 0.4rem;
  text-align: center;
  color: var(--auth-island-text-color, inherit);
  margin: 0;
}
.uxpcore_securityquestionform__description {
  font-size: 1rem;
  padding: 0.5rem;
  text-align: center;
  line-height: 1.5;
  margin: 0;
  color: var(--auth-island-text-color, inherit);
}
.uxpcore_securityquestionform__status {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  padding: 2rem 1rem;
  text-align: center;
}
.uxpcore_securityquestionform__status-title {
  font-size: 1.5rem;
  font-weight: var(--fontWeightSemibold);
  color: var(--auth-island-text-color, inherit);
  margin: 0;
}
.uxpcore_securityquestionform__status-message {
  font-size: 1rem;
  line-height: 1.5;
  color: var(--auth-island-text-color, inherit);
  margin: 0;
}
.uxpcore_securityquestionform__link {
  color: var(--auth-link-color, #1976d2);
  text-decoration: none;
  font-weight: var(--fontWeightMedium);
}
.uxpcore_securityquestionform__link:hover {
  color: var(--auth-link-color-hover, #1565c0);
  text-decoration: underline;
}
.uxpcore_securityquestionform__form-fields {
  display: flex;
  flex-direction: column;
  padding: 1rem;
  justify-content: center;
  align-items: center;
}
.uxpcore_securityquestionform__form-fields .uxpcore_form-field {
  padding: 0.5rem;
}
.uxpcore_securityquestionform__form-fields .uxpcore_input:not(.uxpcore_checkbox-wrapper) {
  background-color: var(--auth-input-bg, transparent) !important;
  color: var(--auth-input-text, inherit) !important;
  border: 1px solid var(--auth-input-border, transparent) !important;
  border-radius: var(--auth-input-border-radius, 0) !important;
}
.uxpcore_securityquestionform__form-fields .uxpcore_input:not(.uxpcore_checkbox-wrapper):focus {
  border-color: var(--auth-input-border-focus, transparent) !important;
}
.uxpcore_securityquestionform__form-fields .uxpcore_input:not(.uxpcore_checkbox-wrapper).uxpcore_input--invalid {
  border-color: var(--auth-error-border, #D92D20) !important;
}
.uxpcore_securityquestionform__question {
  font-size: 0.95rem;
  font-weight: var(--fontWeightMedium);
  margin-bottom: 0.5rem;
  color: var(--auth-island-text-color, inherit);
  line-height: 1.4;
}
.uxpcore_securityquestionform__error-message {
  width: 100%;
  padding: 0.5rem;
  text-align: center;
  color: var(--auth-error-border, #D92D20) !important;
}
.uxpcore_securityquestionform__success-message {
  width: 100%;
  padding: 1rem;
  margin-bottom: 0.5rem;
  font-size: 1rem;
  line-height: 1.5;
  text-align: center;
  color: var(--auth-island-text-color, inherit);
}
.uxpcore_securityquestionform__actions {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  margin-top: 1rem;
}
.uxpcore_securityquestionform__submit-btn {
  width: auto;
  border-radius: var(--auth-btn-border-radius, 0) !important;
  padding: 0.6rem 3rem;
  font-size: 1.3rem;
  font-weight: var(--fontWeightSemibold);
  background: var(--auth-btn-bg, transparent) !important;
  color: var(--auth-btn-text, inherit) !important;
  border: 1px solid var(--auth-btn-border, transparent) !important;
  transition: all 0.2s;
}
.uxpcore_securityquestionform__submit-btn:hover:not(:disabled) {
  background: var(--auth-btn-bg-hover, transparent) !important;
  color: var(--auth-btn-text-hover, inherit) !important;
  border-color: var(--auth-btn-border-hover, transparent) !important;
}
.uxpcore_securityquestionform__submit-btn:disabled {
  background: var(--auth-btn-bg-disabled, transparent) !important;
  color: var(--auth-btn-text-disabled, inherit) !important;
  cursor: not-allowed;
}
.uxpcore_securityquestionform__submit-btn:active:not(:disabled) {
  background: var(--auth-btn-bg-hover, transparent) !important;
  color: var(--auth-btn-text-hover, inherit) !important;
  border-color: var(--auth-btn-border-hover, transparent) !important;
}
.uxpcore_securityquestionform__language-selector-wrapper {
  position: absolute;
  top: 0;
  inset-inline-end: 0;
  padding: 0.8rem;
}
.uxpcore_securityquestionform__language-selector-wrapper--absolute {
  position: absolute;
  top: 0;
  inset-inline-end: 0;
  padding: 0.8rem;
}

.uxpcore_forgot_password__form {
  width: 35rem;
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.uxpcore_forgot_password__description {
  width: 100%;
  font-size: 1rem;
  padding: 0.5rem;
  line-height: 1.5;
  color: var(--auth-island-text-color, inherit);
  text-align: center;
  margin: 0;
}
.uxpcore_forgot_password__form-fields {
  width: 100%;
  display: flex;
  flex-direction: column;
  padding: 1rem;
  justify-content: center;
  align-items: center;
}
.uxpcore_forgot_password__form-fields .uxpcore_form-field {
  padding: 0.5rem;
}
.uxpcore_forgot_password__form-fields .uxpcore_input {
  background-color: var(--auth-input-bg, transparent) !important;
  color: var(--auth-input-text, inherit) !important;
  border: 1px solid var(--auth-input-border, transparent) !important;
  border-radius: var(--auth-input-border-radius, 0) !important;
}
.uxpcore_forgot_password__form-fields .uxpcore_input:focus {
  border-color: var(--auth-input-border-focus, transparent) !important;
}
.uxpcore_forgot_password__form-fields .uxpcore_input.uxpcore_input--invalid {
  border-color: var(--auth-error-border, inherit) !important;
}
.uxpcore_forgot_password__form-fields .uxpcore_recaptcha-field {
  margin: 1rem 0;
}
.uxpcore_forgot_password__error-message {
  width: 100%;
  padding: 0.5rem;
  text-align: center;
  color: var(--auth-error-border, #D92D20) !important;
}
.uxpcore_forgot_password__success-message {
  width: 100%;
  padding: 1rem;
  margin-bottom: 0.5rem;
  font-size: 1rem;
  line-height: 1.5;
  text-align: center;
  color: var(--auth-island-text-color, inherit);
}
.uxpcore_forgot_password__actions {
  width: 100%;
  height: auto;
  padding: 1rem;
  padding-bottom: 0;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  border-top: 1px solid var(--auth-island-border-color) !important;
}
.uxpcore_forgot_password__cancel-btn, .uxpcore_forgot_password__submit-btn, .uxpcore_forgot_password__close-btn {
  border-radius: 3rem;
}
.uxpcore_forgot_password__submit-btn {
  background: var(--auth-btn-bg, transparent) !important;
  color: var(--auth-btn-text, inherit) !important;
  border: 1px solid var(--auth-btn-border, transparent) !important;
  transition: all 0.2s;
}
.uxpcore_forgot_password__submit-btn:hover:not(:disabled) {
  background: var(--auth-btn-bg-hover, transparent) !important;
  color: var(--auth-btn-text-hover, inherit) !important;
  border-color: var(--auth-btn-border-hover, transparent) !important;
}
.uxpcore_forgot_password__submit-btn:disabled {
  background: var(--auth-btn-bg-disabled, transparent) !important;
  color: var(--auth-btn-text-disabled, inherit) !important;
  cursor: not-allowed;
}
.uxpcore_forgot_password__submit-btn:active:not(:disabled) {
  background: var(--auth-btn-bg-hover, transparent) !important;
  color: var(--auth-btn-text-hover, inherit) !important;
  border-color: var(--auth-btn-border-hover, transparent) !important;
}
.uxpcore_forgot_password__close-btn {
  background: var(--auth-btn-bg, transparent) !important;
  color: var(--auth-btn-text, inherit) !important;
  border: 1px solid var(--auth-btn-border, transparent) !important;
  transition: all 0.2s;
}
.uxpcore_forgot_password__close-btn:hover:not(:disabled) {
  background: var(--auth-btn-bg-hover, transparent) !important;
  color: var(--auth-btn-text-hover, inherit) !important;
  border-color: var(--auth-btn-border-hover, transparent) !important;
}
.uxpcore_forgot_password__close-btn:active:not(:disabled) {
  background: var(--auth-btn-bg-hover, transparent) !important;
  color: var(--auth-btn-text-hover, inherit) !important;
  border-color: var(--auth-btn-border-hover, transparent) !important;
}

.uxpcore_logout_handler__container {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--bg-primary);
}
.uxpcore_logout_handler__message {
  text-align: center;
  color: var(--text-primary);
}
.uxpcore_logout_handler__message h2 {
  font-size: 1.5rem;
  margin-bottom: 1rem;
}
.uxpcore_logout_handler__message p {
  color: var(--text-secondary);
}

.uxpcore_loginform__sso-divider {
  display: flex;
  align-items: center;
  text-align: center;
  padding: 1.5rem 0;
}
.uxpcore_loginform__sso-divider::before, .uxpcore_loginform__sso-divider::after {
  content: "";
  flex: 1;
  border-bottom: 1px solid var(--auth-card-border, #ccc);
}
.uxpcore_loginform__sso-divider span {
  padding: 0 1rem;
  color: var(--auth-island-text-color, inherit);
  font-size: 0.9rem;
}
.uxpcore_loginform__sso-buttons {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
  width: 100%;
}
.uxpcore_loginform__sso-btn {
  width: 16rem;
  height: 3.1rem;
  display: block;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  border-radius: 5rem;
  transition: transform 0.2s, opacity 0.2s, box-shadow 0.2s;
  cursor: pointer;
}
.uxpcore_loginform__sso-btn:hover {
  transform: scale(1.02);
  opacity: 0.95;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}
.uxpcore_loginform__sso-btn--google {
  background-color: var(--auth-sso-google-bg, #0b0b0c);
}
.uxpcore_loginform__sso-btn--microsoft {
  background-color: var(--auth-sso-microsoft-bg, #2f2f2f);
}
.uxpcore_loginform__sso-btn--facebook {
  background-color: var(--auth-sso-facebook-bg, #2474f2);
}
.uxpcore_loginform__sso-btn--keycloak {
  background-color: var(--auth-sso-keycloak-bg, #4d4d4d);
}
.uxpcore_loginform__sso-btn--custom {
  background-color: var(--auth-sso-custom-bg, #000000);
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 0.875rem;
  padding: 0.75rem;
}
.uxpcore_loginform__sso-btn-text {
  color: #ffffff;
  font-weight: var(--fontWeightMedium);
}

.uxpcore_auth__language-selector-trigger {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: transparent;
  color: inherit;
  font-size: 1.25rem;
  cursor: pointer;
  transition: background-color 0.2s ease;
}
.uxpcore_auth__language-selector-trigger:hover {
  background-color: rgba(0, 0, 0, 0.1);
}

.uxpcore_auth__language-selector-input.uxpcore_select__dropdown {
  background: var(--auth-dropdown-bg, #fff) !important;
}
.uxpcore_auth__language-selector-input.uxpcore_select__dropdown .uxpcore_input {
  background: var(--auth-input-bg, transparent) !important;
  border: 1px solid var(--auth-input-border, rgba(0, 0, 0, 0.1)) !important;
  border-radius: var(--auth-input-border-radius, 0.375rem) !important;
  color: var(--auth-input-text, inherit) !important;
}
.uxpcore_auth__language-selector-input .uxpcore_select__dropdown-list .uxpcore_select__option {
  background: transparent;
  color: var(--auth-dropdown-text, var(--primaryTextColor, #000)) !important;
  transition: background-color 0.15s ease;
}
.uxpcore_auth__language-selector-input .uxpcore_select__dropdown-list .uxpcore_select__option:hover, .uxpcore_auth__language-selector-input .uxpcore_select__dropdown-list .uxpcore_select__option--highlighted {
  background: var(--auth-dropdown-option-hover-bg, rgba(0, 0, 0, 0.05)) !important;
}
.uxpcore_auth__language-selector-input .uxpcore_select__dropdown-list .uxpcore_select__option--selected {
  background: var(--auth-dropdown-option-selected-bg, rgba(0, 123, 255, 0.1)) !important;
  color: var(--auth-dropdown-option-selected-text, var(--primaryColor, #007bff)) !important;
  font-weight: var(--fontWeightSemibold);
}

.uxpcore_alert-container {
  background-color: rgba(0, 0, 0, 0.4);
}

.uxpcore_alert {
  max-width: 800px;
  background-color: var(--auth-alert-bg, #fff);
  color: var(--auth-alert-text, #101828);
  border-color: var(--auth-alert-border, #E4E7EC);
}
.uxpcore_alert__header {
  border-bottom-color: var(--auth-alert-border, #E4E7EC);
}
.uxpcore_alert__title-text {
  color: var(--auth-alert-title-text, #101828);
}
.uxpcore_alert__icon {
  color: var(--auth-alert-icon-color, #667085);
}
.uxpcore_alert__body {
  color: var(--auth-alert-body-text, #475467);
}
.uxpcore_alert--success {
  background-color: var(--auth-alert-success-bg, #F6FEF9);
  border-color: var(--auth-alert-success-border, #6CE9A6);
}
.uxpcore_alert--success .uxpcore_alert__icon {
  color: var(--auth-alert-success-icon, #17B26A);
}
.uxpcore_alert--success .uxpcore_alert__title-text {
  color: var(--auth-alert-success-title, #054F31);
}
.uxpcore_alert--success .uxpcore_alert__body {
  color: var(--auth-alert-success-text, #027A48);
}
.uxpcore_alert--error {
  background-color: var(--auth-alert-error-bg, #FEF3F2);
  border-color: var(--auth-alert-error-border, #FDA29B);
}
.uxpcore_alert--error .uxpcore_alert__icon {
  color: var(--auth-alert-error-icon, #D92D20);
}
.uxpcore_alert--error .uxpcore_alert__title-text {
  color: var(--auth-alert-error-title, #7A271A);
}
.uxpcore_alert--error .uxpcore_alert__body {
  color: var(--auth-alert-error-text, #B42318);
}
.uxpcore_alert--warning {
  background-color: var(--auth-alert-warning-bg, #FFFAEB);
  border-color: var(--auth-alert-warning-border, #FEDF89);
}
.uxpcore_alert--warning .uxpcore_alert__icon {
  color: var(--auth-alert-warning-icon, #F79009);
}
.uxpcore_alert--warning .uxpcore_alert__title-text {
  color: var(--auth-alert-warning-title, #7A2E0E);
}
.uxpcore_alert--warning .uxpcore_alert__body {
  color: var(--auth-alert-warning-text, #DC6803);
}
.uxpcore_alert--info {
  background-color: var(--auth-alert-info-bg, #F5FAFF);
  border-color: var(--auth-alert-info-border, #B2DDFF);
}
.uxpcore_alert--info .uxpcore_alert__icon {
  color: var(--auth-alert-info-icon, #2E90FA);
}
.uxpcore_alert--info .uxpcore_alert__title-text {
  color: var(--auth-alert-info-title, #194185);
}
.uxpcore_alert--info .uxpcore_alert__body {
  color: var(--auth-alert-info-text, #0B4A6F);
}
.uxpcore_alert--form-alert .uxpcore_alert__body .instructions {
  color: var(--auth-alert-body-text, #475467);
}
.uxpcore_alert--form-alert .uxpcore_alert__body .uxpcore_input {
  background-color: var(--auth-input-bg, #FFFFFF) !important;
  border: 1px solid var(--auth-input-border, #D0D5DD) !important;
}
.uxpcore_alert--form-alert .uxpcore_alert__body .uxpcore_input .uxpcore_input__input {
  color: var(--auth-input-text, #101828) !important;
}
.uxpcore_alert--form-alert .uxpcore_alert__body .uxpcore_input::placeholder {
  color: var(--auth-input-placeholder, #667085);
}
.uxpcore_alert--form-alert .uxpcore_alert__body .uxpcore_input:hover:not(.uxpcore_input--disabled):not(.uxpcore_input--readonly) {
  background-color: var(--auth-input-bg, #FFFFFF) !important;
  border-color: var(--auth-input-border, #D0D5DD) !important;
}
.uxpcore_alert--form-alert .uxpcore_alert__body .uxpcore_input--focus:not(.uxpcore_input--invalid):not(.uxpcore_input--valid) {
  border-color: var(--auth-input-border-focus, #3A3EFD) !important;
  background-color: var(--auth-input-bg, #FFFFFF) !important;
}
.uxpcore_alert--form-alert .uxpcore_alert__body .uxpcore_input--has-content {
  background-color: var(--auth-input-bg, #FFFFFF) !important;
  border-color: var(--auth-input-border, #D0D5DD) !important;
}
.uxpcore_alert--form-alert .uxpcore_alert__body .uxpcore_input--disabled {
  background-color: var(--auth-input-bg-disabled, #F2F4F7) !important;
  border-color: var(--auth-input-border, #D0D5DD) !important;
}
.uxpcore_alert--form-alert .uxpcore_alert__body .uxpcore_input--disabled .uxpcore_input__input {
  color: var(--auth-input-text-disabled, #667085) !important;
}
.uxpcore_alert--form-alert .uxpcore_alert__body .uxpcore_label {
  color: var(--auth-label-text, #344054);
}
.uxpcore_alert--form-alert .uxpcore_alert__body .uxpcore_dynamicform__field-error {
  color: var(--auth-error-border, #D92D20) !important;
}
.uxpcore_alert--form-alert .uxpcore_alert__body .uxpcore_dynamicform__footer {
  border-top-color: var(--auth-alert-border, #E4E7EC);
}
.uxpcore_alert--form-alert .uxpcore_alert__body .uxpcore_dynamicform__footer .uxpcore_btn {
  background-color: var(--auth-button-bg, #181452);
  color: var(--auth-button-text, #FFFFFF);
  border-color: var(--auth-button-border, #181452);
}
.uxpcore_alert--form-alert .uxpcore_alert__body .uxpcore_dynamicform__footer .uxpcore_btn:hover:not(:disabled) {
  background-color: var(--auth-button-bg-hover, #2B3EEA);
  border-color: var(--auth-button-border-hover, #2B3EEA);
}
.uxpcore_alert--form-alert .uxpcore_alert__body .uxpcore_dynamicform__footer .uxpcore_btn--secondary {
  background-color: transparent;
  color: var(--auth-button-secondary-text, #344054);
  border-color: var(--auth-button-secondary-border, #D0D5DD);
}
.uxpcore_alert--form-alert .uxpcore_alert__body .uxpcore_dynamicform__footer .uxpcore_btn--secondary:hover:not(:disabled) {
  background-color: var(--auth-button-secondary-bg-hover, #F9FAFB);
}
.uxpcore_alert--form-alert .uxpcore_alert__body .uxpcore_formfeedback--error {
  color: var(--auth-error-text, #D92D20);
}
.uxpcore_alert--form-alert .uxpcore_alert__body .uxpcore_formfeedback--success {
  color: var(--auth-success-text, #17B26A);
}

.uxpcore_modal--auth .uxpcore_modal__panel {
  background: var(--auth-island-bg, transparent) !important;
  border-color: var(--auth-island-border-color) !important;
  border-radius: var(--auth-island-border-radius) !important;
  box-shadow: var(--auth-island-shadow) !important;
}
.uxpcore_modal--auth .uxpcore_modal__header {
  border-bottom: 1px solid var(--auth-island-border-color) !important;
}
.uxpcore_modal--auth .uxpcore_modal__title {
  color: var(--auth-island-text-color) !important;
}
.uxpcore_modal--auth .uxpcore_modal__body {
  padding: 0;
  margin: 0;
  height: 100%;
}

.modal-container.full-widget .modal-panel {
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  margin: auto;
  position: absolute;
  top: 0px;
  bottom: 0px;
  left: 0px;
  right: 0px;
  color: #424242;
  border-radius: 0;
}
.modal-container.full-widget .modal-panel .modal-header {
  border-bottom: 1px solid #e8e0fe;
  flex-direction: row-reverse;
}
.modal-container.full-widget .modal-panel .modal-header .modal-close .close-btn {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMC4zMjUiIGhlaWdodD0iMTAuMDYzIiB2aWV3Qm94PSIwIDAgMTAuMzI1IDEwLjA2MyI+PGRlZnM+PHN0eWxlPi5he29wYWNpdHk6MC4yNDt9PC9zdHlsZT48L2RlZnM+PHBhdGggY2xhc3M9ImEiIGQ9Ik01LjkzMSwxMi4wMzZsLS41MTIuNTEyYS41NTEuNTUxLDAsMCwxLS43ODEsMEwuMTU5LDguMDcxYS41NTEuNTUxLDAsMCwxLDAtLjc4MWw0LjQ4LTQuNDhhLjU1MS41NTEsMCwwLDEsLjc4MSwwbC41MTIuNTEyYS41NTQuNTU0LDAsMCwxLS4wMDkuNzlMMy4xNDUsNi43NTdIOS43NjhhLjU1Mi41NTIsMCwwLDEsLjU1My41NTN2LjczN2EuNTUyLjU1MiwwLDAsMS0uNTUzLjU1M0gzLjE0NWwyLjc3NywyLjY0NUEuNTUuNTUsMCwwLDEsNS45MzEsMTIuMDM2WiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMC4wMDQgLTIuNjQ3KSIvPjwvc3ZnPg==");
  background-size: 40%;
}
.modal-container.full-widget .modal-panel .modal-header .modal-title {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  text-transform: uppercase;
}
.modal-container.full-widget .modal-panel .modal-body {
  width: 100%;
  height: 100%;
  overflow: hidden;
  padding: 0;
  margin-bottom: 20px;
}
.modal-container.full-widget .modal-panel .modal-body .toolbar {
  width: 100%;
  height: 70px;
  padding: 20px;
  border-bottom: 1px solid #e8e0fe;
}
.modal-container.full-widget .modal-panel .modal-body .content {
  width: 100%;
  max-height: 100%;
  overflow: auto;
  padding: 20px 0;
}

.link-btn-widget-cont > .link {
  width: 100%;
  height: 100%;
  text-decoration: none;
}
.link-btn-widget-cont > .link .icon-container {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.link-btn-widget-cont > .link .icon-container img {
  width: 40%;
  height: 40%;
  object-fit: contain;
}
.link-btn-widget-cont > .link .icon-container .text {
  width: 90%;
  height: auto;
  text-align: center;
  padding: 10px;
  margin-top: 10px;
}

.uxp-buy-on-spaceworx-btn {
  width: auto;
  height: auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 60px;
  background-color: #f58220;
  text-decoration: none;
  cursor: pointer;
}
.uxp-buy-on-spaceworx-btn .icon-container {
  width: 35px;
  height: 35px;
}
.uxp-buy-on-spaceworx-btn .icon-container .icon {
  width: 100%;
  height: 100%;
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iMzguMDE3IiBoZWlnaHQ9IjM1LjA5OSIgdmlld0JveD0iMCAwIDM4LjAxNyAzNS4wOTkiPjxkZWZzPjxzdHlsZT4uYXtmaWxsOm5vbmU7fS5ie2NsaXAtcGF0aDp1cmwoI2EpO30uY3tmaWxsOnVybCgjYik7fS5ke2ZpbGw6dXJsKCNjKTt9PC9zdHlsZT48Y2xpcFBhdGggaWQ9ImEiPjxyZWN0IGNsYXNzPSJhIiB3aWR0aD0iMzguMDE3IiBoZWlnaHQ9IjM1LjA5OSIvPjwvY2xpcFBhdGg+PGxpbmVhckdyYWRpZW50IGlkPSJiIiB5MT0iMC41IiB4Mj0iMSIgeTI9IjAuNSIgZ3JhZGllbnRVbml0cz0ib2JqZWN0Qm91bmRpbmdCb3giPjxzdG9wIG9mZnNldD0iMCIgc3RvcC1jb2xvcj0iIzI5YWJlMiIvPjxzdG9wIG9mZnNldD0iMC4zODkiIHN0b3AtY29sb3I9IiMyYWJjYmIiLz48c3RvcCBvZmZzZXQ9IjEiIHN0b3AtY29sb3I9IiMyY2RiNzciLz48L2xpbmVhckdyYWRpZW50PjxsaW5lYXJHcmFkaWVudCBpZD0iYyIgeDE9IjAiIHkxPSIwLjUiIHgyPSIxIiB5Mj0iMC41IiB4bGluazpocmVmPSIjYiIvPjwvZGVmcz48ZyBjbGFzcz0iYiI+PGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMCAwLjAwMSkiPjxwYXRoIGNsYXNzPSJjIiBkPSJNMjcuMjksMzEuNThsLjcyLS41OGExNC4zMTMsMTQuMzEzLDAsMCwwLDUuNDgtMTMuMDdoMEExMi42MSwxMi42MSwwLDAsMCwyNy40Nyw4LjlsLTIuOS0xLjc2YTEyLjcxNSwxMi43MTUsMCwwLDAtNi4yNS0xLjgyLDEyLjE2OCwxMi4xNjgsMCwwLDAtMS43MS4wOGMtNC4yNy41OC01LjcsMy4yMS01LjU0LDUuMjIuMjMsMi43NiwyLjI0LDMuODUsNi42OSw0Ljg0LDUuNDUsMS4yLDguMzQsMy4yNCw4LjcsNy41Ny4zNyw0LjU1LTIuODgsOC45Ny0xMC4yNyw5Ljk4YTE2LjY0MiwxNi42NDIsMCwwLDEtOC4xNC0uNzlsLS4wMy0uMDQsMi44NiwxLjQzQTE1LjUwNywxNS41MDcsMCwwLDAsMjcuMjksMzEuNThaIi8+PHBhdGggY2xhc3M9ImQiIGQ9Ik02LjMzLDMuNTJsLS43Mi41OEExNC4zMTMsMTQuMzEzLDAsMCwwLC4xMywxNy4xN2gwQTEyLjYxLDEyLjYxLDAsMCwwLDYuMTUsMjYuMmwyLjksMS43NmExMi43MTUsMTIuNzE1LDAsMCwwLDYuMjUsMS44MiwxMi4xNjgsMTIuMTY4LDAsMCwwLDEuNzEtLjA4YzQuMjctLjU4LDUuNy0zLjIxLDUuNTQtNS4yMi0uMjMtMi43Ni0yLjI0LTMuODUtNi42OS00Ljg0LTUuNDUtMS4yLTguMzQtMy4yNC04LjctNy41N0M2Ljc5LDcuNTIsMTAuMDQsMy4xLDE3LjQzLDIuMDlhMTYuNjQyLDE2LjY0MiwwLDAsMSw4LjE0Ljc5bC4wMy4wNEwyMi43NCwxLjQ5QTE1LjQ5MSwxNS40OTEsMCwwLDAsNi4zMywzLjUyWiIvPjwvZz48L2c+PC9zdmc+");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 65%;
  filter: brightness(0) invert(1);
}
.uxp-buy-on-spaceworx-btn .text {
  color: white;
  padding: 0 15px 0 0;
}
.uxp-buy-on-spaceworx-btn:hover, .uxp-buy-on-spaceworx-btn.active, .uxp-buy-on-spaceworx-btn:focus, .uxp-buy-on-spaceworx-btn:visited {
  text-decoration: none;
}
.uxp-buy-on-spaceworx-btn:hover {
  box-shadow: 0 0 8px 4px rgba(0, 0, 0, 0.12);
}

.uxp-spaceworx-description-tag {
  width: 100%;
  height: auto;
  padding: 10px;
  font-size: 11px;
  font-style: italic;
}

.modal-container.uxp-buy-on-spaceworx-redirect-modal .modal-backdrop {
  background-color: rgba(0, 0, 0, 0.6);
}
.modal-container.uxp-buy-on-spaceworx-redirect-modal .modal-panel .modal-header {
  display: none;
}
.modal-container.uxp-buy-on-spaceworx-redirect-modal .modal-panel .modal-body {
  width: 100%;
  height: 100%;
  margin: 0;
}
.modal-container.uxp-buy-on-spaceworx-redirect-modal .modal-panel .modal-body .content {
  width: 400px;
  height: auto;
  position: relative;
}
.modal-container.uxp-buy-on-spaceworx-redirect-modal .modal-panel .modal-body .content .msg {
  width: 100%;
  height: auto;
  padding: 30px 0;
  text-align: center;
  font-size: 14px;
  font-weight: var(--fontWeightSemibold);
}
.modal-container.uxp-buy-on-spaceworx-redirect-modal .modal-panel .modal-body .content .msg .disclaimer {
  font-size: 11px;
  padding: 15px 0;
}
.modal-container.uxp-buy-on-spaceworx-redirect-modal .modal-panel .modal-body .content .actions {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.modal-container.uxp-buy-on-spaceworx-redirect-modal .modal-panel .modal-body .content .actions .uxp-button {
  margin: 0;
}
.modal-container.uxp-buy-on-spaceworx-redirect-modal .modal-panel .modal-body .content .actions .uxp-button.continue-btn {
  color: white;
}

/*# sourceMappingURL=uxp_dashboard.css.map */