.pui-input input {
  border: 1px solid var(--outline) !important;
}
.pui-tabs-container {
  overflow-x: visible;
  min-width: 100%;
}
.pui-tabs-container header.pui-tabs-menu {
  justify-content: space-between;
  min-height: 54px;
  background: var(--surface);
  padding: 0.29rem 0.3rem 0.2rem 0.3rem;
  border-radius: 0;
  gap: 0.5rem;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(80px, 1fr));
}
.pui-tabs-container header.pui-tabs-menu .tab {
  flex-grow: 1;
  background: transparent;
  padding: 0.6rem 1.2rem;
  font-size: 0.9rem;
  opacity: 0.6;
  cursor: pointer;
  text-transform: capitalize;
  font-weight: 600;
  border-radius: 12px;
  transition: background-color 0.3s ease, opacity 0.3s ease, color 0.3s ease;
  display: flex;
  place-content: center;
  max-height: 45px;
  color: var(--text-color);
  align-items: center;
  background-color: var(--surface);
}
.pui-tabs-container header.pui-tabs-menu .tab.is-disabled {
  cursor: not-allowed;
  opacity: 0.4;
}
.pui-tabs-container header.pui-tabs-menu .tab.active {
  opacity: 1;
  font-weight: 600;
  color: var(--text-color);
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}
.pui-tabs-container header.pui-tabs-menu .tab:not(.active):hover {
  background-color: var(--primary-container);
  opacity: 0.8;
  color: var(--on-primary);
}
.pui-tabs-container section.tab-content.panes {
  padding: 1rem;
  background: var(--background);
  border-radius: 12px;
  margin-top: 0.5rem;
  max-width: 100%;
}
:root {
  --primary: #1f3747;
  --primary-0: #213a4a;
  --primary-10: #3c637e;
  --primary-20: #040b19;
  --primary-30: #314a5a;
  --primary-40: #1f3747;
  --primary-50: #729bb8;
  --primary-60: #8ab4d1;
  --primary-70: #a3c5de;
  --primary-80: #b6d2e6;
  --primary-90: #c7ddec;
  --primary-95: #d7e5ef;
  --primary-98: #e7ebef;
  --primary-100: #eef0f1;
  --secondary: #728693;
  --secondary-0: #000810;
  --secondary-10: #000f1e;
  --secondary-20: #00142c;
  --secondary-30: #021831;
  --secondary-40: #01224a;
  --secondary-50: #031f43;
  --secondary-60: #021b3e;
  --secondary-70: #061c41;
  --secondary-80: #041936;
  --secondary-90: #0c1d2d;
  --secondary-95: #582914;
  --secondary-98: #d2761a;
  --secondary-100: #ffffff;
  --tertiary: #bbced7;
  --tertiary-0: #000000;
  --tertiary-10: #00080d;
  --tertiary-20: #001119;
  --tertiary-30: #001926;
  --tertiary-40: #00324b;
  --tertiary-50: #00547e;
  --tertiary-60: #006496;
  --tertiary-70: #008bd3;
  --tertiary-80: #00a1f0;
  --tertiary-90: #00b4ff;
  --tertiary-95: #00c7ff;
  --tertiary-98: #00ddff;
  --tertiary-100: #ffffff;
  --error: #cc0000;
  --error-0: #000000;
  --error-10: #110000;
  --error-20: #220000;
  --error-30: #330000;
  --error-40: #660000;
  --error-50: #aa0000;
  --error-60: #cc0000;
  --error-70: #ff0000;
  --error-80: #ff0000;
  --error-90: #ff0000;
  --error-95: #ff0000;
  --error-98: #ff0000;
  --error-100: #ffffff;
  --success: #007e33;
  --success-0: #000000;
  --success-10: #000b04;
  --success-20: #001509;
  --success-30: #00200d;
  --success-40: #003f1a;
  --success-50: #006a2a;
  --success-60: #007e34;
  --success-70: #00b248;
  --success-80: #00ca52;
  --success-90: #00e45b;
  --success-95: #00fc67;
  --success-98: #00ff71;
  --success-100: #ffffff;
  --info: #0099cc;
  --info-0: #000000;
  --info-10: #000d11;
  --info-20: #001a22;
  --info-30: #002633;
  --info-40: #004d66;
  --info-50: #0080aa;
  --info-60: #009acc;
  --info-70: #00d6ff;
  --info-80: #00f5ff;
  --info-90: #00ffff;
  --info-95: #00ffff;
  --info-98: #00ffff;
  --info-100: #ffffff;
  --warning: #ff8800;
  --warning-0: #000000;
  --warning-10: #150b00;
  --warning-20: #2b1700;
  --warning-30: #402200;
  --warning-40: #804400;
  --warning-50: #d47200;
  --warning-60: #ff8800;
  --warning-70: #ffbe00;
  --warning-80: #ffda00;
  --warning-90: #fff500;
  --warning-95: #ffff00;
  --warning-98: #ffff00;
  --warning-100: #ffffff;
}

/* Gilroy Regular */
@font-face {
  font-family: "Gilroy";
  src: url("/assets/fonts/gilroy/Gilroy-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
}
/* Gilroy Semi Bold */
@font-face {
  font-family: "Gilroy";
  src: url("/assets/fonts/gilroy/Gilroy-SemiBold.ttf") format("truetype");
  font-weight: 600;
  font-style: normal;
}
/* Gilroy Bold */
@font-face {
  font-family: "Gilroy";
  src: url("/assets/fonts/gilroy/Gilroy-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
}
/* Gilroy Bold */
@font-face {
  font-family: "Gilroy";
  src: url("/assets/fonts/gilroy/Gilroy-ExtraBold.ttf") format("truetype");
  font-weight: 800;
  font-style: normal;
}
:root {
  --font-family: "Gilroy", ui-sans-serif, system-ui, -apple-system,
  	BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial,
  	"Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji",
  	"Segoe UI Symbol", "Noto Color Emoji";
  --secondary-font-family: "Roboto", sans-serif;
  --title-font: "Gilroy", sans-serif;
  --brand-font: "Gilroy", sans-serif;
  --border-primary: 10px;
  --border-secondary: 8px;
  --border-tertiary: 5px;
  --border-radius-base: 1rem;
  /* neutral */
  --neutral-4: #0f0d13;
  --neutral-6: #141218;
  --neutral-10: #1c1b1f;
  --neutral-12: #2b2930;
  --neutral-17: #2b2930;
  --neutral-20: #1c1b1f;
  --neutral-22: #36343b;
  --neutral-24: #3b383e;
  --neutral-25: #393c3a;
  --neutral-30: #444846;
  --neutral-35: #505351;
  --neutral-40: #5c5f5d;
  --neutral-50: #747875;
  --neutral-60: #8e918f;
  --neutral-70: #a9aca9;
  --neutral-80: #c4c7c4;
  --neutral-87: #ded8e1;
  --neutral-90: #e1e3e0;
  --neutral-94: #f3edf7;
  --neutral-92: #ece6f0;
  --neutral-94: #f3edf7;
  --neutral-95: #eff1ee;
  --neutral-96: #f7f2fa;
  --neutral-98: #fef7ff;
  --neutral-99: #fbfdfa;
  --neutral-100: #ffffff;
  /* --neutral-variant */
  --neutral-variant: #000000;
  --neutral-variant-10: #141d1a;
  --neutral-variant-20: #29322f;
  --neutral-variant-25: #343d3a;
  --neutral-variant-30: #3f4945;
  --neutral-variant-35: #4b5550;
  --neutral-variant-40: #57605c;
  --neutral-variant-50: #6f7975;
  --neutral-variant-60: #89938e;
  --neutral-variant-70: #a3ada8;
  --neutral-variant-80: #bfc9c3;
  --neutral-variant-90: #dbe5df;
  --neutral-variant-95: #e9f3ed;
  --neutral-variant-98: #f2fcf6;
  --neutral-variant-99: #f5fff9;
  --neutral-variant-100: #ffffff;
  --primary: #1f3747;
  --on-primary: #ffffff;
  --primary-container: #bbced7;
  --on-primary-container: #1f3747;
  --secondary: #728693;
  --on-secondary: #ffffff;
  --secondary-container: #d8e2e2;
  --on-secondary-container: #1f3747;
  --tab-header: va(--neutral-90);
  --tertiary: #bbced7;
  --on-tertiary: #1f3747;
  --tertiary-container: #60a5ff;
  --on-tertiary-container: #000a47;
  --background: #f0f4f5;
  --on-background: #1f3747;
  --surface: #ffffff;
  --on-surface: #1f3747;
  --surface-variant: #E9EDF1;
  --outline: #b7b7c578;
  --outline-variant: #c1c7cf;
  --outline-variant: #bcc7c8;
  --error: #f44336;
  --on-error: #ffffff;
  --error-container: #ffdad6;
  --on-error-container: #400002;
  --success: #008e3c;
  --on-success: #ffffff;
  --success-container: #58c68c;
  --on-success-container: #002204;
  --warning: #ba5000;
  --on-warning: #ffffff;
  --warning-container: #f3a757;
  --on-warning-container: #422400;
  --info: #005fa4;
  --on-info: #ffffff;
  --info-container: #3ca3ff;
  --on-info-container: #002025;
  --primary-shadow: 0px 2px 8px #58585833;
  --secondary-shadow: -5px 12px 2px 3px #58585833;
  --modal-background-color: rgba(0, 0, 0, 0.5);
  --neutral: #f5f7f7;
  --on-neutral: #1f3747;
}
@media (prefers-color-scheme: light) {
  :root {
    --primary: #1f3747;
    --on-primary: #ffffff;
    --primary-container: #bbced7;
    --on-primary-container: #1f3747;
    --secondary: #728693;
    --on-secondary: #ffffff;
    --secondary-container: #d8e2e2;
    --on-secondary-container: #1f3747;
    --tab-header: va(--neutral-90);
    --tertiary: #bbced7;
    --on-tertiary: #1f3747;
    --tertiary-container: #60a5ff;
    --on-tertiary-container: #000a47;
    --background: #f0f4f5;
    --on-background: #1f3747;
    --surface: #ffffff;
    --on-surface: #1f3747;
    --surface-variant: #E9EDF1;
    --outline: #b7b7c578;
    --outline-variant: #c1c7cf;
    --outline-variant: #bcc7c8;
    --error: #f44336;
    --on-error: #ffffff;
    --error-container: #ffdad6;
    --on-error-container: #400002;
    --success: #008e3c;
    --on-success: #ffffff;
    --success-container: #58c68c;
    --on-success-container: #002204;
    --warning: #ba5000;
    --on-warning: #ffffff;
    --warning-container: #f3a757;
    --on-warning-container: #422400;
    --info: #005fa4;
    --on-info: #ffffff;
    --info-container: #3ca3ff;
    --on-info-container: #002025;
    --primary-shadow: 0px 2px 8px #58585833;
    --secondary-shadow: -5px 12px 2px 3px #58585833;
    --modal-background-color: rgba(0, 0, 0, 0.5);
    --neutral: #f5f7f7;
    --on-neutral: #1f3747;
  }
}

html[data-beyond-mode=light] {
  --primary: #1f3747;
  --on-primary: #ffffff;
  --primary-container: #bbced7;
  --on-primary-container: #1f3747;
  --secondary: #728693;
  --on-secondary: #ffffff;
  --secondary-container: #d8e2e2;
  --on-secondary-container: #1f3747;
  --tab-header: va(--neutral-90);
  --tertiary: #bbced7;
  --on-tertiary: #1f3747;
  --tertiary-container: #60a5ff;
  --on-tertiary-container: #000a47;
  --background: #f0f4f5;
  --on-background: #1f3747;
  --surface: #ffffff;
  --on-surface: #1f3747;
  --surface-variant: #E9EDF1;
  --outline: #b7b7c578;
  --outline-variant: #c1c7cf;
  --outline-variant: #bcc7c8;
  --error: #f44336;
  --on-error: #ffffff;
  --error-container: #ffdad6;
  --on-error-container: #400002;
  --success: #008e3c;
  --on-success: #ffffff;
  --success-container: #58c68c;
  --on-success-container: #002204;
  --warning: #ba5000;
  --on-warning: #ffffff;
  --warning-container: #f3a757;
  --on-warning-container: #422400;
  --info: #005fa4;
  --on-info: #ffffff;
  --info-container: #3ca3ff;
  --on-info-container: #002025;
  --primary-shadow: 0px 2px 8px #58585833;
  --secondary-shadow: -5px 12px 2px 3px #58585833;
  --modal-background-color: rgba(0, 0, 0, 0.5);
  --neutral: #f5f7f7;
  --on-neutral: #1f3747;
}

html[data-beyond-mode=dark] {
  --text-color: #fff;
  --primary: #1f3747;
  --on-primary: #ffffff;
  --primary-container: #bbced7;
  --on-primary-container: #1f3747;
  --secondary: #728693;
  --on-secondary: #ffffff;
  --secondary-container: #d8e2e2;
  --on-secondary-container: #1f3747;
  --tab-header: var(--background);
  --tertiary: #bbced7;
  --on-tertiary: #1f3747;
  --tertiary-container: #60a5ff;
  --on-tertiary-container: #000a47;
  --surface: #1c1f21;
  --surface-dim: var(--neutral-6);
  --surface-bright: var(--neutral-25);
  --surface-container-lowest: var(--neutral-4);
  --surface-container-low: var(--neutral-10);
  --surface-container: var(--neutral-12);
  --surface-container-high: var(--neutral-20);
  --surface-container-highest: var(--neutral-22);
  --surface-variant: #1d272e;
  --on-surface: var(--neutral-90);
  --on-surface-variant: var(--neutral-variant-80);
  --inverse-surface: var(--neutral-90);
  --inverse-on-surface: var(--neutral-20);
  --background: var(--neutral-6);
  --on-background: var(--neutral-90);
  --error: var(--error-80);
  --error-container: var(--error-30);
  --on-error: var(--error-20);
  --on-error-container: var(--error-90);
  --outline: var(--neutral-variant-60);
  --outline-variant: var(--neutral-variant-30);
  --shadow: var(--neutral-0);
  --box-shadow-pui: 0px 3px 8px var(--shadow);
  --surface-tint-color: var(--md.sys.color.primary);
  --scrim: var(--neutral-0);
  --box-shadow: 0px 3px 8px #00000066;
  --on-info: #fff;
  --info: hsla(211, 88%, 53%, 1);
  --success: #007e33;
  --on-success: #fff;
  --primary-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1),
  	0 2px 4px -1px rgba(0, 0, 0, 0.06);
  --secondary-shadow: -5px 12px 2px 3px #58585833;
  --modal-background-color: rgba(0, 0, 0, 0.5);
}
/* Gilroy Regular */
@font-face {
  font-family: "Gilroy";
  src: url("/assets/fonts/gilroy/Gilroy-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
}
/* Gilroy Semi Bold */
@font-face {
  font-family: "Gilroy";
  src: url("/assets/fonts/gilroy/Gilroy-SemiBold.ttf") format("truetype");
  font-weight: 600;
  font-style: normal;
}
/* Gilroy Bold */
@font-face {
  font-family: "Gilroy";
  src: url("/assets/fonts/gilroy/Gilroy-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
}
/* Gilroy Bold */
@font-face {
  font-family: "Gilroy";
  src: url("/assets/fonts/gilroy/Gilroy-ExtraBold.ttf") format("truetype");
  font-weight: 800;
  font-style: normal;
}
:root {
  --primary: #1f3747;
  --primary-0: #213a4a;
  --primary-10: #3c637e;
  --primary-20: #040b19;
  --primary-30: #314a5a;
  --primary-40: #1f3747;
  --primary-50: #729bb8;
  --primary-60: #8ab4d1;
  --primary-70: #a3c5de;
  --primary-80: #b6d2e6;
  --primary-90: #c7ddec;
  --primary-95: #d7e5ef;
  --primary-98: #e7ebef;
  --primary-100: #eef0f1;
  --secondary: #728693;
  --secondary-0: #000810;
  --secondary-10: #000f1e;
  --secondary-20: #00142c;
  --secondary-30: #021831;
  --secondary-40: #01224a;
  --secondary-50: #031f43;
  --secondary-60: #021b3e;
  --secondary-70: #061c41;
  --secondary-80: #041936;
  --secondary-90: #0c1d2d;
  --secondary-95: #582914;
  --secondary-98: #d2761a;
  --secondary-100: #ffffff;
  --tertiary: #bbced7;
  --tertiary-0: #000000;
  --tertiary-10: #00080d;
  --tertiary-20: #001119;
  --tertiary-30: #001926;
  --tertiary-40: #00324b;
  --tertiary-50: #00547e;
  --tertiary-60: #006496;
  --tertiary-70: #008bd3;
  --tertiary-80: #00a1f0;
  --tertiary-90: #00b4ff;
  --tertiary-95: #00c7ff;
  --tertiary-98: #00ddff;
  --tertiary-100: #ffffff;
  --error: #cc0000;
  --error-0: #000000;
  --error-10: #110000;
  --error-20: #220000;
  --error-30: #330000;
  --error-40: #660000;
  --error-50: #aa0000;
  --error-60: #cc0000;
  --error-70: #ff0000;
  --error-80: #ff0000;
  --error-90: #ff0000;
  --error-95: #ff0000;
  --error-98: #ff0000;
  --error-100: #ffffff;
  --success: #007e33;
  --success-0: #000000;
  --success-10: #000b04;
  --success-20: #001509;
  --success-30: #00200d;
  --success-40: #003f1a;
  --success-50: #006a2a;
  --success-60: #007e34;
  --success-70: #00b248;
  --success-80: #00ca52;
  --success-90: #00e45b;
  --success-95: #00fc67;
  --success-98: #00ff71;
  --success-100: #ffffff;
  --info: #0099cc;
  --info-0: #000000;
  --info-10: #000d11;
  --info-20: #001a22;
  --info-30: #002633;
  --info-40: #004d66;
  --info-50: #0080aa;
  --info-60: #009acc;
  --info-70: #00d6ff;
  --info-80: #00f5ff;
  --info-90: #00ffff;
  --info-95: #00ffff;
  --info-98: #00ffff;
  --info-100: #ffffff;
  --warning: #ff8800;
  --warning-0: #000000;
  --warning-10: #150b00;
  --warning-20: #2b1700;
  --warning-30: #402200;
  --warning-40: #804400;
  --warning-50: #d47200;
  --warning-60: #ff8800;
  --warning-70: #ffbe00;
  --warning-80: #ffda00;
  --warning-90: #fff500;
  --warning-95: #ffff00;
  --warning-98: #ffff00;
  --warning-100: #ffffff;
}
@import url("https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,300;0,400;0,500;0,600;0,800;1,100;1,300;1,600;1,700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Merriweather&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@500&display=swap");
:root {
  --gray-base: #000000;
  --gray-darker: #333333;
  --gray-dark: #4e5256;
  --gray: #82837f;
  --gray-variant: #979797;
  --gray-light: #d8d8d8;
  --gray-lighter: #f9f9f9;
  --background: var(--gray-lighter);
  --text-color: var(--gray-darker);
  --element-bg: #fff;
  --border: #dddddd;
  --border-variant: #e1e5ef;
  --text: #fff;
  --success: #22bb33;
  --warning: #f7c700;
  --error: #f04141;
  --info: hsla(211, 88%, 53%, 1);
  --chat-online: #43fc22;
  --preload-bg: var(--secondary);
  --main-color: hsla(211, 88%, 53%, 1);
  --text-grey: #707070;
  --text-gray-light: #757575;
  --border-secondary: 8px;
  --body-bg: #f5f8ff;
  --box-bg: #fff;
  --input-bg: #f5f8ff;
  --txt-color: #2f2d2f;
  --txt-second-color: #ccc;
  --border-color: #e1e1e1;
  --primary-box-shadow: 0px 19px 40px 0px hsla(0, 0%, 0%, 10%);
}
html,
body {
  min-height: 100%;
  overflow-x: hidden;
  padding: 0;
  height: 100%;
  margin: 0;
  font-size: 1rem;
  color: var(--text-color);
  font-family: var(--font-family);
}

html {
  background: var(--background);
}