@import url("https://fonts.googleapis.com/css2?family=Manrope:wght@200..800&display=swap");
/* 1. Use a more-intuitive box-sizing model */
*, *::before, *::after {
  box-sizing: border-box;
}

/* 2. Remove default margin */
*:not(dialog) {
  margin: 0;
}

/* 3. Enable keyword animations */
@media (prefers-reduced-motion: no-preference) {
  html {
    interpolate-size: allow-keywords;
  }
}
body {
  /* 4. Add accessible line-height */
  line-height: 1.5;
  /* 5. Improve text rendering */
  -webkit-font-smoothing: antialiased;
}

/* 6. Improve media defaults */
img, picture, video, canvas, svg {
  display: block;
  max-width: 100%;
}

/* 7. Inherit fonts for form controls */
input, button, textarea, select {
  font: inherit;
}

/* 8. Avoid text overflows */
p, h1, h2, h3, h4, h5, h6 {
  margin-bottom: 0;
  overflow-wrap: break-word;
}

/* 9. Improve line wrapping */
p {
  text-wrap: pretty;
}

h1, h2, h3, h4, h5, h6 {
  text-wrap: balance;
}

/*
  10. Create a root stacking context
*/
#root, #__next {
  isolation: isolate;
}

:root {
  --app-padding: 0.8rem;
  --focus-ring-color: color(primary, 0.5);
  --focus-ring-width: 3px;
  --page-title-height: 4rem;
  --page-footer-height: calc(5rem + var(--app-padding));
  --input-height: 4.5rem;
  --input-height-lg: 5.5rem;
  --select-height: 4.5rem;
  --select-height-lg: 5.5rem;
  --max-inputs-width: 500px;
  --layout-sidebar-width: 28rem;
  --scrollbar-size: 6px;
  --scrollbar-track: transparent;
  --scrollbar-radius: 10px;
  --scrollbar-thumb: color(primary, .25);
  --scrollbar-thumb-hover: color(primary, .45);
  --toolbar-items-height: 4rem;
  --color-primary: #FFC522;
  --color-primary-accent-light: #FFFBEE;
  --color-secondary: #1D398D;
  --color-secondary-accent: #1245E0;
  --color-accent: #009DDC;
  --color-accent-dark: #5A70B4;
  --color-accent-light: #C7DFFD;
  --color-neutral-base: #F7F9FC;
  --color-neutral-base-dark: #E5EDF7;
  --color-bg-light: #F6FAFF;
  --color-bg-light-hover: #F4F9FF;
  --color-bg-light-2: #F2F5FA;
  --color-bg-light-2-hover: #F4F9FF;
  --color-bg-light-3: #F4F9FF;
  --color-bg-light-3-hover: #e8edf2;
  --color-bg-accent-light: #F4F9FF;
  --color-bg-disabled: #E5EDF7;
  --color-white: #ffffff;
  --color-black: #000000;
  --color-text-heading: #1E1E1E;
  --color-text-main: #1E1E1E;
  --color-text-secondary: #0A2F9F;
  --color-text-accent: #4A82FF;
  --color-text-accent-dark: #5A70B4;
  --color-text-muted: #6b7280;
  --color-text-disabled: #9ca3af;
  --color-text-placeholder: #939EB1;
  --color-success: #16A34A;
  --color-warning: #FFD400;
  --color-info: #38BDF8;
  --color-danger: #d95340;
  --color-error: #DC2626;
  --color-upload: #BA027A;
  --color-file-edit: #008C77;
  --color-badge-success: #16A34A;
  --color-badge-success-light: #D1E7DD;
  --color-badge-warning: #FFD400;
  --color-badge-warning-light: #FFF4D9;
  --color-badge-warning-text: #856404;
  --color-badge-info: #38BDF8;
  --color-badge-info-light: #D9EDF7;
  --color-badge-danger: #d95340;
  --color-badge-danger-light: #F8D7DA;
  --color-border-light: #F0F2F4;
  --color-border-light-2: #E5EDF7;
  --color-border-dark: #D4E1F0;
  --color-border-darker: #acc0d8;
  --color-border-accent-light: #F4F9FF;
  --color-border-accent: #E5E9F6;
  --color-input-bg: #ffffff;
  --color-input-bg-disabled: #F2F5FA;
  --color-input-bg-disabled-dark: #C7D8ED;
  --color-input-placeholder: #9ca3af;
  --color-input-disabled: #C1CCEC;
  --color-input-icon-color: #8F98B5;
  --color-rgb-primary: 255 197 34;
  --color-rgb-primary-accent-light: 255 251 238;
  --color-rgb-secondary: 29 57 141;
  --color-rgb-secondary-accent: 18 69 224;
  --color-rgb-accent: 0 157 220;
  --color-rgb-accent-dark: 90 112 180;
  --color-rgb-accent-light: 199 223 253;
  --color-rgb-neutral-base: 247 249 252;
  --color-rgb-neutral-base-dark: 229 237 247;
  --color-rgb-bg-light: 246 250 255;
  --color-rgb-bg-light-hover: 218 219 225;
  --color-rgb-bg-light-2: 242 245 250;
  --color-rgb-bg-light-2-hover: 244 249 255;
  --color-rgb-bg-light-3: 244 249 255;
  --color-rgb-bg-light-3-hover: 244 249 255;
  --color-rgb-bg-accent-light: 244 249 255;
  --color-rgb-bg-disabled: 229 237 247;
  --color-rgb-white: 255 255 255;
  --color-rgb-black: 0 0 0;
  --color-rgb-text-heading: 30 30 30;
  --color-rgb-text-main: 30 30 30;
  --color-rgb-text-secondary: 10 47 159;
  --color-rgb-text-accent: 74 130 255;
  --color-rgb-text-accent-dark: 90 112 180;
  --color-rgb-text-muted: 107 114 128;
  --color-rgb-text-disabled: 156 163 175;
  --color-rgb-text-placeholder: 147 158 177;
  --color-rgb-success: 22 163 74;
  --color-rgb-warning: 255 212 0;
  --color-rgb-info: 56 189 248;
  --color-rgb-danger: 217 83 64;
  --color-rgb-error: 220 38 38;
  --color-rgb-upload: 186 2 122;
  --color-rgb-file-edit: 0 140 119;
  --color-rgb-badge-success: 22 163 74;
  --color-rgb-badge-success-light: 209 231 221;
  --color-rgb-badge-warning: 255 212 0;
  --color-rgb-badge-warning-light: 255 244 217;
  --color-rgb-badge-warning-text: 133 100 4;
  --color-rgb-badge-info: 56 189 248;
  --color-rgb-badge-info-light: 217 237 247;
  --color-rgb-badge-danger: 217 83 64;
  --color-rgb-badge-danger-light: 248 215 218;
  --color-rgb-border-light: 240 242 244;
  --color-rgb-border-light-2: 229 237 247;
  --color-rgb-border-dark: 212 225 240;
  --color-rgb-border-darker: 172 192 224;
  --color-rgb-border-accent-light: 244 249 255;
  --color-rgb-border-accent: 229 233 246;
  --color-rgb-input-bg: 255 255 255;
  --color-rgb-input-bg-disabled: 242 245 250;
  --color-rgb-input-bg-disabled-dark: 199 216 237;
  --color-rgb-input-placeholder: 156 163 175;
  --color-rgb-input-disabled: 193 204 236;
  --color-rgb-input-icon-color: 143 152 181;
  --layout-sidebar-width: 30rem;
  --layout-sidebar-collapsed: 4.5rem;
  --layout-app-header-height: 6.2rem;
  --layout-header-height: 4rem;
  --layout-boxed-width: 95rem;
  --space-0: 0;
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 2.5rem;
  --space-8: 3rem;
  --space-9: 3.5rem;
  --space-10: 4rem;
  --space-11: 4.5rem;
  --space-12: 5rem;
  --space-13: 7.5rem;
  --radius-none: 0;
  --radius-xs: 0.25rem;
  --radius-sm: 0.375rem;
  --radius-md: 0.625rem;
  --radius-lg: 0.875rem;
  --radius-xl: 1.125rem;
  --radius-2xl: 1.5rem;
  --radius-full: 9999px;
  --shadow-none: none;
  --shadow-sm: 0 1px 2px rgba(13, 9, 104, 0.04);
  --shadow-md: 0 2px 8px rgba(13, 9, 104, 0.06);
  --shadow-md-hover: 0 2px 8px rgba(13, 9, 104, 0.12);
  --shadow-lg: 0 12px 24px rgba(13, 9, 104, 0.12);
  --shadow-lg-hover: 0 12px 24px rgba(13, 9, 104, 0.18);
  --shadow-xl: 0 14px 36px rgba(13, 9, 104, 0.12);
  --shadow-xl-hover: 0 14px 36px rgba(13, 9, 104, 0.18);
  --shadow-2xl: 0 48px 54px rgba(13, 9, 104, 0.24);
  --shadow-inner: inset 0 2px 4px 0 rgba(13, 9, 104, 0.08);
  --shadow-outline: 0 0 0 3px rgba(13, 9, 104, 0.12);
  --shadow-focus: 0 0 0 3px rgba(13, 9, 104, 0.12);
  --shadow-focus-accent: 0 0 0 3px rgba(74, 130, 255, 0.25);
  --shadow-focus-inset: inset 0 0 0 2px rgba(13, 9, 104, 0.12);
  --shadow-badge: 0 0 0 2px rgba(13, 9, 104, 0.12);
  --motion-duration-instant: 80ms;
  --motion-duration-fast: 350ms;
  --motion-duration-normal: 500ms;
  --motion-duration-slow: 750ms;
  --motion-ease-linear: linear;
  --motion-ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --motion-ease-enter: cubic-bezier(0, 0, 0.2, 1);
  --motion-ease-exit: cubic-bezier(0.4, 0, 1, 1);
  --font-base: Manrope, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  --font-numbers: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  --font-size-xs: 1.1rem;
  --font-size-sm: 1.2rem;
  --font-size-md: 1.3rem;
  --font-size-base: 1.4rem;
  --font-size-lg: 1.6rem;
  --font-size-xl: 1.8rem;
  --font-size-2xl: 2.4rem;
  --font-size-3xl: 3rem;
  --font-size-page-title: clamp(1.8rem, 1.4rem + 1.5vw, 2.4rem);
  --letter-spacing-tighter: -0.05rem;
  --letter-spacing-tight: -0.025rem;
  --letter-spacing-normal: 0;
  --letter-spacing-wide: 0.025rem;
  --letter-spacing-wider: 0.05rem;
  --letter-spacing-widest: 0.1rem;
  --line-height-tight: 1.25;
  --line-height-normal: 1.5;
  --line-height-relaxed: 1.75;
  --font-weight-light: 300;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 800;
}

@media (prefers-reduced-motion: reduce) {
  * {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}
*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  font-size: 62.5%;
  -webkit-text-size-adjust: 100%;
  width: 100%;
  height: 100%;
  overflow-x: hidden;
}

body {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 100vh;
  margin: 0;
  font-family: var(--font-base), serif;
  font-optical-sizing: auto;
  font-size: var(--font-size-base);
  line-height: var(--line-height-normal);
  letter-spacing: var(--letter-spacing-wide);
  color: var(--color-text-main);
  background-color: var(--color-bg-accent-light);
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.app-bg-overlay {
  position: fixed;
  inset: 0;
  z-index: -1;
}
.app-bg-overlay .ex-1 {
  position: absolute;
  top: -1rem;
  right: 0;
}
.app-bg-overlay .ex-2 {
  position: absolute;
  left: -1rem;
  bottom: -1rem;
  transform: rotate(-180deg);
}

/* =========================
   Headings
========================= */
.heading-1 {
  font-size: var(--font-size-3xl);
  font-weight: var(--font-weight-semibold);
  line-height: var(--line-height-tight);
  color: rgb(var(--color-rgb-text-heading)/1);
}

.heading-2 {
  font-size: var(--font-size-2xl);
  font-weight: var(--font-weight-semibold);
  line-height: var(--line-height-tight);
}

.heading-3 {
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-medium);
}

.heading-4 {
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-medium);
}

/* =========================
   Text utilities
========================= */
.text-sm {
  font-size: var(--font-size-sm);
}

.text-xs {
  font-size: var(--font-size-xs);
}

.text-muted {
  color: var(--color-text-muted);
}

.text-strong {
  font-weight: var(--font-weight-semibold);
}

/* =========================
   Links
========================= */
a {
  color: rgb(var(--color-rgb-accent)/1);
  text-decoration: none;
}
.w-100 {
  width: 100%;
}

.h-100 {
  height: 100%;
}

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

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

.mx-auto {
  margin-left: auto;
  margin-right: auto;
}

.max-w-100 {
  max-width: 100%;
}

.max-w-inputs {
  max-width: var(--max-inputs-width);
}

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

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

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

.text-bold {
  font-weight: 800;
}

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

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

.text-hint {
  color: rgb(var(--color-rgb-text-placeholder)/1);
  font-size: var(--font-size-md);
}

.text-uppercase {
  text-transform: uppercase;
}

.text-truncate {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

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

.text-break {
  word-break: break-word;
}

.hr-dark {
  border: 0;
  border-bottom: 1px solid rgb(var(--color-rgb-border-dark)/1);
}

.grid {
  display: grid;
  gap: var(--space-6);
  grid-template-columns: repeat(3, 1fr);
  grid-auto-rows: auto;
  grid-auto-flow: dense;
}

/* -----------------------------
   COLUMN COUNT
-------------------------------- */
.grid--1 {
  grid-template-columns: repeat(1, 1fr);
}

.grid--2 {
  grid-template-columns: repeat(2, 1fr);
}

.grid--3 {
  grid-template-columns: repeat(3, 1fr);
}

.grid--4 {
  grid-template-columns: repeat(4, 1fr);
}

.grid--5 {
  grid-template-columns: repeat(5, 1fr);
}

.grid--6 {
  grid-template-columns: repeat(6, 1fr);
}

@media (max-width: 1023px) {
  .grid--3,
  .grid--4 {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 767px) {
  .grid--2,
  .grid--3,
  .grid--4 {
    grid-template-columns: 1fr;
  }
}

.grid--auto {
  grid-template-columns: repeat(auto-fit, minmax(26rem, 1fr));
}

/* -----------------------------
   COLUMN SPAN
-------------------------------- */
.col-span-2 {
  grid-column: span 2;
}

.col-span-3 {
  grid-column: span 3;
}

.col-span-4 {
  grid-column: span 4;
}

.col-span-5 {
  grid-column: span 5;
}

.col-span-6 {
  grid-column: span 6;
}

@media (max-width: 767px) {
  .col-span-2 {
    grid-column: span 1;
  }
  .col-span-3 {
    grid-column: span 1;
  }
  .col-span-4 {
    grid-column: span 1;
  }
  .col-span-5 {
    grid-column: span 1;
  }
  .col-span-6 {
    grid-column: span 1;
  }
}
.col-full {
  grid-column: 1/-1;
}

.col-start-1 {
  grid-column-start: 1;
}

.col-end-1 {
  grid-column-end: 1;
}

.col-start-2 {
  grid-column-start: 2;
}

.col-end-2 {
  grid-column-end: 2;
}

.col-start-3 {
  grid-column-start: 3;
}

.col-end-3 {
  grid-column-end: 3;
}

.m--0 {
  margin: var(--space-0);
}

.p--0 {
  padding: var(--space-0);
}

.m-t-0 {
  margin-top: var(--space-0);
}

.p-t-0 {
  padding-top: var(--space-0);
}

.m-b-0 {
  margin-bottom: var(--space-0);
}

.p-b-0 {
  padding-bottom: var(--space-0);
}

.m-l-0 {
  margin-left: var(--space-0);
}

.p-l-0 {
  padding-left: var(--space-0);
}

.m-r-0 {
  margin-right: var(--space-0);
}

.p-r-0 {
  padding-right: var(--space-0);
}

.m-x-0 {
  margin-left: var(--space-0);
  margin-right: var(--space-0);
}

.p-x-0 {
  padding-left: var(--space-0);
  padding-right: var(--space-0);
}

.m-y-0 {
  margin-top: var(--space-0);
  margin-bottom: var(--space-0);
}

.p-y-0 {
  padding-top: var(--space-0);
  padding-bottom: var(--space-0);
}

.m--1 {
  margin: var(--space-1);
}

.p--1 {
  padding: var(--space-1);
}

.m-t-1 {
  margin-top: var(--space-1);
}

.p-t-1 {
  padding-top: var(--space-1);
}

.m-b-1 {
  margin-bottom: var(--space-1);
}

.p-b-1 {
  padding-bottom: var(--space-1);
}

.m-l-1 {
  margin-left: var(--space-1);
}

.p-l-1 {
  padding-left: var(--space-1);
}

.m-r-1 {
  margin-right: var(--space-1);
}

.p-r-1 {
  padding-right: var(--space-1);
}

.m-x-1 {
  margin-left: var(--space-1);
  margin-right: var(--space-1);
}

.p-x-1 {
  padding-left: var(--space-1);
  padding-right: var(--space-1);
}

.m-y-1 {
  margin-top: var(--space-1);
  margin-bottom: var(--space-1);
}

.p-y-1 {
  padding-top: var(--space-1);
  padding-bottom: var(--space-1);
}

.m--2 {
  margin: var(--space-2);
}

.p--2 {
  padding: var(--space-2);
}

.m-t-2 {
  margin-top: var(--space-2);
}

.p-t-2 {
  padding-top: var(--space-2);
}

.m-b-2 {
  margin-bottom: var(--space-2);
}

.p-b-2 {
  padding-bottom: var(--space-2);
}

.m-l-2 {
  margin-left: var(--space-2);
}

.p-l-2 {
  padding-left: var(--space-2);
}

.m-r-2 {
  margin-right: var(--space-2);
}

.p-r-2 {
  padding-right: var(--space-2);
}

.m-x-2 {
  margin-left: var(--space-2);
  margin-right: var(--space-2);
}

.p-x-2 {
  padding-left: var(--space-2);
  padding-right: var(--space-2);
}

.m-y-2 {
  margin-top: var(--space-2);
  margin-bottom: var(--space-2);
}

.p-y-2 {
  padding-top: var(--space-2);
  padding-bottom: var(--space-2);
}

.m--3 {
  margin: var(--space-3);
}

.p--3 {
  padding: var(--space-3);
}

.m-t-3 {
  margin-top: var(--space-3);
}

.p-t-3 {
  padding-top: var(--space-3);
}

.m-b-3 {
  margin-bottom: var(--space-3);
}

.p-b-3 {
  padding-bottom: var(--space-3);
}

.m-l-3 {
  margin-left: var(--space-3);
}

.p-l-3 {
  padding-left: var(--space-3);
}

.m-r-3 {
  margin-right: var(--space-3);
}

.p-r-3 {
  padding-right: var(--space-3);
}

.m-x-3 {
  margin-left: var(--space-3);
  margin-right: var(--space-3);
}

.p-x-3 {
  padding-left: var(--space-3);
  padding-right: var(--space-3);
}

.m-y-3 {
  margin-top: var(--space-3);
  margin-bottom: var(--space-3);
}

.p-y-3 {
  padding-top: var(--space-3);
  padding-bottom: var(--space-3);
}

.m--4 {
  margin: var(--space-4);
}

.p--4 {
  padding: var(--space-4);
}

.m-t-4 {
  margin-top: var(--space-4);
}

.p-t-4 {
  padding-top: var(--space-4);
}

.m-b-4 {
  margin-bottom: var(--space-4);
}

.p-b-4 {
  padding-bottom: var(--space-4);
}

.m-l-4 {
  margin-left: var(--space-4);
}

.p-l-4 {
  padding-left: var(--space-4);
}

.m-r-4 {
  margin-right: var(--space-4);
}

.p-r-4 {
  padding-right: var(--space-4);
}

.m-x-4 {
  margin-left: var(--space-4);
  margin-right: var(--space-4);
}

.p-x-4 {
  padding-left: var(--space-4);
  padding-right: var(--space-4);
}

.m-y-4 {
  margin-top: var(--space-4);
  margin-bottom: var(--space-4);
}

.p-y-4 {
  padding-top: var(--space-4);
  padding-bottom: var(--space-4);
}

.m--5 {
  margin: var(--space-5);
}

.p--5 {
  padding: var(--space-5);
}

.m-t-5 {
  margin-top: var(--space-5);
}

.p-t-5 {
  padding-top: var(--space-5);
}

.m-b-5 {
  margin-bottom: var(--space-5);
}

.p-b-5 {
  padding-bottom: var(--space-5);
}

.m-l-5 {
  margin-left: var(--space-5);
}

.p-l-5 {
  padding-left: var(--space-5);
}

.m-r-5 {
  margin-right: var(--space-5);
}

.p-r-5 {
  padding-right: var(--space-5);
}

.m-x-5 {
  margin-left: var(--space-5);
  margin-right: var(--space-5);
}

.p-x-5 {
  padding-left: var(--space-5);
  padding-right: var(--space-5);
}

.m-y-5 {
  margin-top: var(--space-5);
  margin-bottom: var(--space-5);
}

.p-y-5 {
  padding-top: var(--space-5);
  padding-bottom: var(--space-5);
}

.m--6 {
  margin: var(--space-6);
}

.p--6 {
  padding: var(--space-6);
}

.m-t-6 {
  margin-top: var(--space-6);
}

.p-t-6 {
  padding-top: var(--space-6);
}

.m-b-6 {
  margin-bottom: var(--space-6);
}

.p-b-6 {
  padding-bottom: var(--space-6);
}

.m-l-6 {
  margin-left: var(--space-6);
}

.p-l-6 {
  padding-left: var(--space-6);
}

.m-r-6 {
  margin-right: var(--space-6);
}

.p-r-6 {
  padding-right: var(--space-6);
}

.m-x-6 {
  margin-left: var(--space-6);
  margin-right: var(--space-6);
}

.p-x-6 {
  padding-left: var(--space-6);
  padding-right: var(--space-6);
}

.m-y-6 {
  margin-top: var(--space-6);
  margin-bottom: var(--space-6);
}

.p-y-6 {
  padding-top: var(--space-6);
  padding-bottom: var(--space-6);
}

.m--7 {
  margin: var(--space-7);
}

.p--7 {
  padding: var(--space-7);
}

.m-t-7 {
  margin-top: var(--space-7);
}

.p-t-7 {
  padding-top: var(--space-7);
}

.m-b-7 {
  margin-bottom: var(--space-7);
}

.p-b-7 {
  padding-bottom: var(--space-7);
}

.m-l-7 {
  margin-left: var(--space-7);
}

.p-l-7 {
  padding-left: var(--space-7);
}

.m-r-7 {
  margin-right: var(--space-7);
}

.p-r-7 {
  padding-right: var(--space-7);
}

.m-x-7 {
  margin-left: var(--space-7);
  margin-right: var(--space-7);
}

.p-x-7 {
  padding-left: var(--space-7);
  padding-right: var(--space-7);
}

.m-y-7 {
  margin-top: var(--space-7);
  margin-bottom: var(--space-7);
}

.p-y-7 {
  padding-top: var(--space-7);
  padding-bottom: var(--space-7);
}

.m--8 {
  margin: var(--space-8);
}

.p--8 {
  padding: var(--space-8);
}

.m-t-8 {
  margin-top: var(--space-8);
}

.p-t-8 {
  padding-top: var(--space-8);
}

.m-b-8 {
  margin-bottom: var(--space-8);
}

.p-b-8 {
  padding-bottom: var(--space-8);
}

.m-l-8 {
  margin-left: var(--space-8);
}

.p-l-8 {
  padding-left: var(--space-8);
}

.m-r-8 {
  margin-right: var(--space-8);
}

.p-r-8 {
  padding-right: var(--space-8);
}

.m-x-8 {
  margin-left: var(--space-8);
  margin-right: var(--space-8);
}

.p-x-8 {
  padding-left: var(--space-8);
  padding-right: var(--space-8);
}

.m-y-8 {
  margin-top: var(--space-8);
  margin-bottom: var(--space-8);
}

.p-y-8 {
  padding-top: var(--space-8);
  padding-bottom: var(--space-8);
}

.m--9 {
  margin: var(--space-9);
}

.p--9 {
  padding: var(--space-9);
}

.m-t-9 {
  margin-top: var(--space-9);
}

.p-t-9 {
  padding-top: var(--space-9);
}

.m-b-9 {
  margin-bottom: var(--space-9);
}

.p-b-9 {
  padding-bottom: var(--space-9);
}

.m-l-9 {
  margin-left: var(--space-9);
}

.p-l-9 {
  padding-left: var(--space-9);
}

.m-r-9 {
  margin-right: var(--space-9);
}

.p-r-9 {
  padding-right: var(--space-9);
}

.m-x-9 {
  margin-left: var(--space-9);
  margin-right: var(--space-9);
}

.p-x-9 {
  padding-left: var(--space-9);
  padding-right: var(--space-9);
}

.m-y-9 {
  margin-top: var(--space-9);
  margin-bottom: var(--space-9);
}

.p-y-9 {
  padding-top: var(--space-9);
  padding-bottom: var(--space-9);
}

.m--10 {
  margin: var(--space-10);
}

.p--10 {
  padding: var(--space-10);
}

.m-t-10 {
  margin-top: var(--space-10);
}

.p-t-10 {
  padding-top: var(--space-10);
}

.m-b-10 {
  margin-bottom: var(--space-10);
}

.p-b-10 {
  padding-bottom: var(--space-10);
}

.m-l-10 {
  margin-left: var(--space-10);
}

.p-l-10 {
  padding-left: var(--space-10);
}

.m-r-10 {
  margin-right: var(--space-10);
}

.p-r-10 {
  padding-right: var(--space-10);
}

.m-x-10 {
  margin-left: var(--space-10);
  margin-right: var(--space-10);
}

.p-x-10 {
  padding-left: var(--space-10);
  padding-right: var(--space-10);
}

.m-y-10 {
  margin-top: var(--space-10);
  margin-bottom: var(--space-10);
}

.p-y-10 {
  padding-top: var(--space-10);
  padding-bottom: var(--space-10);
}

.m--11 {
  margin: var(--space-11);
}

.p--11 {
  padding: var(--space-11);
}

.m-t-11 {
  margin-top: var(--space-11);
}

.p-t-11 {
  padding-top: var(--space-11);
}

.m-b-11 {
  margin-bottom: var(--space-11);
}

.p-b-11 {
  padding-bottom: var(--space-11);
}

.m-l-11 {
  margin-left: var(--space-11);
}

.p-l-11 {
  padding-left: var(--space-11);
}

.m-r-11 {
  margin-right: var(--space-11);
}

.p-r-11 {
  padding-right: var(--space-11);
}

.m-x-11 {
  margin-left: var(--space-11);
  margin-right: var(--space-11);
}

.p-x-11 {
  padding-left: var(--space-11);
  padding-right: var(--space-11);
}

.m-y-11 {
  margin-top: var(--space-11);
  margin-bottom: var(--space-11);
}

.p-y-11 {
  padding-top: var(--space-11);
  padding-bottom: var(--space-11);
}

.m--12 {
  margin: var(--space-12);
}

.p--12 {
  padding: var(--space-12);
}

.m-t-12 {
  margin-top: var(--space-12);
}

.p-t-12 {
  padding-top: var(--space-12);
}

.m-b-12 {
  margin-bottom: var(--space-12);
}

.p-b-12 {
  padding-bottom: var(--space-12);
}

.m-l-12 {
  margin-left: var(--space-12);
}

.p-l-12 {
  padding-left: var(--space-12);
}

.m-r-12 {
  margin-right: var(--space-12);
}

.p-r-12 {
  padding-right: var(--space-12);
}

.m-x-12 {
  margin-left: var(--space-12);
  margin-right: var(--space-12);
}

.p-x-12 {
  padding-left: var(--space-12);
  padding-right: var(--space-12);
}

.m-y-12 {
  margin-top: var(--space-12);
  margin-bottom: var(--space-12);
}

.p-y-12 {
  padding-top: var(--space-12);
  padding-bottom: var(--space-12);
}

.m--13 {
  margin: var(--space-13);
}

.p--13 {
  padding: var(--space-13);
}

.m-t-13 {
  margin-top: var(--space-13);
}

.p-t-13 {
  padding-top: var(--space-13);
}

.m-b-13 {
  margin-bottom: var(--space-13);
}

.p-b-13 {
  padding-bottom: var(--space-13);
}

.m-l-13 {
  margin-left: var(--space-13);
}

.p-l-13 {
  padding-left: var(--space-13);
}

.m-r-13 {
  margin-right: var(--space-13);
}

.p-r-13 {
  padding-right: var(--space-13);
}

.m-x-13 {
  margin-left: var(--space-13);
  margin-right: var(--space-13);
}

.p-x-13 {
  padding-left: var(--space-13);
  padding-right: var(--space-13);
}

.m-y-13 {
  margin-top: var(--space-13);
  margin-bottom: var(--space-13);
}

.p-y-13 {
  padding-top: var(--space-13);
  padding-bottom: var(--space-13);
}

.color-primary {
  color: #FFC522;
}

.color-primary-accent-light {
  color: #FFFBEE;
}

.color-secondary {
  color: #1D398D;
}

.color-secondary-accent {
  color: #1245E0;
}

.color-accent {
  color: #009DDC;
}

.color-accent-dark {
  color: #5A70B4;
}

.color-accent-light {
  color: #C7DFFD;
}

.color-neutral-base {
  color: #F7F9FC;
}

.color-neutral-base-dark {
  color: #E5EDF7;
}

.color-bg-light {
  color: #F6FAFF;
}

.color-bg-light-hover {
  color: #F4F9FF;
}

.color-bg-light-2 {
  color: #F2F5FA;
}

.color-bg-light-2-hover {
  color: #F4F9FF;
}

.color-bg-light-3 {
  color: #F4F9FF;
}

.color-bg-light-3-hover {
  color: #e8edf2;
}

.color-bg-accent-light {
  color: #F4F9FF;
}

.color-bg-disabled {
  color: #E5EDF7;
}

.color-white {
  color: #ffffff;
}

.color-black {
  color: #000000;
}

.color-text-heading {
  color: #1E1E1E;
}

.color-text-main {
  color: #1E1E1E;
}

.color-text-secondary {
  color: #0A2F9F;
}

.color-text-accent {
  color: #4A82FF;
}

.color-text-accent-dark {
  color: #5A70B4;
}

.color-text-muted {
  color: #6b7280;
}

.color-text-disabled {
  color: #9ca3af;
}

.color-text-placeholder {
  color: #939EB1;
}

.color-success {
  color: #16A34A;
}

.color-warning {
  color: #FFD400;
}

.color-info {
  color: #38BDF8;
}

.color-danger {
  color: #d95340;
}

.color-error {
  color: #DC2626;
}

.color-upload {
  color: #BA027A;
}

.color-file-edit {
  color: #008C77;
}

.color-badge-success {
  color: #16A34A;
}

.color-badge-success-light {
  color: #D1E7DD;
}

.color-badge-warning {
  color: #FFD400;
}

.color-badge-warning-light {
  color: #FFF4D9;
}

.color-badge-warning-text {
  color: #856404;
}

.color-badge-info {
  color: #38BDF8;
}

.color-badge-info-light {
  color: #D9EDF7;
}

.color-badge-danger {
  color: #d95340;
}

.color-badge-danger-light {
  color: #F8D7DA;
}

.color-border-light {
  color: #F0F2F4;
}

.color-border-light-2 {
  color: #E5EDF7;
}

.color-border-dark {
  color: #D4E1F0;
}

.color-border-darker {
  color: #acc0d8;
}

.color-border-accent-light {
  color: #F4F9FF;
}

.color-border-accent {
  color: #E5E9F6;
}

.color-input-bg {
  color: #ffffff;
}

.color-input-bg-disabled {
  color: #F2F5FA;
}

.color-input-bg-disabled-dark {
  color: #C7D8ED;
}

.color-input-placeholder {
  color: #9ca3af;
}

.color-input-disabled {
  color: #C1CCEC;
}

.color-input-icon-color {
  color: #8F98B5;
}

.icon-color-primary::before {
  color: #FFC522 !important;
}

.icon-color-primary-accent-light::before {
  color: #FFFBEE !important;
}

.icon-color-secondary::before {
  color: #1D398D !important;
}

.icon-color-secondary-accent::before {
  color: #1245E0 !important;
}

.icon-color-accent::before {
  color: #009DDC !important;
}

.icon-color-accent-dark::before {
  color: #5A70B4 !important;
}

.icon-color-accent-light::before {
  color: #C7DFFD !important;
}

.icon-color-neutral-base::before {
  color: #F7F9FC !important;
}

.icon-color-neutral-base-dark::before {
  color: #E5EDF7 !important;
}

.icon-color-bg-light::before {
  color: #F6FAFF !important;
}

.icon-color-bg-light-hover::before {
  color: #F4F9FF !important;
}

.icon-color-bg-light-2::before {
  color: #F2F5FA !important;
}

.icon-color-bg-light-2-hover::before {
  color: #F4F9FF !important;
}

.icon-color-bg-light-3::before {
  color: #F4F9FF !important;
}

.icon-color-bg-light-3-hover::before {
  color: #e8edf2 !important;
}

.icon-color-bg-accent-light::before {
  color: #F4F9FF !important;
}

.icon-color-bg-disabled::before {
  color: #E5EDF7 !important;
}

.icon-color-white::before {
  color: #ffffff !important;
}

.icon-color-black::before {
  color: #000000 !important;
}

.icon-color-text-heading::before {
  color: #1E1E1E !important;
}

.icon-color-text-main::before {
  color: #1E1E1E !important;
}

.icon-color-text-secondary::before {
  color: #0A2F9F !important;
}

.icon-color-text-accent::before {
  color: #4A82FF !important;
}

.icon-color-text-accent-dark::before {
  color: #5A70B4 !important;
}

.icon-color-text-muted::before {
  color: #6b7280 !important;
}

.icon-color-text-disabled::before {
  color: #9ca3af !important;
}

.icon-color-text-placeholder::before {
  color: #939EB1 !important;
}

.icon-color-success::before {
  color: #16A34A !important;
}

.icon-color-warning::before {
  color: #FFD400 !important;
}

.icon-color-info::before {
  color: #38BDF8 !important;
}

.icon-color-danger::before {
  color: #d95340 !important;
}

.icon-color-error::before {
  color: #DC2626 !important;
}

.icon-color-upload::before {
  color: #BA027A !important;
}

.icon-color-file-edit::before {
  color: #008C77 !important;
}

.icon-color-badge-success::before {
  color: #16A34A !important;
}

.icon-color-badge-success-light::before {
  color: #D1E7DD !important;
}

.icon-color-badge-warning::before {
  color: #FFD400 !important;
}

.icon-color-badge-warning-light::before {
  color: #FFF4D9 !important;
}

.icon-color-badge-warning-text::before {
  color: #856404 !important;
}

.icon-color-badge-info::before {
  color: #38BDF8 !important;
}

.icon-color-badge-info-light::before {
  color: #D9EDF7 !important;
}

.icon-color-badge-danger::before {
  color: #d95340 !important;
}

.icon-color-badge-danger-light::before {
  color: #F8D7DA !important;
}

.icon-color-border-light::before {
  color: #F0F2F4 !important;
}

.icon-color-border-light-2::before {
  color: #E5EDF7 !important;
}

.icon-color-border-dark::before {
  color: #D4E1F0 !important;
}

.icon-color-border-darker::before {
  color: #acc0d8 !important;
}

.icon-color-border-accent-light::before {
  color: #F4F9FF !important;
}

.icon-color-border-accent::before {
  color: #E5E9F6 !important;
}

.icon-color-input-bg::before {
  color: #ffffff !important;
}

.icon-color-input-bg-disabled::before {
  color: #F2F5FA !important;
}

.icon-color-input-bg-disabled-dark::before {
  color: #C7D8ED !important;
}

.icon-color-input-placeholder::before {
  color: #9ca3af !important;
}

.icon-color-input-disabled::before {
  color: #C1CCEC !important;
}

.icon-color-input-icon-color::before {
  color: #8F98B5 !important;
}

@keyframes collapseHint {
  0% {
    transform: translateX(0);
  }
  33% {
    transform: translateX(-3px);
  }
  66% {
    transform: translateX(1px);
  }
  100% {
    transform: translateX(0);
  }
}
@media (prefers-reduced-motion: reduce) {
  * {
    transition-duration: 1ms !important;
    animation-duration: 1ms !important;
  }
}
.app {
  height: 100vh;
  overflow: hidden;
}
.app.is-collapsed .app-main {
  width: 100%;
}
.app.is-collapsed .app-sidebar {
  width: 0;
  opacity: 0;
  overflow: hidden;
  transform: scaleX(0.95);
  transition: width 420ms cubic-bezier(0.4, 0, 0.2, 1), opacity 50ms ease;
}

.app .app-wrapper {
  height: 100vh;
  display: flex;
  flex-direction: column;
  row-gap: var(--app-padding);
  padding: var(--app-padding);
}

.app-body {
  flex: 1;
  width: 100%;
  display: flex;
  flex-direction: row;
  column-gap: var(--app-padding);
  min-height: 0;
  overflow: hidden;
}

.app-body .app-main {
  width: calc(100% - var(--layout-sidebar-width));
  height: 100%;
  min-height: 0;
  display: flex;
  flex-direction: column;
  contain: layout paint;
  overflow: hidden;
  transition: max-width 420ms cubic-bezier(0.25, 0.8, 0.25, 1);
}

@media (max-width: 1023px) {
  .app-body .app-main {
    width: 100%;
  }
}
@media (max-width: 539px) {
  .app .app-wrapper {
    padding: 0;
  }
}
.app-header {
  height: var(--layout-app-header-height);
  flex-shrink: 0;
  display: flex;
  justify-content: space-between;
  gap: var(--app-padding);
  z-index: 1;
  /* =========================================
     HEADER ACCOUNT DROPDOWN
  ========================================= */
  /* Dropdown */
  /* =========================================
   HEADER TOGGLE BUTTON
  ========================================= */
  /* =========================================
   COLLAPSE SIDEBAR BUTTON
  ========================================= */
}
.app-header .app-header__left {
  flex: 0 0 var(--layout-sidebar-width);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--space-5);
  background: var(--color-white);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-md);
  padding: var(--space-5) var(--space-6);
}
.app-header .app-header__right {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: var(--space-6);
  flex: 1;
  background: var(--color-white);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-md);
  padding: var(--space-5) var(--space-6);
}
.app-header .app-header__left .app-logo img {
  width: 100%;
  max-height: 4rem;
  object-fit: contain;
  object-position: center;
}
@media (max-width: 539px) {
  .app-header .app-header__left .app-logo img {
    max-height: 2.75rem;
  }
}
.app-header .app-header__right {
  position: relative;
}
.app-header .app-header__right .header-week {
  display: flex;
  align-items: center;
  gap: var(--space-4);
}
.app-header .app-header__right .header-week__icon {
  width: 3.6rem;
  height: 3.6rem;
  font-size: 2.2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-xl);
  background: var(--color-bg-light-2);
}
.app-header .app-header__right .header-week__content {
  display: flex;
  flex-direction: column;
}
.app-header .app-header__right .header-week__label {
  font-size: var(--font-size-xs);
  color: var(--color-text-accent-dark);
}
.app-header .app-header__right .header-week__label .hw-l-w {
  font-weight: var(--font-weight-semibold);
}
.app-header .app-header__right .header-week__date {
  font-size: 1.3rem;
  font-weight: var(--font-weight-semibold);
  line-height: 1.2;
  color: var(--color-secondary-accent);
}
.app-header .app-header__right .header-actions {
  display: flex;
  align-items: center;
  gap: var(--space-4);
}
.app-header .app-header__right .header-icon-btn {
  position: relative;
  width: 3.6rem;
  height: 3.6rem;
  font-size: 2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-xl);
  background: var(--color-bg-light-2);
  border: none;
  cursor: pointer;
  transition: box-shadow var(--motion-duration-fast) var(--motion-ease-standard), background-color var(--motion-duration-fast) var(--motion-ease-standard);
}
.app-header .app-header__right .header-icon-btn:hover {
  background: rgb(var(--color-rgb-bg-light-3-hover)/1);
}
.app-header .app-header__right .header-icon-btn__dot {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 8px;
  height: 8px;
  background: var(--color-warning);
  border-radius: 50%;
}
.app-header .app-header__right .header-user {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-4);
}
.app-header .app-header__right .header-user__avatar {
  font-size: 2.4rem;
  width: 3.6rem;
  height: 3.6rem;
  aspect-ratio: 1;
  border-radius: var(--radius-xl);
  background: var(--color-secondary-accent);
  display: grid;
  place-items: center;
}
.app-header .app-header__right .header-user__info {
  display: flex;
  flex-direction: column;
}
.app-header .app-header__right .header-user__name {
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-semibold);
}
.app-header .app-header__right .header-user__role {
  font-size: var(--font-size-xs);
  color: var(--color-text-accent-dark);
}
.app-header .app-header__right .header-divider {
  width: 1px;
  height: 70%;
  background: var(--color-border-light);
}
.app-header .header-account {
  position: relative;
}
.app-header .header-account .header-account__trigger {
  display: flex;
  align-items: center;
  gap: var(--space-4);
  background: transparent;
  border: 0;
  cursor: pointer;
  padding: 0;
  transition: box-shadow var(--motion-duration-fast) var(--motion-ease-standard), background-color var(--motion-duration-fast) var(--motion-ease-standard);
}
.app-header .header-account .header-account__avatar {
  width: 3.6rem;
  height: 3.6rem;
  aspect-ratio: 1/1;
  border-radius: var(--radius-xl);
  background: rgb(var(--color-rgb-secondary)/1);
  color: rgb(var(--color-rgb-white)/1);
  display: grid;
  place-items: center;
  font-weight: var(--font-weight-semibold);
  line-height: 1;
}
.app-header .header-account .header-account__avatar .icon {
  font-size: 2.2rem;
  color: rgb(var(--color-rgb-white)/1);
}
.app-header .header-account .header-account__meta {
  text-align: left;
}
.app-header .header-account .header-account__name {
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-semibold);
}
.app-header .header-account .header-account__role {
  font-size: var(--font-size-xs);
  color: var(--color-text-accent-dark);
}
@media (max-width: 767px) {
  .app-header .header-account .header-account__meta {
    display: none;
  }
}
.app-header .account-dropdown {
  position: absolute;
  top: calc(100% + 1rem);
  right: 0;
  width: 28rem;
  background: rgb(var(--color-rgb-white)/1);
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-xl);
  padding: var(--space-4);
  opacity: 0;
  pointer-events: none;
  transition: opacity var(--motion-duration-fast) var(--motion-ease-standard);
  /* Header section */
  /* Items */
}
.app-header .account-dropdown.is-open {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}
.app-header .account-dropdown .account-dropdown__header {
  display: none;
  gap: var(--space-4);
  padding: var(--space-3) var(--space-2);
  margin-bottom: var(--space-2);
}
.app-header .account-dropdown .account-dropdown__avatar {
  font-weight: var(--font-weight-bold);
  width: 3.6rem;
  height: 3.6rem;
  border-radius: var(--radius-xl);
  aspect-ratio: 1/1;
  background: rgb(var(--color-rgb-bg-light-2)/1);
  display: grid;
  place-items: center;
}
.app-header .account-dropdown .account-dropdown__name {
  font-weight: var(--font-weight-semibold);
}
.app-header .account-dropdown .account-dropdown__email {
  font-size: var(--font-size-xs);
  color: rgb(var(--color-rgb-text-muted)/1);
}
.app-header .account-dropdown .account-dropdown__divider {
  height: 1px;
  background: rgb(var(--color-rgb-border-light)/1);
  margin: var(--space-3) 0;
}
.app-header .account-dropdown .account-dropdown__divider.divider-1 {
  display: none;
}
.app-header .account-dropdown .account-dropdown__item {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-3) var(--space-3);
  border-radius: var(--radius-md);
  font-size: var(--font-size-base);
  text-decoration: none;
  color: rgb(var(--color-rgb-text-main)/1);
  transition: box-shadow var(--motion-duration-fast) var(--motion-ease-standard), background-color var(--motion-duration-fast) var(--motion-ease-standard);
}
.app-header .account-dropdown .account-dropdown__item:hover {
  background: rgb(var(--color-rgb-bg-light-3)/1);
}
.app-header .account-dropdown .account-dropdown__item .icon {
  font-size: 1.8rem;
}
.app-header .account-dropdown form.logout-form-inline {
  padding-bottom: 0;
}
@media (max-width: 539px) {
  .app-header .account-dropdown .account-dropdown__header {
    display: flex;
  }
  .app-header .account-dropdown .account-dropdown__divider.divider-1,
  .app-header .account-dropdown .account-dropdown__divider.divider-2 {
    display: block;
  }
  .app-header .account-dropdown .account-dropdown__name {
    font-size: var(--font-size-sm);
  }
}
.app-header #sidebarToggle {
  display: none;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0.3rem;
  aspect-ratio: 1/1;
  background: rgb(var(--color-rgb-bg-light-2)/1);
  padding: var(--space-3);
  border-radius: var(--radius-lg);
  border: 1px solid rgb(var(--color-rgb-border-light-2)/1);
  cursor: pointer;
}
.app-header #sidebarToggle span {
  display: block;
  width: 1.7rem;
  height: 1.65px;
  background: rgb(var(--color-rgb-secondary)/1);
  border-radius: 3px;
  transition: all var(--motion-duration-fast) var(--motion-ease-standard);
}
.app-header .app-sidebar-overlay {
  display: none;
}
.app-header .header-collapse-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.6rem;
  aspect-ratio: 1/1;
  height: 2.75rem;
  width: 2.75rem;
  background: rgb(var(--color-rgb-bg-light-2)/1);
  border-radius: var(--radius-full);
  border: 0;
  padding: var(--space-1);
  cursor: pointer;
  transition: box-shadow var(--motion-duration-fast) var(--motion-ease-standard), background-color var(--motion-duration-fast) var(--motion-ease-standard), transform var(--motion-duration-fast) var(--motion-ease-standard);
}
.app-header .header-collapse-btn.is-collapsed {
  transform: rotate(180deg);
}
.app-header .header-collapse-btn:hover .icon::before {
  animation: collapseHint 0.8s ease;
}
@media (max-width: 1023px) {
  .app-header .header-collapse-btn {
    display: none;
  }
}
@media (max-width: 1023px) {
  .app-header {
    background: var(--color-white);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-md);
  }
  .app-header .app-header__left {
    flex: 1 1 auto;
    display: flex;
    justify-content: flex-start;
    background: transparent;
    box-shadow: none;
    padding-inline: var(--space-5);
  }
  .app-header #sidebarToggle {
    display: flex;
  }
  .app-header .app-sidebar-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.4);
    backdrop-filter: blur(2px);
    z-index: 2000;
    display: none;
  }
  .app-header .app-sidebar-overlay.is-active {
    display: block;
  }
  .app-header .app-header__right {
    flex: 1 0 auto;
    background: transparent;
    box-shadow: none;
    padding-inline: var(--space-5);
  }
  .app-header .app-header__right .header-user__info {
    display: none;
  }
  .app-header .app-header__right .divider-1 {
    display: none;
  }
  .app-header .app-header__right .header-week__icon {
    display: none;
  }
  .app-header .app-header__right .header-week__content .header-week__date {
    display: none;
  }
  .app-header .app-header__right .header-week__content .header-week__label {
    display: flex;
    flex-direction: column;
    text-align: right;
  }
}
@media (max-width: 767px) {
  .app-header {
    gap: 0;
  }
  .app-header .app-header__right {
    gap: var(--space-4);
  }
}
@media (max-width: 539px) {
  .app-header {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
  }
  .app-header .app-header__right {
    gap: var(--space-3);
  }
  .app-header .app-header__right .header-actions #btnSettings {
    display: none;
  }
  .app-header .header-icon-btn--mobile {
    display: flex;
  }
  .app-header .app-header__right .header-week {
    display: none;
  }
  .app-header .app-header__right .header-divider.divider-2 {
    display: none;
  }
}

.app-sidebar {
  width: var(--layout-sidebar-width);
  display: flex;
  flex-direction: column;
  gap: var(--app-padding);
  overflow: hidden;
  will-change: transform;
  transition: width 420ms cubic-bezier(0.4, 0, 0.2, 1), opacity 50ms ease;
}
.app-sidebar .sidebar-main {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: var(--space-6);
  min-height: 0;
  background: rgb(var(--color-rgb-white)/1);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-md);
  padding: var(--space-6) var(--space-5);
  overflow-x: hidden;
  overflow-y: auto;
}
.app-sidebar .sidebar-main::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px rgb(var(--color-rgb-border-dark)/0.2);
  background-color: rgb(var(--color-rgb-bg-light)/0.5);
}
.app-sidebar .sidebar-main::-webkit-scrollbar {
  width: 2px;
  background-color: rgb(var(--color-rgb-bg-light)/0.5);
}
.app-sidebar .sidebar-main::-webkit-scrollbar-thumb {
  background-color: rgb(var(--color-rgb-border-darker)/0.8);
  border-radius: 10px;
}
.app-sidebar .sidebar-nav {
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
  /* =========================================
       NAV DROPDOWN (2nd LEVEL)
    ========================================= */
}
.app-sidebar .sidebar-nav .nav-title {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  letter-spacing: 0.04em;
  color: rgb(var(--color-rgb-text-accent-dark)/1);
  margin-bottom: var(--space-3);
}
.app-sidebar .sidebar-nav .nav-list {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  list-style: none;
  padding-left: 0;
}
.app-sidebar .sidebar-nav .nav-item {
  display: flex;
  align-items: flex-start;
  gap: var(--space-4);
  padding: var(--space-3) var(--space-4);
  border-radius: var(--radius-xl);
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-medium);
  color: rgb(var(--color-rgb-text-main)/1);
  text-decoration: none;
  position: relative;
  transition: color var(--motion-duration-fast) var(--motion-ease-standard), background-color var(--motion-duration-fast) var(--motion-ease-standard), border-color var(--motion-duration-fast) var(--motion-ease-standard);
}
.app-sidebar .sidebar-nav .nav-item:hover {
  background: rgb(var(--color-rgb-bg-light-3)/1);
}
.app-sidebar .sidebar-nav .nav-item:focus-visible {
  outline: 2px solid rgb(var(--color-rgb-accent)/1);
  outline-offset: 2px;
}
.app-sidebar .sidebar-nav .nav-item.is-active {
  font-weight: var(--font-weight-semibold);
  background: rgb(var(--color-rgb-bg-light-3)/1);
  color: rgb(var(--color-rgb-secondary-accent)/1);
  border: 1px solid rgb(var(--color-rgb-secondary-accent)/0.1);
}
.app-sidebar .sidebar-nav .nav-icon {
  width: 2rem;
  height: 2rem;
  flex-shrink: 0;
}
.app-sidebar .sidebar-nav .nav-item-group {
  display: flex;
  flex-direction: column;
  /* Parent Button */
  /* Caret */
  /* When open */
}
.app-sidebar .sidebar-nav .nav-item-group .nav-item--parent {
  position: relative;
  width: 100%;
  justify-content: space-between;
  background: transparent;
  border: 1px solid transparent;
  text-align: left;
  cursor: pointer;
}
.app-sidebar .sidebar-nav .nav-item-group .nav-item--parent .nav-label {
  flex: 1;
}
.app-sidebar .sidebar-nav .nav-item-group .nav-item--parent:hover {
  background: rgb(var(--color-rgb-bg-light-3)/1);
}
.app-sidebar .sidebar-nav .nav-item-group .nav-badge {
  position: absolute;
  top: calc(50% - 2px);
  right: calc(var(--space-3) + 12px);
  transform: translateY(-50%);
}
.app-sidebar .sidebar-nav .nav-item-group .nav-caret {
  position: absolute;
  top: calc(50% - 2px);
  right: var(--space-3);
  width: 0.6rem;
  height: 0.6rem;
  border-right: 2px solid rgb(var(--color-rgb-border-darker)/1);
  border-bottom: 2px solid rgb(var(--color-rgb-border-darker)/1);
  transform: rotate(45deg) translateY(-50%);
  transition: transform 0.25s ease;
}
.app-sidebar .sidebar-nav .nav-item-group.is-open .nav-caret {
  transform: rotate(-135deg);
}
.app-sidebar .sidebar-nav .nav-item-group.is-open .nav-sublist {
  max-height: 40rem;
  opacity: 1;
}
.app-sidebar .sidebar-nav .nav-item-group.is-active .nav-item--parent {
  font-weight: var(--font-weight-semibold);
  background: rgb(var(--color-rgb-bg-light-3)/1);
  border: 1px solid rgb(var(--color-rgb-secondary-accent)/0.1);
}
.app-sidebar .sidebar-nav .nav-sublist {
  display: flex;
  flex-direction: column;
  list-style: none;
  padding-left: calc(var(--space-4) + 6px);
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  transition: max-height 0.3s ease, opacity 0.2s ease;
}
.app-sidebar .sidebar-nav .nav-sublist > li {
  position: relative;
}
.app-sidebar .sidebar-nav .nav-sublist > li:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0.35rem;
  width: 1px;
  height: 100%;
  background-image: linear-gradient(rgb(var(--color-rgb-border-dark)/1) 50%, rgba(255, 255, 255, 0) 0%);
  background-position: right;
  background-size: 1px 10px;
  background-repeat: repeat-y;
}
.app-sidebar .sidebar-nav .nav-sublist > li:last-child:before {
  height: 50%;
}
.app-sidebar .sidebar-nav .nav-sublist .nav-gap {
  height: var(--space-3);
}
.app-sidebar .sidebar-nav .nav-sublist .nav-subitem {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: var(--space-4);
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-medium);
  color: rgb(var(--color-rgb-text-main)/1);
  text-decoration: none;
  padding: var(--space-3) var(--space-4);
  padding-left: calc(var(--space-4) + 14px);
  border-radius: var(--radius-xl);
  transition: color var(--motion-duration-fast) var(--motion-ease-standard), background-color var(--motion-duration-fast) var(--motion-ease-standard), border-color var(--motion-duration-fast) var(--motion-ease-standard);
}
.app-sidebar .sidebar-nav .nav-sublist .nav-subitem:hover {
  color: rgb(var(--color-rgb-secondary-accent)/1);
}
.app-sidebar .sidebar-nav .nav-sublist .nav-subitem.is-active {
  font-weight: var(--font-weight-semibold);
  color: rgb(var(--color-rgb-secondary-accent)/1);
}
.app-sidebar .sidebar-nav .nav-sublist .nav-subitem.is-active:before {
  background: rgb(var(--color-rgb-primary)/1);
}
.app-sidebar .sidebar-nav .nav-sublist .nav-subitem:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 0.8rem;
  height: 0.8rem;
  border-radius: 50%;
  background: rgb(var(--color-rgb-neutral-base-dark)/1);
  transform: translateY(-50%);
}
.app-sidebar .sidebar-nav .nav-sublist .nav-subitem sup {
  font-size: 0.6em;
  vertical-align: super;
}
.app-sidebar .sidebar-nav .nav-badge {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-bold);
  color: rgb(var(--color-rgb-text-main)/1);
  margin-left: auto;
  margin-top: 2px;
  min-width: 2rem;
  padding: 0 var(--space-3);
  border-radius: 999px;
}
.app-sidebar .sidebar-nav .nav-badge.badge--warning {
  color: rgb(var(--color-rgb-badge-warning-text)/1);
  background: rgb(var(--color-rgb-badge-warning-light)/1);
  border: 1px solid rgb(var(--color-rgb-badge-warning)/1);
}
.app-sidebar .sidebar-nav #live-chat {
  font-weight: var(--font-weight-semibold);
  color: rgb(var(--color-rgb-secondary-accent)/1);
  background: rgb(var(--color-rgb-bg-light-3)/1);
  box-shadow: none;
}
.app-sidebar .sidebar-main .sidebar-main--bottom {
  /* Card */
  /* Header */
  /* Name*/
  /* Status */
  /* Last declaration */
}
.app-sidebar .sidebar-main .sidebar-main--bottom .sidebar-user {
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
}
.app-sidebar .sidebar-main .sidebar-main--bottom .sidebar-user__card {
  background: rgb(var(--color-rgb-neutral-base)/1);
  border-radius: var(--radius-xl);
  padding: var(--space-5);
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}
.app-sidebar .sidebar-main .sidebar-main--bottom .sidebar-user__header {
  display: flex;
  gap: var(--space-4);
  align-items: center;
}
.app-sidebar .sidebar-main .sidebar-main--bottom .sidebar-user__avatar {
  width: 4.4rem;
  height: 4.4rem;
  font-size: 1.8rem;
  border-radius: calc(var(--radius-xl) - 2px);
  background: rgb(var(--color-rgb-white)/1);
  display: grid;
  place-items: center;
  color: rgb(var(--color-rgb-secondary-accent)/1);
  box-shadow: var(--shadow-md);
}
.app-sidebar .sidebar-main .sidebar-main--bottom .sidebar-user__name {
  font-weight: var(--font-weight-medium);
  font-size: var(--font-size-base);
  color: rgb(var(--color-rgb-text-main)/1);
  max-width: 13ch;
}
.app-sidebar .sidebar-main .sidebar-main--bottom .sidebar-user__info {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}
.app-sidebar .sidebar-main .sidebar-main--bottom .sidebar-user__role {
  font-size: var(--font-size-sm);
  color: rgb(var(--color-rgb-secondary-accent)/1);
}
.app-sidebar .sidebar-main .sidebar-main--bottom .sidebar-user__status {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--font-size-sm);
  color: rgb(var(--color-rgb-text-main)/1);
}
.app-sidebar .sidebar-main .sidebar-main--bottom .sidebar-user__status-dot {
  width: 0.8rem;
  height: 0.8rem;
  border-radius: 50%;
  background: rgb(var(--color-rgb-success)/1);
}
.app-sidebar .sidebar-main .sidebar-main--bottom .sidebar-user__last {
  font-size: var(--font-size-sm);
  color: rgb(var(--color-rgb-text-accent-dark)/1);
}
.app-sidebar .sidebar-main .sidebar-main--bottom .sidebar-user__last strong {
  font-weight: var(--font-weight-semibold);
}
.app-sidebar .sidebar-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  background: rgb(var(--color-rgb-white)/1);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-md);
  padding: var(--space-6) var(--space-5);
  overflow: hidden;
}
.app-sidebar .sidebar-footer .sidebar-footer-copyright {
  font-size: var(--font-size-sm);
  color: rgb(var(--color-rgb-accent-dark)/1);
}
.app-sidebar .sidebar-footer .sidebar-footer-copyright p {
  margin-bottom: 0;
}
.app-sidebar .sidebar-footer .sidebar-footer-copyright .system-version {
  font-weight: var(--font-weight-semibold);
}
.app-sidebar .sidebar-footer .sidebar-footer-copyright .copyright {
  font-size: 1rem;
}
.app-sidebar .sidebar-mobile-header {
  display: none;
}
.app-sidebar .sidebar-mobile-header #sidebarCloseMobile {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2rem;
  aspect-ratio: 1/1;
  background: rgb(var(--color-rgb-bg-light-2)/1);
  border-radius: var(--radius-full);
  border: 0;
  padding: var(--space-1);
  cursor: pointer;
}
@media (max-width: 1023px) {
  .app-sidebar .sidebar-mobile-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    padding-bottom: var(--space-4);
    border-bottom: 1px solid rgb(var(--color-rgb-border-light-2)/1);
  }
}
.app-sidebar .sidebar-main--mobileFooter {
  display: none;
  align-items: center;
  flex-direction: column;
  gap: var(--space-3);
}
.app-sidebar .sidebar-main--mobileFooter .sidebar-footer-copyright {
  font-size: var(--font-size-sm);
  color: rgb(var(--color-rgb-accent-dark)/1);
  text-align: center;
}
.app-sidebar .sidebar-main--mobileFooter .sidebar-footer-copyright p {
  margin-bottom: 0;
}
.app-sidebar .sidebar-main--mobileFooter .sidebar-footer-copyright .system-version {
  font-weight: var(--font-weight-semibold);
}
.app-sidebar .sidebar-main--mobileFooter .sidebar-footer-copyright .copyright {
  font-size: 1rem;
}

.app-sidebar-overlay {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  backdrop-filter: blur(0px);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  z-index: 100;
  cursor: pointer;
  transition: opacity 220ms cubic-bezier(0.4, 0, 0.2, 1), backdrop-filter 220ms cubic-bezier(0.4, 0, 0.2, 1), visibility 0s linear 220ms;
  display: none;
}
.app-sidebar-overlay.is-active {
  display: block;
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  backdrop-filter: blur(5px);
  transition: opacity 220ms cubic-bezier(0.4, 0, 0.2, 1), backdrop-filter 220ms cubic-bezier(0.4, 0, 0.2, 1);
}

@media (max-width: 1023px) {
  .app-sidebar {
    position: fixed;
    inset: 0 auto 0 0;
    border-top-right-radius: var(--radius-lg);
    border-bottom-right-radius: var(--radius-lg);
    background: rgb(var(--color-rgb-white)/0.7);
    backdrop-filter: blur(12px);
    box-shadow: var(--shadow-md);
    width: var(--layout-sidebar-width);
    height: 100%;
    transform: translateX(-100%) scaleX(1);
    transform-origin: left center;
    transition: width 420ms cubic-bezier(0.25, 0.8, 0.25, 1), transform 420ms cubic-bezier(0.25, 0.8, 0.25, 1), opacity 180ms ease;
    overflow: hidden;
    z-index: 2000;
    opacity: 1;
    will-change: width;
  }
  .app-sidebar .sidebar-main {
    background: transparent;
    box-shadow: none;
    border-radius: 0;
  }
  .app-sidebar .sidebar-main--mobileFooter {
    display: flex;
  }
  .app-sidebar .sidebar-footer {
    display: none;
  }
  .app-sidebar.is-open {
    transform: translateX(0);
  }
}
@media (max-width: 439px) {
  .app-sidebar {
    flex: 0 0 100%;
    width: 100%;
  }
}
.btn, .btn.dx-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.8rem;
  height: 4.5rem;
  padding-inline: var(--space-8);
  font-size: 1.4rem;
  font-weight: var(--font-weight-semibold);
  line-height: 1;
  border-radius: var(--radius-xl);
  border: none;
  background: var(--btn-bg);
  color: var(--btn-text);
  cursor: pointer;
  white-space: nowrap;
  transition: color var(--motion-duration-fast) var(--motion-ease-standard), background-color var(--motion-duration-fast) var(--motion-ease-standard), border-color var(--motion-duration-fast) var(--motion-ease-standard);
  transition: box-shadow var(--motion-duration-fast) var(--motion-ease-standard), background-color var(--motion-duration-fast) var(--motion-ease-standard);
}
.btn:hover, .btn.dx-button:hover {
  color: var(--btn-text-hover);
  background: var(--btn-bg-hover);
}
.btn:disabled, .btn.is-disabled, .btn.dx-button:disabled, .btn.dx-button.is-disabled {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}
.btn:focus, .btn.dx-button:focus {
  outline: none;
}
.btn:active, .btn.dx-button:active {
  background-color: var(--btn-bg);
}
.btn:focus-visible, .btn.dx-button:focus-visible {
  box-shadow: 0 0 0 var(--focus-ring-width) var(--focus-ring-color);
}
.btn .dx-button-mode-contained .dx-icon, .btn.dx-button .dx-button-mode-contained .dx-icon {
  color: var(--btn-text);
}
.btn .dx-icon, .btn.dx-button .dx-icon {
  margin-inline-end: 5px;
}
.btn.btn--page-title, .btn.dx-button.btn--page-title {
  font-size: 1.4rem;
  height: 4rem;
  padding-inline: var(--space-5);
}

.btn--sm, .btn.dx-button.btn--sm {
  height: 3.6rem;
  padding-inline: var(--space-6);
  font-size: 1.4rem;
  border-radius: var(--radius-lg);
  font-weight: var(--font-weight-medium);
}

.btn--md, .btn.dx-button.btn--md {
  height: 4.5rem;
  padding-inline: var(--space-8);
  font-size: 1.4rem;
  border-radius: var(--radius-xl);
  font-weight: var(--font-weight-semibold);
}

.btn--page-title, .btn.dx-button.btn--page-title {
  height: 4rem;
  padding-inline: var(--space-5);
  font-size: 1.4rem;
  border-radius: var(--radius-xl);
  font-weight: var(--font-weight-semibold);
}

.btn--primary, .btn.dx-button--primary {
  --btn-bg: rgb(var(--color-rgb-primary)/1);
  --btn-text: rgb(var(--color-rgb-white)/1);
  --btn-bg-hover: color-mix(in srgb, rgb(var(--color-rgb-primary)/1), black 15%);
}
.btn--primary .dx-icon:before, .btn.dx-button--primary .dx-icon:before {
  color: rgb(var(--color-rgb-white)/1);
}

.btn--secondary, .btn.dx-button--secondary {
  --btn-bg: rgb(var(--color-rgb-secondary)/1);
  --btn-text: rgb(var(--color-rgb-secondary)/1);
  --btn-bg-hover: color-mix(in srgb, rgb(var(--color-rgb-secondary)/1), black 15%);
}
.btn--secondary .dx-icon:before, .btn.dx-button--secondary .dx-icon:before {
  color: rgb(var(--color-rgb-secondary)/1);
}

.btn--secondary-accent, .btn.dx-button--secondary-accent {
  --btn-bg: rgb(var(--color-rgb-secondary-accent)/1);
  --btn-text: rgb(var(--color-rgb-white)/1);
  --btn-bg-hover: color-mix(in srgb, rgb(var(--color-rgb-secondary-accent)/1), black 15%);
}
.btn--secondary-accent:hover, .btn.dx-button--secondary-accent:hover {
  --btn-text-hover: rgb(var(--color-rgb-white)/1);
}
.btn--secondary-accent .dx-icon:before, .btn.dx-button--secondary-accent .dx-icon:before {
  color: rgb(var(--color-rgb-white)/1);
}

.btn--accent, .btn.dx-button--accent {
  --btn-bg: rgb(var(--color-rgb-accent)/1);
  --btn-text: rgb(var(--color-rgb-secondary-accent)/1);
  --btn-bg-hover: color-mix(in srgb, rgb(var(--color-rgb-accent)/1), black 15%);
}
.btn--accent .dx-icon:before, .btn.dx-button--accent .dx-icon:before {
  color: rgb(var(--color-rgb-secondary-accent)/1);
}

.btn--accent-light, .btn.dx-button--accent-light {
  --btn-bg: rgb(var(--color-rgb-accent-light)/1);
  --btn-text: rgb(var(--color-rgb-secondary-accent)/1);
  --btn-bg-hover: color-mix(in srgb, rgb(var(--color-rgb-accent-light)/1), black 15%);
}
.btn--accent-light:hover, .btn.dx-button--accent-light:hover {
  --btn-text-hover: rgb(var(--color-rgb-secondary-accent)/1);
}
.btn--accent-light .dx-icon:before, .btn.dx-button--accent-light .dx-icon:before {
  color: rgb(var(--color-rgb-secondary-accent)/1);
}

.btn--white, .btn.dx-button--white {
  --btn-bg: rgb(var(--color-rgb-white)/1);
  --btn-text: rgb(var(--color-rgb-text-main)/1);
  --btn-bg-hover: color-mix(in srgb, rgb(var(--color-rgb-white)/1), black 5%);
}
.btn--white .dx-icon:before, .btn.dx-button--white .dx-icon:before {
  color: rgb(var(--color-rgb-text-main)/1);
}

.btn--white-accent, .btn.dx-button--white-accent {
  --btn-bg: rgb(var(--color-rgb-white)/1);
  --btn-text: rgb(var(--color-rgb-secondary-accent)/1);
  --btn-bg-hover: color-mix(in srgb, rgb(var(--color-rgb-white)/1), black 5%);
}
.btn--white-accent .dx-icon:before, .btn.dx-button--white-accent .dx-icon:before {
  color: rgb(var(--color-rgb-secondary-accent)/1);
}

.btn--gray, .btn.dx-button--gray {
  --btn-bg: rgb(var(--color-rgb-bg-light-2)/1);
  --btn-text: rgb(var(--color-rgb-text-main)/1);
  --btn-bg-hover: rgb(var(--color-rgb-bg-light-2-hover)/1);
}
.btn--gray .dx-icon:before, .btn.dx-button--gray .dx-icon:before {
  color: rgb(var(--color-rgb-text-main)/1);
}

.btn--gray-light, .btn.dx-button--gray-light {
  --btn-bg: rgb(var(--color-rgb-neutral-base)/1);
  --btn-text: rgb(var(--color-rgb-text-main)/1);
  --btn-bg-hover: rgb(var(--color-rgb-neutral-base-dark)/1);
}
.btn--gray-light .dx-icon:before, .btn.dx-button--gray-light .dx-icon:before {
  color: rgb(var(--color-rgb-text-main)/1);
}

.btn--gray-light-accent, .btn.dx-button--gray-light-accent {
  --btn-bg: rgb(var(--color-rgb-neutral-base)/1);
  --btn-text: rgb(var(--color-rgb-secondary-accent)/1);
  --btn-bg-hover: rgb(var(--color-rgb-neutral-base-dark)/1);
}
.btn--gray-light-accent .dx-icon:before, .btn.dx-button--gray-light-accent .dx-icon:before {
  color: rgb(var(--color-rgb-secondary-accent)/1);
}

.btn--ghost, .btn.dx-button--ghost {
  --btn-bg: rgba(255, 255, 255, 0.16);
  --btn-text: rgb(var(--color-rgb-primary)/1);
  --btn-bg-hover: rgb(var(--color-rgb-primary)/0.08);
}
.btn--ghost .dx-icon:before, .btn.dx-button--ghost .dx-icon:before {
  color: rgb(var(--color-rgb-primary)/1);
}

.btn--danger, .btn.dx-button--danger {
  --btn-bg: rgb(var(--color-rgb-error)/1);
  --btn-text: rgb(var(--color-rgb-white)/1);
  --btn-bg-hover: color-mix(in srgb, rgb(var(--color-rgb-error)/1), black 5%);
}
.btn--danger:hover, .btn.dx-button--danger:hover {
  --btn-text-hover: rgb(var(--color-rgb-white)/1);
}
.btn--danger .dx-icon:before, .btn.dx-button--danger .dx-icon:before {
  color: rgb(var(--color-rgb-white)/1);
}

.btn--group {
  display: flex;
  gap: 1.2rem;
}
.btn--group.btn-group--start {
  justify-content: flex-start;
}
.btn--group.btn-group--end {
  justify-content: flex-end;
}
.btn--group.btn-group--between {
  justify-content: space-between;
}

.btn__icon {
  font-size: 2.4rem;
  padding: 0;
  display: inline-grid;
  place-items: center;
  background: transparent;
}
.btn__icon .icon {
  width: 1.8rem;
  height: 1.8rem;
  fill: currentColor;
}

.btn.is-loading {
  pointer-events: none;
}
.btn.is-loading .btn__label {
  opacity: 0;
}
.btn.is-loading .btn__spinner {
  opacity: 1;
}

.btn__spinner {
  position: absolute;
  width: 1.6rem;
  height: 1.6rem;
  border-radius: 50%;
  border: 2px solid currentColor;
  border-right-color: transparent;
  animation: btn-spin 0.6s linear infinite;
  opacity: 0;
}

@keyframes btn-spin {
  to {
    transform: rotate(360deg);
  }
}
.btn--logout {
  width: 100%;
  display: flex;
  border: 2px solid rgb(var(--color-rgb-danger)/0.3);
  background: transparent;
  font-weight: var(--font-weight-semibold);
  color: rgb(var(--color-rgb-danger)/1);
  box-shadow: none;
  cursor: pointer;
  transition: box-shadow var(--motion-duration-fast) var(--motion-ease-standard), background-color var(--motion-duration-fast) var(--motion-ease-standard);
}
.btn--logout:hover {
  color: rgb(var(--color-rgb-danger)/1);
  background: rgb(var(--color-rgb-danger)/0.04);
}

.dx-button.btn.btn-upload-results {
  color: rgb(var(--color-rgb-secondary-accent)/1);
  padding-inline: var(--space-4);
}
.dx-button.btn.btn-upload-results .icon {
  padding-right: var(--space-2);
}

form.page-content__form {
  padding-bottom: 0;
}
form .form-group label,
form .form-field label {
  display: inline-block;
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-regular);
  color: var(--color-text-accent-dark);
  padding-bottom: var(--space-3);
}
form .form-group label.label--bold,
form .form-field label.label--bold {
  font-weight: var(--font-weight-bold);
}
form .form-field--danger label {
  color: rgb(var(--color-rgb-danger)/1);
}
form .data-sections-group {
  padding-left: 5rem;
}
form .data-sections-group .data-section {
  position: relative;
}
form .data-sections-group .data-section:before, form .data-sections-group .data-section:after {
  content: "";
  position: absolute;
  z-index: -1;
}
form .data-sections-group .data-section:not(:first-child):not(:last-child):before {
  left: -4.5rem;
  top: calc(3.45rem - 1px);
  width: 5rem;
  height: 2px;
  border-top: 2px dashed var(--color-border-dark);
}
form .data-sections-group .data-section:not(:last-child):after {
  top: 0;
  left: -4.5rem;
  width: 2px;
  height: calc(100% + var(--space-6));
  border-left: 2px dashed var(--color-border-dark);
}
form .data-sections-group .data-section:last-child:after {
  top: 0;
  left: -4.5rem;
  height: 1.5rem;
  border-left: 2px dashed var(--color-border-dark);
}
form .data-sections-group .data-section:first-child:after {
  top: calc(5.45rem + 3px);
  height: calc(100% - 2rem - var(--space-6) + 2px);
}
form .data-sections-group .data-section:first-child:before {
  top: calc(3.45rem - 1px);
  left: -4.5rem;
  width: 5rem;
  height: 2rem;
  border-top: 2px dashed var(--color-border-dark);
  border-left: 2px dashed var(--color-border-dark);
  border-top-left-radius: 20px;
}
form .data-sections-group .data-section:last-child:before {
  top: calc(2rem - 3px);
  left: -4.5rem;
  width: 5rem;
  height: 2rem;
  border-bottom: 2px dashed var(--color-border-dark);
  border-left: 2px dashed var(--color-border-dark);
  border-bottom-left-radius: 20px;
}
form .ec-form__actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  margin-top: var(--space-7);
  /* Left meta area */
  /* Right buttons group */
}
@media (max-width: 767px) {
  form .ec-form__actions {
    flex-direction: column;
    align-items: stretch;
  }
}
form .ec-form__actions .ec-form__actions-left {
  font-size: var(--font-size-sm);
  color: rgb(var(--color-rgb-text-muted)/1);
}
@media (max-width: 767px) {
  form .ec-form__actions .ec-form__actions-left {
    order: 2;
    text-align: center;
  }
}
form .ec-form__actions .ec-form__actions-right {
  display: flex;
  gap: var(--space-4);
}
@media (max-width: 767px) {
  form .ec-form__actions .ec-form__actions-right {
    order: 1;
    width: 100%;
  }
  form .ec-form__actions .ec-form__actions-right .btn {
    flex: 1;
  }
}

/* =========================================================
   DEVEXTREME - RADIOGROUP 
========================================================= */
.ec-radio-group {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-7);
  /* Hide default icon border */
  /* Inner dot */
  /* Checked state */
  /* Hover */
  /* Focus */
  /* Label */
  /* Disabled */
}
.ec-radio-group .dx-collection {
  row-gap: var(--space-4);
}
.ec-radio-group .dx-item {
  flex: 0 0 min(22rem, 100%);
  display: flex;
  align-items: center;
  gap: var(--space-3);
  cursor: pointer;
}
.ec-radio-group.--w-auto .dx-collection .dx-item {
  flex: 0 0 min(8rem, 100%);
}
.ec-radio-group .dx-radiobutton-icon {
  position: relative;
  width: 2.4rem;
  height: 2.4rem;
  border-radius: 50%;
  border: 2px solid rgb(var(--color-rgb-border-dark)/1);
  background: rgb(var(--color-rgb-neutral-base)/1);
  transition: all 180ms ease;
}
.ec-radio-group .dx-radiobutton-icon::after {
  content: "";
  position: absolute;
  inset: 0;
  margin: auto;
  width: 1rem;
  height: 1rem;
  border-radius: 50%;
  background: rgb(var(--color-rgb-bg-accent-light)/1);
  transform: scale(0);
  transition: transform var(--motion-duration-fast) var(--motion-ease-standard);
}
.ec-radio-group .dx-radio-value-container {
  padding-inline-end: 0;
}
.ec-radio-group .dx-radiobutton-checked .dx-item-content {
  color: rgb(var(--color-rgb-secondary)/1);
}
.ec-radio-group .dx-radiobutton-icon-checked .dx-radiobutton-icon-dot {
  background: rgb(var(--color-rgb-secondary-accent)/1);
}
.ec-radio-group .dx-radiobutton-icon.dx-radiobutton-icon-checked {
  background: rgb(var(--color-rgb-secondary-accent)/1);
}
.ec-radio-group .dx-radiobutton-icon.dx-radiobutton-icon-checked .dx-radiobutton-icon-dot {
  border-color: rgb(var(--color-rgb-secondary-accent)/1);
}
.ec-radio-group .dx-radiobutton-checked .dx-radiobutton-icon::after {
  transform: scale(1);
}
.ec-radio-group .dx-radiobutton.dx-state-focused .dx-radiobutton-icon {
  border-color: rgb(var(--color-rgb-border-dark)/1);
}
.ec-radio-group .dx-item:hover .dx-radiobutton-icon {
  border-color: rgb(var(--color-rgb-border-darker)/1);
}
.ec-radio-group .dx-item-content {
  font-size: var(--font-size-base);
  color: var(--color-text-main);
}
.ec-radio-group .dx-state-disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

/* =========================================================
   DEVEXTREME - SELECT BOX
========================================================= */
.dx-selectbox.dx-widget.dx-texteditor {
  transition: box-shadow var(--motion-duration-fast) var(--motion-ease-standard), background-color var(--motion-duration-fast) var(--motion-ease-standard);
  border-radius: var(--radius-lg);
}

.dx-dropdowneditor-button.dx-state-active .dx-dropdowneditor-icon,
.dx-dropdowneditor.dx-state-hover:not(.dx-custom-button-hovered) .dx-dropdowneditor-icon {
  background-color: transparent !important;
}

.dx-dropdowneditor-button.dx-state-active .dx-dropdowneditor-icon,
.dx-dropdowneditor.dx-dropdowneditor-active .dx-dropdowneditor-icon {
  background-color: transparent !important;
}

.dx-selectbox-popup-wrapper .dx-overlay-content.dx-popup-normal {
  top: 0.5rem;
  border-radius: var(--radius-lg);
  border: 0;
  box-shadow: var(--shadow-lg);
  padding: var(--space-3);
}
.dx-selectbox-popup-wrapper .dx-overlay-content.dx-popup-normal:before {
  content: "";
  position: absolute;
  inset-inline: 0;
  top: -0.5rem;
  height: 0.5rem;
  width: 100%;
}
.dx-selectbox-popup-wrapper .dx-overlay-content.dx-popup-normal .dx-dropdowneditor-button.dx-state-active .dx-dropdowneditor-icon,
.dx-selectbox-popup-wrapper .dx-overlay-content.dx-popup-normal .dx-dropdowneditor.dx-dropdowneditor-active .dx-dropdowneditor-icon {
  background: transparent;
}
.dx-selectbox-popup-wrapper .dx-overlay-content.dx-popup-normal .dx-list-items .dx-list-item {
  border-radius: var(--radius-md);
  padding: var(--space-2) var(--space-2);
  transition: color var(--motion-duration-fast) var(--motion-ease-standard), background-color var(--motion-duration-fast) var(--motion-ease-standard), border-color var(--motion-duration-fast) var(--motion-ease-standard);
}
.dx-selectbox-popup-wrapper .dx-overlay-content.dx-popup-normal .dx-list-items .dx-list-item:not(:first-child) {
  margin-top: var(--space-2);
}
.dx-selectbox-popup-wrapper .dx-overlay-content.dx-popup-normal .dx-list-items .dx-list-item.dx-state-hover {
  background: rgb(var(--color-rgb-bg-light-2)/1);
}
.dx-selectbox-popup-wrapper .dx-overlay-content.dx-popup-normal .dx-list-items .dx-list-item.dx-list-item-selected {
  color: rgb(var(--color-rgb-secondary-accent)/1);
  background: rgb(var(--color-rgb-bg-light-3)/1);
}
.dx-selectbox-popup-wrapper .dx-overlay-content.dx-popup-normal .dx-list-items .dx-list-item.dx-list-item-selected.dx-state-hover {
  background: rgb(var(--color-rgb-bg-light-2)/1);
}

.dx-selectbox.dx-dropdowneditor.dx-state-hover:not(.dx-custom-button-hovered) .dx-dropdowneditor-icon {
  background: transparent;
}

.ec-select {
  position: relative;
  display: flex;
  align-items: center;
  gap: var(--space-3);
  border-radius: var(--radius-xl);
  background: rgb(var(--color-rgb-white)/1);
  box-shadow: var(--shadow-md);
  transition: box-shadow var(--motion-duration-fast) var(--motion-ease-standard), background-color var(--motion-duration-fast) var(--motion-ease-standard);
}
.ec-select .hidden {
  display: none;
}
.ec-select:hover {
  box-shadow: var(--shadow-md-hover);
}
.ec-select__icon {
  aspect-ratio: 1/1;
  width: 4rem;
  height: 4rem;
  display: grid;
  place-items: center;
  border-radius: var(--radius-lg);
  background: rgb(var(--color-rgb-neutral-base)/1);
}
.ec-select__icon img {
  width: 2.25rem;
  height: 2.25rem;
}
.ec-select__control {
  flex: 1;
}
.ec-select__control .ec-select__editor {
  height: var(--select-height-lg);
  border-radius: var(--radius-lg);
  padding-left: 0.5rem;
}
.ec-select__control .ec-select__editor.--withIcon {
  padding-left: 0;
}
.ec-select__control .dx-texteditor.dx-editor-outlined {
  border: 0;
}
.ec-select__control input.dx-texteditor-input {
  color: rgb(var(--color-rgb-secondary-accent)/1);
}
.ec-select__control .ec-select__field {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-3);
}
.ec-select .dx-dropdowneditor-icon::before {
  content: "\e808";
  font-family: "eody-icons";
  font-size: 1.1rem;
}
.ec-select .dx-texteditor-container {
  border: none !important;
  background: transparent !important;
}
.ec-select .dx-texteditor {
  border: none !important;
  background: transparent !important;
}
.ec-select .dx-texteditor-input {
  padding: 0.9rem 1.25rem !important;
}
.ec-select .ec-tooltip {
  position: absolute;
  top: 0;
  right: -3.5rem;
}
.ec-select.ec-select--weeklyReport .dx-list-items .dx-list-item {
  text-align: center;
}
.ec-select.ec-select--weeklyReport .ec-select__value {
  color: rgb(var(--color-rgb-secondary-accent)/1);
  width: 100%;
  text-align: center;
  padding-left: var(--space-5);
}
.ec-select.ec-select--weeklyReport .ec-select__value-title {
  font-weight: var(--font-weight-semibold);
}
.ec-select.ec-select--weeklyReport .ec-select__value-range {
  font-size: var(--font-size-sm);
  color: rgb(var(--color-rgb-text-accent-dark)/1);
  padding-top: 0.2rem;
}
.ec-select.ec-select--submissionMethod .ec-select__field .dx-texteditor-container .dx-texteditor-input-container input.dx-texteditor-input {
  color: rgb(var(--color-rgb-secondary-accent)/1);
}

/* =========================================
   BASE INPUT
========================================= */
.dx-widget:not(.dx-selectbox) {
  /* Hover */
  /* Focus */
  /* =========================================
     ---- DISABLED
  ========================================= */
  /* =========================================
     ---- READONLY
  ========================================= */
  /* =========================================
     ---- ERROR STATE
  ========================================= */
}
.dx-widget:not(.dx-selectbox) .form-control, .dx-widget:not(.dx-selectbox).dx-texteditor.dx-editor-outlined {
  border-radius: var(--radius-lg);
  border: 0;
  background: transparent;
  box-shadow: none;
  outline: none;
}
.dx-widget:not(.dx-selectbox) .form-control .dx-texteditor-container, .dx-widget:not(.dx-selectbox).dx-texteditor.dx-editor-outlined .dx-texteditor-container {
  border: 2px solid rgb(var(--color-rgb-border-accent)/1);
  border-radius: var(--radius-lg);
  transition: color var(--motion-duration-fast) var(--motion-ease-standard), background-color var(--motion-duration-fast) var(--motion-ease-standard), border-color var(--motion-duration-fast) var(--motion-ease-standard);
}
.dx-widget:not(.dx-selectbox) .form-control .dx-texteditor-container .dx-texteditor-input, .dx-widget:not(.dx-selectbox).dx-texteditor.dx-editor-outlined .dx-texteditor-container .dx-texteditor-input {
  font-size: var(--font-size-base);
  color: rgb(var(--color-rgb-text-main)/1);
  background: transparent;
  box-shadow: none;
  outline: none;
  min-height: unset;
  border: 0;
  border-radius: calc(var(--radius-lg) - 2px);
  padding: 1.2rem 1.5rem;
  margin: 0;
}
.dx-widget:not(.dx-selectbox) .form-control .dx-placeholder, .dx-widget:not(.dx-selectbox).dx-texteditor.dx-editor-outlined .dx-placeholder {
  color: rgb(var(--color-rgb-text-placeholder)/1);
  padding-inline: 0.75rem;
}
.dx-widget:not(.dx-selectbox) .form-control.dx-searchbox .dx-texteditor-input, .dx-widget:not(.dx-selectbox).dx-texteditor.dx-editor-outlined.dx-searchbox .dx-texteditor-input {
  padding-inline-start: 3.5rem;
}
.dx-widget:not(.dx-selectbox) .form-control:hover, .dx-widget:not(.dx-selectbox).dx-texteditor.dx-editor-outlined:hover .dx-texteditor-container {
  border-color: rgb(var(--color-rgb-border-darker)/1);
}
.dx-widget:not(.dx-selectbox).dx-texteditor.dx-editor-outlined.dx-state-focused .dx-texteditor-container {
  border-color: rgb(var(--color-rgb-border-darker)/1);
}
.dx-widget:not(.dx-selectbox) .form-control:focus .dx-texteditor-container, .dx-widget:not(.dx-selectbox).dx-texteditor.dx-state-focused .dx-texteditor-container {
  border-color: rgb(var(--color-rgb-border-darker)/1);
}
.dx-widget:not(.dx-selectbox) .form-control:disabled .dx-texteditor-container, .dx-widget:not(.dx-selectbox).dx-texteditor.dx-state-disabled .dx-texteditor-container {
  background: rgb(var(--color-rgb-bg-disabled)/1);
  border-color: rgb(var(--color-rgb-border-light)/1);
  box-shadow: none;
  cursor: not-allowed;
}
.dx-widget:not(.dx-selectbox) .form-control[readonly] .dx-texteditor-container, .dx-widget:not(.dx-selectbox).dx-texteditor.dx-state-readonly .dx-texteditor-container {
  background: rgb(var(--color-rgb-bg-light-2)/1);
  border-color: rgb(var(--color-rgb-border-dark)/1);
  box-shadow: none;
}
.dx-widget:not(.dx-selectbox) .form-control.is-error .dx-texteditor-container, .dx-widget:not(.dx-selectbox).dx-texteditor.is-error .dx-texteditor-container {
  border-color: rgb(var(--color-rgb-error)/1);
  box-shadow: 0 0 0 3px rgb(var(--color-rgb-error)/0.15);
}
.dx-widget:not(.dx-selectbox).transp-field.dx-texteditor.dx-editor-outlined .dx-texteditor-container {
  border: 0;
}
.dx-widget:not(.dx-selectbox).transp-field.dx-texteditor.dx-editor-outlined .dx-texteditor-container input {
  padding-left: 0;
}

/* =========================================
   DATEBOX
========================================= */
.dx-datebox .dx-button {
  color: rgb(var(--color-rgb-text-muted)/1);
  border-radius: calc(var(--radius-lg) + 0.3rem);
  transition: color var(--motion-duration-fast) var(--motion-ease-standard), background-color var(--motion-duration-fast) var(--motion-ease-standard), border-color var(--motion-duration-fast) var(--motion-ease-standard);
}
.dx-datebox .dx-button:hover {
  color: rgb(var(--color-rgb-primary)/1);
}
.dx-datebox .dx-texteditor-buttons-container .dx-dropdowneditor-button {
  min-width: 5rem;
}
.dx-datebox .dx-texteditor-buttons-container .dx-dropdowneditor-icon {
  width: 100%;
}
.dx-datebox .dx-texteditor-buttons-container .dx-dropdowneditor-icon:before {
  content: "\e802";
  font-family: "eody-icons";
  font-size: 2.2rem;
  color: rgb(var(--color-rgb-input-icon-color)/1);
  margin-left: -1.1rem;
}

/* =========================================
   SELECTBOX
========================================= */
.dx-widget.dx-selectbox {
  border: 0;
  background: transparent;
  box-shadow: none;
  outline: none;
  /* =========================================
     ---- DISABLED
  ========================================= */
  /* =========================================
     ---- READONLY
  ========================================= */
}
.dx-widget.dx-selectbox .form-control, .dx-widget.dx-selectbox.dx-texteditor.dx-editor-outlined {
  border-radius: var(--radius-lg);
  border: 0;
  background: transparent;
  box-shadow: none;
  outline: none;
}
.dx-widget.dx-selectbox .form-control .dx-texteditor-container, .dx-widget.dx-selectbox.dx-texteditor.dx-editor-outlined .dx-texteditor-container {
  border: 2px solid rgb(var(--color-rgb-border-accent)/1);
  border-radius: var(--radius-lg);
  transition: color var(--motion-duration-fast) var(--motion-ease-standard), background-color var(--motion-duration-fast) var(--motion-ease-standard), border-color var(--motion-duration-fast) var(--motion-ease-standard);
}
.dx-widget.dx-selectbox .form-control .dx-texteditor-container .dx-texteditor-input, .dx-widget.dx-selectbox.dx-texteditor.dx-editor-outlined .dx-texteditor-container .dx-texteditor-input {
  font-size: var(--font-size-base);
  color: rgb(var(--color-rgb-text-main)/1);
  background: transparent;
  box-shadow: none;
  outline: none;
  min-height: unset;
  border: 0;
  border-radius: calc(var(--radius-lg) - 2px);
  padding: 1.2rem 1.5rem;
  margin: 0;
}
.dx-widget.dx-selectbox .form-control .dx-placeholder, .dx-widget.dx-selectbox.dx-texteditor.dx-editor-outlined .dx-placeholder {
  color: rgb(var(--color-rgb-text-placeholder)/1);
  padding-inline: 0.75rem;
}
.dx-widget.dx-selectbox .form-control.dx-searchbox .dx-texteditor-input, .dx-widget.dx-selectbox.dx-texteditor.dx-editor-outlined.dx-searchbox .dx-texteditor-input {
  padding-inline-start: 3.5rem;
}
.dx-widget.dx-selectbox .dx-dropdowneditor-icon:before {
  content: "\e808";
  font-family: "eody-icons";
  font-size: 1.2rem;
}
.dx-widget.dx-selectbox .dx-texteditor-container {
  border: 2px solid rgb(var(--color-rgb-border-accent)/1);
  border-radius: var(--radius-lg);
  transition: color var(--motion-duration-fast) var(--motion-ease-standard), background-color var(--motion-duration-fast) var(--motion-ease-standard), border-color var(--motion-duration-fast) var(--motion-ease-standard);
}
.dx-widget.dx-selectbox .form-control:hover, .dx-widget.dx-selectbox.dx-texteditor.dx-editor-outlined:hover .dx-texteditor-container {
  border-color: rgb(var(--color-rgb-border-darker)/1);
}
.dx-widget.dx-selectbox.dx-texteditor.dx-editor-outlined.dx-state-focused .dx-texteditor-container {
  border-color: rgb(var(--color-rgb-border-darker)/1);
}
.dx-widget.dx-selectbox .form-control:disabled .dx-texteditor-container, .dx-widget.dx-selectbox.dx-texteditor.dx-state-disabled .dx-texteditor-container {
  background: rgb(var(--color-rgb-bg-disabled)/1);
  border-color: rgb(var(--color-rgb-border-light)/1);
  box-shadow: none;
  cursor: not-allowed;
}
.dx-widget.dx-selectbox .form-control[readonly] .dx-texteditor-container, .dx-widget.dx-selectbox.dx-texteditor.dx-state-readonly .dx-texteditor-container {
  background: rgb(var(--color-rgb-bg-light-2)/1);
  border-color: rgb(var(--color-rgb-border-dark)/1);
  box-shadow: none;
}

.ec-tooltip {
  width: 2.6rem;
  height: 2.6rem;
  font-size: var(--font-size-lg);
  display: grid;
  place-items: center;
  background: rgb(var(--color-rgb-white)/1);
  border: 1px solid rgb(var(--color-rgb-border-light)/1);
  border-radius: 50%;
  box-shadow: var(--shadow-md);
  padding: 3px;
  cursor: pointer;
  transition: color var(--motion-duration-fast) var(--motion-ease-standard), background-color var(--motion-duration-fast) var(--motion-ease-standard), border-color var(--motion-duration-fast) var(--motion-ease-standard);
}
.ec-tooltip:hover {
  border-color: rgb(var(--color-rgb-border-dark)/1);
}

.status-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: var(--space-2) var(--space-4);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-bold);
  letter-spacing: 0.02em;
  border-radius: var(--radius-md);
  color: rgb(var(--color-rgb-white)/1);
  white-space: nowrap;
  line-height: 1;
  min-width: 8.5rem;
}

/* SUCCESS */
.status-pill--success {
  background-color: rgb(var(--color-rgb-success)/1);
}

/* ERROR */
.status-pill--error {
  background-color: rgb(var(--color-rgb-error)/1);
}

.ec-tabs__nav {
  display: flex;
  gap: var(--space-7);
  border: 1px solid rgb(var(--color-rgb-bg-light-2)/1);
  padding-bottom: var(--space-3);
}
.ec-tabs__nav.--withBg {
  background: rgb(var(--color-rgb-neutral-base)/1);
  padding: var(--space-3) var(--space-3);
  border-radius: var(--radius-xl);
}
.ec-tabs__tab {
  position: relative;
  padding: 0.85rem calc(2.5rem + 1vw);
  border-radius: var(--radius-lg);
  background: transparent;
  color: rgb(var(--color-rgb-text-heading)/1);
  font-weight: var(--font-weight-semibold);
  letter-spacing: 0.02em;
  text-transform: uppercase;
  cursor: pointer;
  border: 0;
  transition: all 0.2s ease;
}
.ec-tabs__tab:hover {
  background: rgb(var(--color-rgb-bg-light-2)/1);
  color: rgb(var(--color-rgb-text-main)/1);
  box-shadow: var(--shadow-sm);
}
.ec-tabs__tab:before {
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: calc(-1 * var(--space-7) / 2);
  width: 1px;
  height: 2.25rem;
  background: rgb(var(--color-rgb-border-dark)/1);
}
.ec-tabs__tab:last-child:before {
  display: none;
}
.ec-tabs__tab.is-active {
  color: rgb(var(--color-rgb-secondary-accent)/1);
  font-weight: var(--font-weight-semibold);
  background-color: rgb(var(--color-rgb-white)/1);
  box-shadow: var(--shadow-md);
}
.ec-tabs__content {
  padding-top: var(--space-7);
}
.ec-tabs__pane {
  display: none;
}
.ec-tabs__pane.is-active {
  display: block;
  animation: fadeIn 0.2s ease;
}
.ec-tabs__pane .ec-tab__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: var(--space-5);
}
.ec-tabs__pane .ec-tab__header .ec-tab--title {
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-semibold);
  color: rgb(var(--color-rgb-text-heading)/1);
  letter-spacing: -0.005em;
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(4px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.divider {
  flex-shrink: 0;
  background: rgb(var(--color-rgb-border-dark)/1);
}

/* horizontal divider */
.divider--horizontal {
  width: 100%;
  height: 1px;
}

/* vertical divider */
.divider--vertical {
  width: 1px;
  align-self: stretch;
}

.divider--thin {
  height: 1px;
}

.divider--medium {
  height: 2px;
}

.divider--thick {
  height: 3px;
}

.divider--light {
  background: rgb(var(--color-rgb-border-light)/1);
}

.divider--soft {
  background: rgb(var(--color-rgb-border-dark)/1);
}

.divider--strong {
  background: rgb(var(--color-rgb-border-darker)/1);
}

.divider--space-sm {
  margin: var(--space-3) 0;
}

.divider--space-md {
  margin: var(--space-6) 0;
}

.divider--space-lg {
  margin: var(--space-8) 0;
}

.divider--vspace-sm {
  margin: 0 8px;
}

.divider--vspace-md {
  margin: 0 16px;
}

.divider--vspace-lg {
  margin: 0 24px;
}

.page-wrapper {
  width: 100%;
  height: 100%;
}
.page-wrapper.--is-centered .page-content {
  max-width: var(--layout-boxed-width);
  margin-inline: auto;
}
.page-wrapper.--scrollable {
  overflow-x: hidden;
  overflow-y: auto;
}

.page-content {
  height: 100%;
  padding: var(--space-6);
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
}
.page-content.--has-footer {
  padding-bottom: var(--space-4);
}

.page-content .page-content__form {
  height: 100%;
}
.page-content .page-content__form ::-webkit-scrollbar-track {
  background-color: rgb(var(--color-rgb-secondary)/0.1);
  border-radius: 10px;
}
.page-content .page-content__form ::-webkit-scrollbar {
  height: 4px;
  width: 4px;
  background-color: rgb(var(--color-rgb-secondary)/0.1);
  border-radius: 10px;
}
.page-content .page-content__form ::-webkit-scrollbar-thumb {
  background-color: rgb(var(--color-rgb-accent-dark)/0.5);
  border-radius: 10px;
}

.page-content__title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  /* LEFT */
  /* RIGHT */
}
.page-content__title .page-title__start {
  display: flex;
  gap: var(--space-5);
  min-width: 0;
}
.page-content__title .page-title__icon {
  width: 4rem;
  height: 4rem;
  display: inline-grid;
  place-items: center;
  border-radius: var(--radius-lg);
  background: rgb(var(--color-rgb-white)/1);
  box-shadow: var(--shadow-md);
}
.page-content__title .page-title__icon .icon {
  width: 1.8rem;
  height: 1.8rem;
  fill: currentColor;
}
.page-content__title .page-title__icon img {
  display: block;
  width: 100%;
  max-height: 2rem;
}
.page-content__title .page-title__content {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.page-content__title .page-title__content .page-title__text {
  font-size: var(--font-size-page-title);
  font-weight: var(--font-weight-semibold);
  letter-spacing: calc(-1 * (0.025rem + 0.015vw));
  line-height: 1.6;
  color: rgb(var(--color-rgb-text-heading)/1);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-bottom: 0;
}
.page-content__title .page-title__content h5 {
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-medium);
  color: rgb(var(--color-rgb-text-accent-dark)/1);
}
.page-content__title .page-title__end {
  display: flex;
  align-items: center;
  gap: var(--space-3);
}

.page-content__body {
  height: calc(100% - var(--page-title-height) - var(--space-6) / 2);
  overflow-x: hidden;
  overflow-y: auto;
  padding-right: calc(var(--scrollbar-size) * 1.5);
  padding-bottom: 0.75rem;
}
.page-content__body ::-webkit-scrollbar-track {
  background-color: rgb(var(--color-rgb-secondary)/0.1);
  border-radius: 10px;
}
.page-content__body ::-webkit-scrollbar {
  height: 4px;
  width: 4px;
  background-color: rgb(var(--color-rgb-secondary)/0.1);
  border-radius: 10px;
}
.page-content__body ::-webkit-scrollbar-thumb {
  background-color: rgb(var(--color-rgb-accent-dark)/0.5);
  border-radius: 10px;
}

.page-content.--has-footer .page-content__body {
  height: calc(100% - var(--page-title-height) - var(--page-footer-height) - var(--space-6) / 2);
}

.page-content__footer {
  height: var(--page-footer-height);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
}
.page-content__footer .page-footer-bar__meta {
  font-size: var(--font-size-sm);
  color: rgb(var(--color-rgb-text-accent-dark)/1);
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
}
.page-content__footer .page-footer-bar__value {
  font-weight: 600;
}

.data-section {
  background: var(--color-white);
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-md);
  display: flex;
  flex-direction: column;
}
.data-section.--full-height {
  height: 100%;
}
.data-section.--text {
  max-width: calc(900px + 5vw);
}
.data-section .data-section__header {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-5);
  padding: var(--space-5) var(--space-7);
  border-bottom: 2px solid var(--color-border-accent-light);
}
.data-section .data-section__header .data-section-title {
  position: relative;
  font-size: 1.8rem;
  font-weight: var(--font-weight-medium);
}
.data-section .data-section__header .data-section-title:before {
  content: "";
  position: absolute;
  top: 50%;
  left: calc(-1 * var(--space-7));
  transform: translateY(-50%);
  width: 0.35rem;
  height: 120%;
  border-top-right-radius: var(--radius-xl);
  border-bottom-right-radius: var(--radius-xl);
  background: var(--color-primary);
}
.data-section .data-section__body {
  height: 100%;
  padding-block: var(--space-7) var(--space-8);
  padding-inline: var(--space-7);
  overflow-y: auto;
  overflow-x: hidden;
}
.data-section .datagrid-wrapper {
  height: 100%;
}
.data-section .data-section__actions .dx-button {
  box-shadow: none;
}

.data-section + .data-section {
  margin-top: var(--space-6);
}

.info-pill {
  display: flex;
  align-items: center;
  gap: var(--space-6);
  padding: var(--space-6) var(--space-6);
  border-radius: var(--radius-xl);
  background: rgb(var(--color-rgb-bg-light-2)/1);
}
.info-pill__item {
  display: flex;
  flex-direction: column;
}
.info-pill__label {
  color: rgb(var(--color-rgb-text-accent-dark)/1);
  margin-bottom: var(--space-1);
}
.info-pill__value {
  font-weight: var(--font-weight-medium);
  color: var(--color-text);
}
.info-pill__divider {
  width: 1px;
  align-self: stretch;
  background: rgb(var(--color-rgb-border-dark)/1);
}

.filters-bar {
  display: flex;
  gap: var(--space-6);
  margin-bottom: var(--space-7);
  flex-wrap: wrap;
}
.filters-bar.cols-2 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(auto, 30rem));
  gap: var(--space-6);
}
.filters-bar.cols-3 {
  display: grid;
  grid-template-columns: repeat(3, minmax(auto, 30rem));
  gap: var(--space-6);
}
.filters-bar .filter-item {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  min-width: 28rem;
}
.filters-bar .filter-label {
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-medium);
  color: rgb(var(--color-rgb-text-accent-dark)/1);
}
.filters-bar .ec-input {
  position: relative;
  display: flex;
  align-items: center;
  gap: var(--space-3);
  border-radius: var(--radius-xl);
  background: rgb(var(--color-rgb-white)/1);
  box-shadow: var(--shadow-md);
  transition: box-shadow var(--motion-duration-fast) var(--motion-ease-standard), background-color var(--motion-duration-fast) var(--motion-ease-standard);
}
.filters-bar .ec-input .dx-widget:not(.dx-selectbox).dx-texteditor.dx-editor-outlined .dx-texteditor-container {
  height: var(--input-height-lg);
  border: 0;
}

.disease-matrix {
  width: 100%;
  padding-block: var(--space-3) var(--space-4);
  overflow-x: auto;
  overflow-y: hidden;
}
.disease-matrix .disease-matrix__inner {
  min-width: 85rem;
}
.disease-matrix .matrix-header,
.disease-matrix .matrix-row {
  display: grid;
  grid-template-columns: 1.3fr repeat(7, 1fr) 1fr;
  gap: var(--space-5);
  align-items: center;
}
.disease-matrix .matrix-header {
  margin-bottom: var(--space-4);
}
.disease-matrix .matrix-header .matrix-cell {
  font-weight: var(--font-weight-medium);
  color: var(--color-accent-dark);
  text-align: center;
}
.disease-matrix .matrix-header .matrix-cell--total {
  font-weight: var(--font-weight-bold);
  text-align: right;
  padding-right: var(--space-5);
}
.disease-matrix .matrix-row {
  padding-block: var(--space-3);
}
.disease-matrix .matrix-row .matrix-cell input {
  font-size: var(--font-size-lg);
  color: rgb(var(--color-rgb-text-accent-dark)/1);
  text-align: center;
  border-radius: var(--radius-xl);
}
.disease-matrix .matrix-row .matrix-cell--age {
  font-size: clamp(1.8rem, 1.2rem + 3vw, 2.4rem);
  font-weight: var(--font-weight-regular);
  color: var(--color-secondary-accent);
  text-align: center;
}
.disease-matrix .matrix-row .matrix-cell--total input {
  color: rgb(var(--color-rgb-text-secondary)/1);
  font-weight: var(--font-weight-bold);
  text-align: right;
}
.disease-matrix .matrix-cell .dx-numberbox {
  width: 100%;
}

.matrix-footer {
  margin-top: var(--space-5);
  padding-top: var(--space-6);
  border-top: 1px solid rgb(var(--color-rgb-border-light)/1);
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: var(--space-4);
}
.matrix-footer-totals--label {
  color: rgb(var(--color-rgb-secondary)/1);
  font-weight: var(--font-weight-bold);
}
.matrix-footer-totals--value {
  min-width: 10rem;
  max-width: fit-content;
  width: fit-content;
}
.matrix-footer-totals--value .dx-numberbox.dx-texteditor {
  width: auto !important;
  min-width: 6rem;
  border: 0;
}
.matrix-footer-totals--value .dx-numberbox.dx-texteditor .dx-texteditor-container {
  width: max-content;
  min-width: 10rem;
}
.matrix-footer-totals--value .dx-numberbox.dx-texteditor .dx-texteditor-input {
  text-align: right;
}

@media (max-width: 1023px) {
  .matrix-header,
  .matrix-row {
    grid-template-columns: 12rem repeat(7, minmax(8rem, 1fr)) 10rem;
  }
}
@media (max-width: 767px) {
  .matrix-cell--age {
    font-size: var(--font-size-lg);
  }
  .matrix-header .matrix-cell {
    font-size: var(--font-size-xs);
  }
}
td.dx-command-edit-with-icons .action.action--isLocked:before {
  display: none;
}

.action.--lockType2 {
  background-color: rgb(var(--color-rgb-bg-accent-light)/1);
}
.action.--lockType2 .dx-icon:before {
  font-family: "eody-icons";
}
.action.--lockType2 .dx-icon-lock:before {
  content: "\e82f";
  font-size: 1.6rem;
  color: rgb(var(--color-rgb-text-secondary)/1);
}
.action.--lockType2 .dx-icon-unlock:before {
  content: "\f13e";
  font-size: 1.6rem;
  color: rgb(var(--color-rgb-text-accent)/1);
}

.ec-upload {
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
  max-width: 800px;
}
.ec-upload__label {
  font-weight: var(--font-weight-semibold);
}
.ec-upload__dropzone {
  position: relative;
  padding: calc(2rem + 2.5vw) 2.5rem calc(3rem + 2.5vw) 2.5rem;
  border: 2px dashed rgb(var(--color-rgb-border-dark)/1);
  border-radius: var(--radius-xl);
  background: rgb(var(--color-rgb-bg-light)/1);
  text-align: center;
  transition: 0.2s ease;
}
.ec-upload__dropzone:hover {
  border-color: rgb(var(--color-rgb-secondary-accent)/1);
}
.ec-upload__dropzone.is-dragover {
  border-color: rgb(var(--color-rgb-primary)/1);
  background: rgb(var(--color-rgb-primary-accent-light)/1);
}
.ec-upload__overlay {
  position: absolute;
  inset: 0;
  cursor: pointer;
  z-index: 1;
}
.ec-upload__input {
  display: none;
}
.ec-upload__placeholder {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  align-items: center;
  z-index: 2;
}
.ec-upload__placeholder .icon {
  font-size: 4.2rem;
  color: rgb(var(--color-rgb-input-icon-color)/1);
}
.ec-upload__placeholder .ec-upload__text {
  color: rgb(var(--color-rgb-text-secondary)/1);
}
.ec-upload__file {
  position: relative;
  display: none;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  z-index: 2;
}
.ec-upload__file .upload-file-component {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-3) var(--space-4);
  border-radius: var(--radius-lg);
  background: rgb(var(--color-rgb-white)/1);
  box-shadow: var(--shadow-lg);
  transition: 0.2s ease;
}
.ec-upload__filename {
  font-weight: var(--font-weight-semibold);
}
.ec-upload__remove {
  display: flex;
  align-items: center;
  justify-content: center;
  aspect-ratio: 1;
  border-radius: 999px;
  background: rgb(var(--color-rgb-badge-danger)/0.08);
  border: none;
  padding: 5px;
  cursor: pointer;
  margin-left: 5px;
  z-index: 3;
}
.ec-upload__remove .icon {
  font-size: 1rem;
  line-height: 1;
  color: rgb(var(--color-rgb-badge-danger)/1);
}
.ec-upload__actions {
  display: flex;
}

.dashboard {
  display: flex;
  flex-direction: column;
  gap: var(--space-7);
  padding: var(--space-7);
  /* HEADER */
  /* CHARTS */
}
.dashboard-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.dashboard-header__left {
  display: flex;
  flex-direction: column;
}
.dashboard-header__actions {
  display: flex;
  gap: 12px;
}
.dashboard-title {
  font-size: clamp(2rem, 2.5vw, 2.5rem);
  font-weight: var(--font-weight-semibold);
  color: rgb(var(--color-rgb-text-heading)/1);
  letter-spacing: -0.25px;
}
.dashboard-subtitle {
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-semibold);
  color: rgb(var(--color-rgb-text-placeholder)/1);
  letter-spacing: -0.05px;
}
.dashboard-charts {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: var(--space-7);
}

.dashboard-actions {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
  gap: var(--space-6);
}
.dashboard-actions .action-tile {
  background: rgb(var(--color-rgb-white)/1);
  display: flex;
  align-items: center;
  gap: var(--space-4);
  font-weight: var(--font-weight-normal);
  box-shadow: 0 5px 20px rgb(var(--color-rgb-secondary)/0.05);
  border-radius: var(--radius-xl);
  padding: var(--space-3) var(--space-3);
  cursor: pointer;
  transition: all 0.2s;
}
.dashboard-actions .action-tile:hover {
  transform: translateY(-3px);
  box-shadow: 0 5px 20px rgb(var(--color-rgb-secondary)/0.1);
}
.dashboard-actions .action-tile .action-icon {
  background: rgb(var(--color-rgb-neutral-base)/1);
  border-radius: var(--radius-md);
  padding: var(--space-4);
}
.dashboard-actions .action-tile .action-title {
  font-weight: var(--font-weight-medium);
  color: rgb(var(--color-rgb-text-heading)/1);
}

/* KPI */
.dashboard-kpis {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 18px;
}
.dashboard-kpis .kpi {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
  padding: var(--space-6) var(--space-6);
  border-radius: var(--radius-xl);
  background: rgb(var(--color-rgb-white)/1);
  border: 1px solid rgb(var(--color-rgb-accent-dark)/0.085);
  box-shadow: 0 5px 20px rgb(var(--color-rgb-secondary)/0.05);
  transition: all 0.25s ease;
  overflow: hidden;
}
.dashboard-kpis .kpi:hover {
  transform: translateY(-2px);
  box-shadow: 0 5px 20px rgb(var(--color-rgb-secondary)/0.05);
}
.dashboard-kpis .kpi__icon {
  font-size: 18px;
  display: none;
}
.dashboard-kpis .kpi__content {
  display: flex;
  flex-direction: column-reverse;
  gap: 0.5rem;
}
.dashboard-kpis .kpi__label {
  font-size: var(--font-size-md);
  font-weight: var(--font-weight-medium);
  color: rgb(var(--color-rgb-text-placeholder)/1);
}
.dashboard-kpis .kpi__value-row {
  display: flex;
  align-items: center;
  gap: 10px;
}
.dashboard-kpis .kpi__value {
  font-size: calc(2.2rem + 0.15vw);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.25px;
  color: rgb(var(--color-rgb-secondary)/1);
}
.dashboard-kpis .kpi__trend {
  font-size: 12px;
  padding: 4px 8px;
  border-radius: 8px;
  font-weight: 600;
}
.dashboard-kpis .kpi__trend--up {
  color: #16A34A;
  background: #ECFDF5;
}
.dashboard-kpis .kpi__trend--down {
  color: #DC2626;
  background: #FEF2F2;
}

/* CHARTS */
.dashboard-charts {
  display: grid;
  grid-template-columns: 2fr 1.35fr;
  gap: var(--space-7);
}
.dashboard-charts .chart-card {
  background: rgb(var(--color-rgb-white)/1);
  border-radius: var(--radius-xl);
  padding: var(--space-8);
  box-shadow: 0 6px 18px rgb(var(--color-rgb-secondary)/0.05);
}
.dashboard-charts .chart-card__header {
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-semibold);
  letter-spacing: -0.1px;
  margin-bottom: var(--space-7);
}
.dashboard-charts .chart-card__body {
  padding: var(--space-5);
  padding-top: 0;
}

.app-main .dx-widget {
  width: 100%;
  font-size: var(--font-size-base);
  font-family: var(--font-base), sans-serif;
  line-height: 1.35715;
  border-color: rgb(var(--color-rgb-border-dark)/1);
}
.app-main .dx-widget input, .app-main .dx-widget textarea {
  font-family: var(--font-family-base), sans-serif;
  letter-spacing: var(--letter-spacing-wide);
  border: 0;
}
.app-main .dx-widget:not(.dx-button) {
  color: rgb(var(--color-rgb-text-main)/1);
}

.dx-button.dx-button-has-text .dx-button-content {
  padding-block: 0;
  padding-inline-start: 0;
  padding-inline-end: 0;
}

.dx-datagrid,
.custom-datagrid {
  font-size: var(--font-size-base);
  color: rgb(var(--color-rgb-text-main)/1);
  /* Convert header cell into flex container */
  /* Prevent DevExtreme alignment classes from fighting */
  /* Optional: make text look like your design */
}
.dx-datagrid .dx-datagrid-header-panel,
.custom-datagrid .dx-datagrid-header-panel {
  border-bottom: 0;
  margin-bottom: var(--space-4);
}
.dx-datagrid .dx-datagrid-header-panel .dx-toolbar,
.custom-datagrid .dx-datagrid-header-panel .dx-toolbar {
  margin-bottom: 0;
}
.dx-datagrid .dx-datagrid-header-panel .dx-toolbar .dx-toolbar-items-container,
.custom-datagrid .dx-datagrid-header-panel .dx-toolbar .dx-toolbar-items-container {
  height: 4.75rem;
}
.dx-datagrid .dx-datagrid-header-panel .dx-toolbar .dx-button,
.custom-datagrid .dx-datagrid-header-panel .dx-toolbar .dx-button {
  box-shadow: none;
}
.dx-datagrid .dx-datagrid-header-panel .dx-toolbar-before .dx-toolbar-item,
.custom-datagrid .dx-datagrid-header-panel .dx-toolbar-before .dx-toolbar-item {
  padding-inline-end: var(--space-4);
}
.dx-datagrid .dx-datagrid-header-panel .dx-toolbar-before .dx-datagrid-search-panel,
.custom-datagrid .dx-datagrid-header-panel .dx-toolbar-before .dx-datagrid-search-panel {
  margin: 0;
}
.dx-datagrid .dx-datagrid-header-panel .dx-toolbar-before .dx-datagrid-search-panel .dx-icon-search:before,
.custom-datagrid .dx-datagrid-header-panel .dx-toolbar-before .dx-datagrid-search-panel .dx-icon-search:before {
  content: "\e80f";
  font-family: "eody-icons";
  font-size: 2rem;
  color: rgb(var(--color-rgb-text-muted)/0.6);
}
.dx-datagrid .dx-datagrid-header-panel .dx-toolbar-before .dx-datagrid-search-panel .dx-texteditor-container,
.custom-datagrid .dx-datagrid-header-panel .dx-toolbar-before .dx-datagrid-search-panel .dx-texteditor-container {
  border-radius: var(--radius-xl);
}
.dx-datagrid .dx-datagrid-header-panel .dx-toolbar-before .dx-datagrid-search-panel .dx-texteditor-input-container input.dx-texteditor-input,
.custom-datagrid .dx-datagrid-header-panel .dx-toolbar-before .dx-datagrid-search-panel .dx-texteditor-input-container input.dx-texteditor-input {
  height: calc(4rem - 4px);
  padding-left: 3.5rem;
}
.dx-datagrid .dx-datagrid-header-panel .dx-toolbar-before .dx-datagrid-search-panel .dx-texteditor-input-container .dx-placeholder:before,
.custom-datagrid .dx-datagrid-header-panel .dx-toolbar-before .dx-datagrid-search-panel .dx-texteditor-input-container .dx-placeholder:before {
  padding-left: 3rem;
}
.dx-datagrid .dx-datagrid-header-panel .dx-toolbar-after .dx-toolbar-item,
.custom-datagrid .dx-datagrid-header-panel .dx-toolbar-after .dx-toolbar-item {
  padding-inline-start: var(--space-4);
}
.dx-datagrid .dx-datagrid-header-panel .dx-toolbar-after .dx-icon-export:before,
.custom-datagrid .dx-datagrid-header-panel .dx-toolbar-after .dx-icon-export:before {
  font-size: 2.2rem;
}
.dx-datagrid .dx-datagrid-header-panel .dx-toolbar-after .data-meta,
.custom-datagrid .dx-datagrid-header-panel .dx-toolbar-after .data-meta {
  font-size: var(--font-size-sm);
  color: rgb(var(--color-rgb-text-accent-dark)/1);
  display: flex;
  flex-direction: column;
  text-align: right;
  padding-inline-end: var(--space-4);
}
.dx-datagrid .dx-datagrid-header-panel .dx-toolbar-item.dx-toolbar-button .dx-widget.dx-button,
.custom-datagrid .dx-datagrid-header-panel .dx-toolbar-item.dx-toolbar-button .dx-widget.dx-button {
  height: var(--toolbar-items-height);
  border: 0;
  border-radius: var(--radius-xl);
  background-color: rgb(var(--color-rgb-neutral-base)/1);
  transition: color var(--motion-duration-fast) var(--motion-ease-standard), background-color var(--motion-duration-fast) var(--motion-ease-standard), border-color var(--motion-duration-fast) var(--motion-ease-standard), box-shadow var(--motion-duration-fast) var(--motion-ease-standard), background-color var(--motion-duration-fast) var(--motion-ease-standard);
}
.dx-datagrid .dx-datagrid-header-panel .dx-toolbar-item.dx-toolbar-button .dx-widget.dx-button:not(.square-btn),
.custom-datagrid .dx-datagrid-header-panel .dx-toolbar-item.dx-toolbar-button .dx-widget.dx-button:not(.square-btn) {
  padding-inline: var(--space-5);
}
.dx-datagrid .dx-datagrid-header-panel .dx-toolbar-item.dx-toolbar-button .dx-widget.dx-button.square-btn,
.custom-datagrid .dx-datagrid-header-panel .dx-toolbar-item.dx-toolbar-button .dx-widget.dx-button.square-btn {
  width: var(--toolbar-items-height);
  aspect-ratio: 1/1;
}
.dx-datagrid .btn.btn--revert,
.custom-datagrid .btn.btn--revert {
  color: rgb(var(--color-rgb-text-main)/1);
}
.dx-datagrid .btn.btn--revert .dx-icon:before,
.custom-datagrid .btn.btn--revert .dx-icon:before {
  color: rgb(var(--color-rgb-text-main)/1);
}
.dx-datagrid .dx-datagrid-headers,
.custom-datagrid .dx-datagrid-headers {
  font-size: var(--font-size-sm);
  border: 1px solid rgb(var(--color-rgb-border-light)/1);
  border-radius: var(--radius-lg);
  padding-block: var(--space-4);
}
.dx-datagrid .dx-datagrid-headers:before,
.custom-datagrid .dx-datagrid-headers:before {
  display: none;
}
.dx-datagrid .dx-datagrid-headers .dx-datagrid-table .dx-row > td,
.custom-datagrid .dx-datagrid-headers .dx-datagrid-table .dx-row > td {
  position: relative;
  vertical-align: middle;
  border: 0;
}
.dx-datagrid .dx-datagrid-headers .dx-datagrid-table tbody > .dx-row:first-child > td:first-child,
.custom-datagrid .dx-datagrid-headers .dx-datagrid-table tbody > .dx-row:first-child > td:first-child {
  padding-left: var(--space-6);
}
.dx-datagrid .dx-datagrid-headers .dx-datagrid-table tbody > .dx-row:last-child > td:last-child,
.custom-datagrid .dx-datagrid-headers .dx-datagrid-table tbody > .dx-row:last-child > td:last-child {
  padding-right: var(--space-6);
}
.dx-datagrid .dx-datagrid-headers .dx-datagrid-table .dx-row > td .dx-column-indicators,
.custom-datagrid .dx-datagrid-headers .dx-datagrid-table .dx-row > td .dx-column-indicators {
  float: unset;
  position: absolute;
  right: 0.5rem;
  top: 50%;
  transform: translateY(-50%);
}
.dx-datagrid .dx-datagrid-headers .dx-datagrid-table .dx-row > td .dx-column-indicators .dx-header-filter:before,
.custom-datagrid .dx-datagrid-headers .dx-datagrid-table .dx-row > td .dx-column-indicators .dx-header-filter:before {
  content: "\e811";
  font-family: "eody-icons";
  font-size: 1.8rem;
}
.dx-datagrid .dx-datagrid-headers .dx-datagrid-table .dx-row > td .dx-column-indicators .dx-header-filter,
.custom-datagrid .dx-datagrid-headers .dx-datagrid-table .dx-row > td .dx-column-indicators .dx-header-filter {
  color: rgb(var(--color-rgb-text-accent-dark)/1);
}
.dx-datagrid .dx-datagrid-headers .dx-datagrid-table .dx-row > td .dx-datagrid-text-content,
.custom-datagrid .dx-datagrid-headers .dx-datagrid-table .dx-row > td .dx-datagrid-text-content {
  color: rgb(var(--color-rgb-text-accent-dark)/1);
  font-weight: var(--font-weight-medium);
}
.dx-datagrid .dx-datagrid-headers .dx-header-row > td.col--header,
.custom-datagrid .dx-datagrid-headers .dx-header-row > td.col--header {
  color: rgb(var(--color-rgb-text-accent-dark)/1);
  background: rgb(var(--color-rgb-bg-light)/1);
}
.dx-datagrid .dx-datagrid-headers .dx-header-row > td.col--header .dx-datagrid-text-content,
.custom-datagrid .dx-datagrid-headers .dx-header-row > td.col--header .dx-datagrid-text-content {
  font-weight: var(--font-weight-bold);
}
.dx-datagrid .dx-datagrid-headers .dx-header-row > td.col--barcode .icon,
.custom-datagrid .dx-datagrid-headers .dx-header-row > td.col--barcode .icon {
  font-size: 1.6rem;
}
.dx-datagrid .dx-datagrid-headers .dx-header-row > td.col--nested-btns,
.custom-datagrid .dx-datagrid-headers .dx-header-row > td.col--nested-btns {
  position: relative;
  vertical-align: bottom;
}
.dx-datagrid .dx-datagrid-headers .dx-header-row > td.col--nested-btns:before,
.custom-datagrid .dx-datagrid-headers .dx-header-row > td.col--nested-btns:before {
  content: "";
  position: absolute;
  top: 0;
  height: 3rem;
  width: 100%;
  left: 0;
  right: 0;
  background: rgb(var(--color-rgb-bg-light)/1);
}
.dx-datagrid .dx-datagrid-headers .dx-header-row > td.col--nested-btns .dx-datagrid-text-content,
.custom-datagrid .dx-datagrid-headers .dx-header-row > td.col--nested-btns .dx-datagrid-text-content {
  font-weight: var(--font-weight-semibold);
}
.dx-datagrid .dx-datagrid-headers .dx-header-row > td.col--nested-btns .dx-column-indicators,
.custom-datagrid .dx-datagrid-headers .dx-header-row > td.col--nested-btns .dx-column-indicators {
  top: unset;
  bottom: 10%;
  transform: translateY(0);
}
.dx-datagrid .dx-datagrid-headers .dx-header-row > td.col--nested-btns.--noBG,
.custom-datagrid .dx-datagrid-headers .dx-header-row > td.col--nested-btns.--noBG {
  vertical-align: middle;
}
.dx-datagrid .dx-datagrid-headers .dx-header-row > td.col--nested-btns.--noBG:before,
.custom-datagrid .dx-datagrid-headers .dx-header-row > td.col--nested-btns.--noBG:before {
  display: none;
}
.dx-datagrid .dx-datagrid-borders .dx-datagrid-rowsview,
.dx-datagrid .dx-datagrid-headers + .dx-datagrid-rowsview,
.dx-datagrid .dx-datagrid-rowsview.dx-datagrid-after-headers,
.custom-datagrid .dx-datagrid-borders .dx-datagrid-rowsview,
.custom-datagrid .dx-datagrid-headers + .dx-datagrid-rowsview,
.custom-datagrid .dx-datagrid-rowsview.dx-datagrid-after-headers {
  border-top: 0;
}
.dx-datagrid .col--divider,
.custom-datagrid .col--divider {
  padding: 0 !important;
  background: transparent;
  position: relative;
}
.dx-datagrid .col--divider::after,
.custom-datagrid .col--divider::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 1px;
  height: 100%;
  background: rgb(var(--color-rgb-border-dark)/1);
}
.dx-datagrid .dx-datagrid-rowsview .dx-datagrid-content .dx-datagrid-table tr.dx-row > td.col--divider:after,
.custom-datagrid .dx-datagrid-rowsview .dx-datagrid-content .dx-datagrid-table tr.dx-row > td.col--divider:after {
  height: 50%;
}
.dx-datagrid .dx-datagrid-rowsview.dx-empty,
.custom-datagrid .dx-datagrid-rowsview.dx-empty {
  min-height: calc(300px + 2vw);
  background-color: rgb(var(--color-rgb-neutral-base)/1);
  border-radius: var(--radius-xl);
  margin-top: var(--space-5);
  overflow: hidden;
}
.dx-datagrid .dx-datagrid-rowsview.dx-empty .dx-datagrid-nodata,
.custom-datagrid .dx-datagrid-rowsview.dx-empty .dx-datagrid-nodata {
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-medium);
  color: rgb(var(--color-rgb-text-placeholder)/1);
  padding-top: 6rem;
}
.dx-datagrid .dx-datagrid-rowsview.dx-empty .dx-datagrid-nodata:before,
.custom-datagrid .dx-datagrid-rowsview.dx-empty .dx-datagrid-nodata:before {
  content: "";
  position: absolute;
  top: calc(50% - 3.5rem);
  left: 50%;
  transform: translate(-50%, -50%);
  width: 90px;
  height: 90px;
  background-image: url("../images/icons/no-data.png");
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  z-index: 1;
}
.dx-datagrid .dx-datagrid-rowsview,
.custom-datagrid .dx-datagrid-rowsview {
  padding-block: var(--space-2);
}
.dx-datagrid .dx-datagrid-rowsview .dx-datagrid-content .dx-datagrid-table,
.custom-datagrid .dx-datagrid-rowsview .dx-datagrid-content .dx-datagrid-table {
  border-collapse: separate;
  border-spacing: 0 var(--space-4);
}
.dx-datagrid .dx-datagrid-rowsview .dx-datagrid-content .dx-datagrid-table tr.dx-row,
.custom-datagrid .dx-datagrid-rowsview .dx-datagrid-content .dx-datagrid-table tr.dx-row {
  position: relative;
  border-radius: var(--radius-xl);
  border-block: 0;
  overflow: hidden;
}
.dx-datagrid .dx-datagrid-rowsview .dx-datagrid-content .dx-datagrid-table tr.dx-row > td,
.custom-datagrid .dx-datagrid-rowsview .dx-datagrid-content .dx-datagrid-table tr.dx-row > td {
  transition: color var(--motion-duration-fast) var(--motion-ease-standard), background-color var(--motion-duration-fast) var(--motion-ease-standard), border-color var(--motion-duration-fast) var(--motion-ease-standard);
  background-color: rgb(var(--color-rgb-neutral-base)/1);
  padding-block: var(--space-6);
  border-left: 0;
  border-right: 0;
  border-block: 1px solid rgb(var(--color-rgb-neutral-base)/1);
  vertical-align: middle;
}
.dx-datagrid .dx-datagrid-rowsview .dx-datagrid-content .dx-datagrid-table tr.dx-row > td:first-child,
.custom-datagrid .dx-datagrid-rowsview .dx-datagrid-content .dx-datagrid-table tr.dx-row > td:first-child {
  border-left: 1px solid rgb(var(--color-rgb-neutral-base)/1);
  border-top-left-radius: var(--radius-xl);
  border-bottom-left-radius: var(--radius-xl);
  padding-left: var(--space-6);
}
.dx-datagrid .dx-datagrid-rowsview .dx-datagrid-content .dx-datagrid-table tr.dx-row > td:last-child,
.custom-datagrid .dx-datagrid-rowsview .dx-datagrid-content .dx-datagrid-table tr.dx-row > td:last-child {
  border-right: 1px solid rgb(var(--color-rgb-neutral-base)/1);
  border-top-right-radius: var(--radius-xl);
  border-bottom-right-radius: var(--radius-xl);
  padding-right: var(--space-6);
}
.dx-datagrid .dx-datagrid-rowsview .dx-datagrid-content .dx-datagrid-table tr.dx-row.dx-data-row.dx-state-hover:not(.dx-selection):not(.dx-row-inserted):not(.dx-row-removed):not(.dx-edit-row):not(.dx-row-focused) > td:not(.dx-focused),
.custom-datagrid .dx-datagrid-rowsview .dx-datagrid-content .dx-datagrid-table tr.dx-row.dx-data-row.dx-state-hover:not(.dx-selection):not(.dx-row-inserted):not(.dx-row-removed):not(.dx-edit-row):not(.dx-row-focused) > td:not(.dx-focused) {
  border-top: 1px solid rgb(var(--color-rgb-secondary)/0.25);
  border-bottom: 1px solid rgb(var(--color-rgb-secondary)/0.25);
}
.dx-datagrid .dx-datagrid-rowsview .dx-datagrid-content .dx-datagrid-table tr.dx-row.dx-data-row.dx-state-hover:not(.dx-selection):not(.dx-row-inserted):not(.dx-row-removed):not(.dx-edit-row):not(.dx-row-focused) > td:not(.dx-focused):first-child,
.custom-datagrid .dx-datagrid-rowsview .dx-datagrid-content .dx-datagrid-table tr.dx-row.dx-data-row.dx-state-hover:not(.dx-selection):not(.dx-row-inserted):not(.dx-row-removed):not(.dx-edit-row):not(.dx-row-focused) > td:not(.dx-focused):first-child {
  border-left: 1px solid rgb(var(--color-rgb-secondary)/0.25);
}
.dx-datagrid .dx-datagrid-rowsview .dx-datagrid-content .dx-datagrid-table tr.dx-row.dx-data-row.dx-state-hover:not(.dx-selection):not(.dx-row-inserted):not(.dx-row-removed):not(.dx-edit-row):not(.dx-row-focused) > td:not(.dx-focused):last-child,
.custom-datagrid .dx-datagrid-rowsview .dx-datagrid-content .dx-datagrid-table tr.dx-row.dx-data-row.dx-state-hover:not(.dx-selection):not(.dx-row-inserted):not(.dx-row-removed):not(.dx-edit-row):not(.dx-row-focused) > td:not(.dx-focused):last-child {
  border-right: 1px solid rgb(var(--color-rgb-secondary)/0.25);
}
.dx-datagrid .dx-datagrid-rowsview .dx-datagrid-content .dx-datagrid-table tr.dx-row.dx-data-row.dx-state-hover:not(.dx-selection):not(.dx-row-inserted):not(.dx-row-removed):not(.dx-edit-row):not(.dx-row-focused) > td:not(.dx-focused),
.custom-datagrid .dx-datagrid-rowsview .dx-datagrid-content .dx-datagrid-table tr.dx-row.dx-data-row.dx-state-hover:not(.dx-selection):not(.dx-row-inserted):not(.dx-row-removed):not(.dx-edit-row):not(.dx-row-focused) > td:not(.dx-focused) {
  background-color: rgb(var(--color-rgb-neutral-base-dark)/1);
}
.dx-datagrid .dx-datagrid-rowsview .dx-datagrid-content .dx-datagrid-table tr.dx-row.dx-data-row.dx-state-hover:hover > td,
.custom-datagrid .dx-datagrid-rowsview .dx-datagrid-content .dx-datagrid-table tr.dx-row.dx-data-row.dx-state-hover:hover > td {
  background-color: rgb(var(--color-rgb-bg-light-3)/1);
}
.dx-datagrid .dx-datagrid-content .dx-datagrid-table .dx-data-row .inline-btns,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table .dx-data-row .inline-btns {
  display: flex;
  align-items: center;
  gap: 0;
}
.dx-datagrid .dx-datagrid-content .dx-datagrid-table .dx-data-row .col--text,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table .dx-data-row .col--text {
  color: rgb(var(--color-rgb-accent-dark)/1);
  font-weight: var(--font-weight-medium);
}
.dx-datagrid .dx-datagrid-content .dx-datagrid-table .dx-data-row .col--date,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table .dx-data-row .col--date {
  color: rgb(var(--color-rgb-accent-dark)/1);
  font-weight: var(--font-weight-medium);
}
.dx-datagrid .dx-datagrid-content .dx-datagrid-table .dx-data-row .col--iso,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table .dx-data-row .col--iso {
  color: rgb(var(--color-rgb-text-main)/1);
  font-weight: var(--font-weight-semibold);
}
.dx-datagrid .dx-datagrid-content .dx-datagrid-table .dx-data-row .col--barcode,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table .dx-data-row .col--barcode {
  color: rgb(var(--color-rgb-text-main)/1);
  font-weight: var(--font-weight-medium);
}
.dx-datagrid .dx-datagrid-content .dx-datagrid-table .dx-data-row .col--text-dark,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table .dx-data-row .col--text-dark {
  color: rgb(var(--color-rgb-text-main)/1);
}
.dx-datagrid .dx-datagrid-content .dx-datagrid-table .dx-data-row .col--metric,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table .dx-data-row .col--metric {
  color: rgb(var(--color-rgb-accent-dark)/1);
  font-size: 15px;
  font-weight: var(--font-weight-bold);
}
.dx-datagrid .dx-datagrid-content .dx-datagrid-table .dx-data-row .col--lock .icon:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table .dx-data-row .col--lock .icon:before {
  color: rgb(var(--color-rgb-accent-dark)/1);
}
.dx-datagrid .dx-datagrid-content .dx-datagrid-table .dx-data-row .text-semibold,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table .dx-data-row .text-semibold {
  font-weight: var(--font-weight-semibold);
}
.dx-datagrid .dx-datagrid-content .dx-datagrid-table .dx-data-row .text-bold,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table .dx-data-row .text-bold {
  font-weight: var(--font-weight-bold);
}
.dx-datagrid .dx-datagrid-content .dx-datagrid-table .dx-data-row .result-badge,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table .dx-data-row .result-badge {
  display: inline-block;
  font-weight: var(--font-weight-semibold);
  border-radius: var(--radius-md);
  background: rgb(var(--color-rgb-white)/1);
  min-width: 10rem;
  box-shadow: var(--shadow-md);
  padding: var(--space-2) var(--space-5);
}
.dx-datagrid .dx-datagrid-content .dx-datagrid-table .dx-data-row .result-badge.result--positive,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table .dx-data-row .result-badge.result--positive {
  color: rgb(var(--color-rgb-danger)/1);
}
.dx-datagrid .dx-datagrid-content .dx-datagrid-table .dx-data-row .result-badge.result--negative,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table .dx-data-row .result-badge.result--negative {
  color: rgb(var(--color-rgb-success)/1);
}
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  aspect-ratio: 1;
  width: 3rem;
  height: 3rem;
  vertical-align: middle;
  line-height: 1;
  border-radius: 99px;
  background-color: rgb(var(--color-rgb-white)/1);
  box-shadow: var(--shadow-md);
  text-decoration: none;
  cursor: pointer;
  transition: color var(--motion-duration-fast) var(--motion-ease-standard), background-color var(--motion-duration-fast) var(--motion-ease-standard), border-color var(--motion-duration-fast) var(--motion-ease-standard), box-shadow var(--motion-duration-fast) var(--motion-ease-standard), background-color var(--motion-duration-fast) var(--motion-ease-standard);
}
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action:before,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action:before,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action:before,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action:before {
  font-family: "eody-icons";
}
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action.action--edit:before,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action.action--edit:before,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action.action--edit:before,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action.action--edit:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action.action--edit:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action.action--edit:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action.action--edit:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action.action--edit:before {
  content: "\e813";
  font-size: 2.1rem;
  color: rgb(var(--color-rgb-secondary-accent)/1);
}
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action.action--view:before,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action.action--view:before,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action.action--view:before,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action.action--view:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action.action--view:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action.action--view:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action.action--view:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action.action--view:before {
  content: "\e812";
  font-size: 2rem;
  color: rgb(var(--color-rgb-secondary-accent)/1);
}
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action.action--submission-manual,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action.action--submission-manual,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action.action--submission-manual,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action.action--submission-manual,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action.action--submission-manual,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action.action--submission-manual,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action.action--submission-manual,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action.action--submission-manual {
  background-color: rgb(var(--color-rgb-bg-disabled)/1);
}
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action.action--submission-manual:before,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action.action--submission-manual:before,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action.action--submission-manual:before,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action.action--submission-manual:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action.action--submission-manual:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action.action--submission-manual:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action.action--submission-manual:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action.action--submission-manual:before {
  content: "\e814";
  font-size: 1.7rem;
  color: rgb(var(--color-rgb-file-edit)/1);
}
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action.action--submission-auto:before,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action.action--submission-auto:before,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action.action--submission-auto:before,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action.action--submission-auto:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action.action--submission-auto:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action.action--submission-auto:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action.action--submission-auto:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action.action--submission-auto:before {
  content: "\e815";
  font-size: 1.7rem;
  color: rgb(var(--color-rgb-upload)/1);
}
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action.action--delete:before,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action.action--delete:before,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action.action--delete:before,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action.action--delete:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action.action--delete:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action.action--delete:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action.action--delete:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action.action--delete:before {
  content: "\e81c";
  font-size: 1.6rem;
  color: rgb(var(--color-rgb-error)/1);
}
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action.action--lock:before,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action.action--lock:before,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action.action--lock:before,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action.action--lock:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action.action--lock:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action.action--lock:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action.action--lock:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action.action--lock:before {
  content: "\e82f";
  font-size: 1.6rem;
  color: rgb(var(--color-rgb-accent-dark)/1);
}
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action.action--unlock:before,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action.action--unlock:before,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action.action--unlock:before,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action.action--unlock:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action.action--unlock:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action.action--unlock:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action.action--unlock:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action.action--unlock:before {
  content: "\f13e";
  font-size: 1.6rem;
  color: rgb(var(--color-rgb-text-placeholder)/1);
}
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action.--lockType2,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action.--lockType2,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action.--lockType2,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action.--lockType2,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action.--lockType2,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action.--lockType2,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action.--lockType2,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action.--lockType2 {
  background-color: rgb(var(--color-rgb-bg-accent-light)/1);
  border: 1px solid rgb(var(--color-rgb-secondary-accent)/0.1);
}
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action.--lockType2:before,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action.--lockType2:before,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action.--lockType2:before,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action.--lockType2:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action.--lockType2:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action.--lockType2:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action.--lockType2:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action.--lockType2:before {
  color: rgb(var(--color-rgb-text-accent)/1);
}
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action.--lockType2.action--unlock,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action.--lockType2.action--unlock,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action.--lockType2.action--unlock,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action.--lockType2.action--unlock,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action.--lockType2.action--unlock,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action.--lockType2.action--unlock,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action.--lockType2.action--unlock,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action.--lockType2.action--unlock {
  border: 1px dashed rgb(var(--color-rgb-secondary)/0.35);
}
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action.--lockType2.action--unlock:before,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action.--lockType2.action--unlock:before,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action.--lockType2.action--unlock:before,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action.--lockType2.action--unlock:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action.--lockType2.action--unlock:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action.--lockType2.action--unlock:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action.--lockType2.action--unlock:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action.--lockType2.action--unlock:before {
  color: rgb(var(--color-rgb-secondary)/1);
}
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action.action--download,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action.action--download,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action.action--download,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action.action--download,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action.action--download,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action.action--download,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action.action--download,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action.action--download {
  background: rgb(var(--color-rgb-white)/1);
  border: 1px solid rgb(var(--color-rgb-accent-light)/1);
}
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action.action--download:before,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action.action--download:before,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action.action--download:before,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action.action--download:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action.action--download:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action.action--download:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action.action--download:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action.action--download:before {
  content: "\e82c";
  font-size: 1.2rem;
  color: rgb(var(--color-rgb-secondary-accent)/1);
}
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action.action--download .dx-icon,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action.action--download .dx-icon,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action.action--download .dx-icon,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action.action--download .dx-icon,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action.action--download .dx-icon,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action.action--download .dx-icon,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action.action--download .dx-icon,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action.action--download .dx-icon {
  display: none;
}
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action.action--approve,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action.action--approve,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action.action--approve,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action.action--approve,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action.action--approve,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action.action--approve,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action.action--approve,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action.action--approve {
  border: 1px solid rgb(var(--color-rgb-success)/0.25);
  background: rgb(var(--color-rgb-success)/0.075);
}
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action.action--approve:before,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action.action--approve:before,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action.action--approve:before,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action.action--approve:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action.action--approve:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action.action--approve:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action.action--approve:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action.action--approve:before {
  content: "\e822";
  font-size: 1.3rem;
  color: rgb(var(--color-rgb-success)/1);
}
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action.action--approve:hover,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action.action--approve:hover,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action.action--approve:hover,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action.action--approve:hover,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action.action--approve:hover,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action.action--approve:hover,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action.action--approve:hover,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action.action--approve:hover {
  box-shadow: 0 0 0 3px rgb(var(--color-rgb-success)/0.25);
}
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action.action--reject,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action.action--reject,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action.action--reject,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action.action--reject,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action.action--reject,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action.action--reject,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action.action--reject,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action.action--reject {
  border: 1px solid rgb(var(--color-rgb-error)/0.25);
  background: rgb(var(--color-rgb-error)/0.085);
}
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action.action--reject:before,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action.action--reject:before,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action.action--reject:before,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action.action--reject:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action.action--reject:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action.action--reject:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action.action--reject:before,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action.action--reject:before {
  content: "\e823";
  font-size: 1.3rem;
  color: rgb(var(--color-rgb-error)/1);
}
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action.action--reject:hover,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action.action--reject:hover,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action.action--reject:hover,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action.action--reject:hover,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action.action--reject:hover,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action.action--reject:hover,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action.action--reject:hover,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action.action--reject:hover {
  box-shadow: 0 0 0 3px rgb(var(--color-rgb-error)/0.25);
}
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action:hover,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action:hover,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action:hover,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action:hover,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td .action:hover,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit .action:hover,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.dx-command-edit-with-icons .action:hover,
.custom-datagrid .dx-datagrid-content .dx-datagrid-table tr.dx-row td.col--nested-btns .action:hover {
  box-shadow: var(--shadow-focus-accent);
}
.dx-datagrid .dx-datagrid-pager,
.custom-datagrid .dx-datagrid-pager {
  padding-block: var(--space-3);
  border-top: 0;
}
.dx-datagrid .dx-datagrid-pager .dx-widget:not(.ec-select__editor).dx-texteditor.dx-editor-outlined .dx-texteditor-container,
.custom-datagrid .dx-datagrid-pager .dx-widget:not(.ec-select__editor).dx-texteditor.dx-editor-outlined .dx-texteditor-container {
  border: 1px solid rgb(var(--color-rgb-border-light)/1);
  box-shadow: var(--shadow-sm);
}
.dx-datagrid .dx-datagrid-pager .dx-page-sizes .dx-texteditor-container .dx-texteditor-input-container input.dx-texteditor-input,
.custom-datagrid .dx-datagrid-pager .dx-page-sizes .dx-texteditor-container .dx-texteditor-input-container input.dx-texteditor-input {
  padding-inline: 1rem 0;
  padding-block: 0.65rem;
}
.dx-datagrid .dx-datagrid-pager .dx-page-sizes .dx-dropdowneditor-button,
.custom-datagrid .dx-datagrid-pager .dx-page-sizes .dx-dropdowneditor-button {
  min-width: 2rem;
}
.dx-datagrid .dx-datagrid-pager .dx-page-sizes .dx-dropdowneditor-icon:before,
.custom-datagrid .dx-datagrid-pager .dx-page-sizes .dx-dropdowneditor-icon:before {
  font-size: 1.1rem;
  content: "\e808";
  font-family: "eody-icons";
  margin-top: -7px;
}
.dx-datagrid .dx-pages > .dx-info,
.custom-datagrid .dx-pages > .dx-info {
  font-size: var(--font-size-base);
  color: rgb(var(--color-rgb-text-main)/1);
}
.dx-datagrid .dx-page-indexes,
.custom-datagrid .dx-page-indexes {
  color: rgb(var(--color-rgb-text-accent-dark)/1);
}
.dx-datagrid .dx-page-indexes .dx-page-index .dx-info,
.custom-datagrid .dx-page-indexes .dx-page-index .dx-info {
  font-weight: var(--font-weight-semibold);
  color: rgb(var(--color-rgb-text-accent-dark)/1);
}
.dx-datagrid .dx-page-indexes .dx-page-index .dx-texteditor-container .dx-texteditor-input-container input.dx-texteditor-input,
.custom-datagrid .dx-page-indexes .dx-page-index .dx-texteditor-container .dx-texteditor-input-container input.dx-texteditor-input {
  color: rgb(var(--color-rgb-text-accent-dark)/1);
  padding-inline: 0;
  padding-block: 0.65rem;
  text-align: center;
}
.dx-datagrid .custom-datagrid .dx-header-row > td,
.custom-datagrid .custom-datagrid .dx-header-row > td {
  display: flex;
  align-items: center;
  justify-content: center; /* center text + icons */
  gap: 8px;
  border: none;
}
.dx-datagrid .custom-datagrid .dx-datagrid-text-content,
.custom-datagrid .custom-datagrid .dx-datagrid-text-content {
  margin: 0;
}
.dx-datagrid .custom-datagrid .dx-header-row > td .dx-datagrid-text-content,
.custom-datagrid .custom-datagrid .dx-header-row > td .dx-datagrid-text-content {
  font-weight: 600;
  font-size: 13px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #5c6bc0;
}
.dx-datagrid .dx-icon.dx-icon-columnchooser:before,
.custom-datagrid .dx-icon.dx-icon-columnchooser:before {
  content: "\e816";
  font-family: "eody-icons";
}
.dx-datagrid .dx-icon.dx-icon-export:before,
.custom-datagrid .dx-icon.dx-icon-export:before {
  content: "\e81d";
  font-family: "eody-icons";
}
.dx-datagrid .dx-icon.dx-icon-revert:before,
.custom-datagrid .dx-icon.dx-icon-revert:before {
  content: "\e819";
  font-family: "eody-icons";
}
.dx-datagrid .dx-icon.dx-icon-plus:before,
.custom-datagrid .dx-icon.dx-icon-plus:before {
  content: "\e81b";
  font-family: "eody-icons";
}

.dx-overlay-wrapper.dx-popup-wrapper.dx-overlay-shader {
  background-color: rgba(0, 30, 60, 0.25);
}

.dx-popup-wrapper:not(.dx-datagrid-column-chooser) > .dx-overlay-content.dx-popup-normal {
  font-family: var(--font-base);
  border-radius: var(--radius-xl);
  border: 0;
}
.dx-popup-wrapper:not(.dx-datagrid-column-chooser) > .dx-overlay-content.dx-popup-normal form {
  padding-bottom: unset;
}
.dx-popup-wrapper:not(.dx-datagrid-column-chooser) > .dx-overlay-content.dx-popup-normal .dx-toolbar.dx-popup-title {
  padding-block: var(--space-5);
  padding-inline: var(--space-6);
  border-bottom: 1px solid rgb(var(--color-rgb-border-light)/1);
}
.dx-popup-wrapper:not(.dx-datagrid-column-chooser) > .dx-overlay-content.dx-popup-normal .dx-toolbar.dx-popup-title .dx-toolbar-before .dx-item-content,
.dx-popup-wrapper:not(.dx-datagrid-column-chooser) > .dx-overlay-content.dx-popup-normal .dx-toolbar.dx-popup-title .popup-title {
  position: relative;
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-semibold);
  overflow: unset;
}
.dx-popup-wrapper:not(.dx-datagrid-column-chooser) > .dx-overlay-content.dx-popup-normal .dx-toolbar.dx-popup-title .dx-toolbar-before .dx-item-content:before,
.dx-popup-wrapper:not(.dx-datagrid-column-chooser) > .dx-overlay-content.dx-popup-normal .dx-toolbar.dx-popup-title .popup-title:before {
  content: "";
  position: absolute;
  top: 50%;
  left: calc(-1 * var(--space-5));
  transform: translateY(-50%);
  width: 0.35rem;
  height: 130%;
  border-top-right-radius: var(--radius-xl);
  border-bottom-right-radius: var(--radius-xl);
  background: var(--color-primary);
}
.dx-popup-wrapper:not(.dx-datagrid-column-chooser) > .dx-overlay-content.dx-popup-normal .dx-toolbar.dx-popup-title .popup-title:before {
  left: calc(-1 * var(--space-6));
}
.dx-popup-wrapper:not(.dx-datagrid-column-chooser) > .dx-overlay-content.dx-popup-normal .dx-toolbar.dx-popup-title .popup-title .popup-title__text {
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-bold);
  color: rgb(var(--color-rgb-text-main)/1);
  letter-spacing: -0.01rem;
}
.dx-popup-wrapper:not(.dx-datagrid-column-chooser) > .dx-overlay-content.dx-popup-normal .dx-toolbar.dx-popup-title .popup-title .popup-title__user {
  display: inline-block;
  color: rgb(var(--color-rgb-text-accent)/1);
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-semibold);
  line-height: 1;
  background-color: rgb(var(--color-rgb-neutral-base)/1);
  border-radius: var(--radius-full);
  padding: var(--space-2) var(--space-4);
  margin-left: var(--space-4);
}
.dx-popup-wrapper:not(.dx-datagrid-column-chooser) > .dx-overlay-content.dx-popup-normal .ec-popup__content .ec-popup__section-title {
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-semibold);
  color: rgb(var(--color-rgb-text-main)/1);
  margin-bottom: var(--space-4);
}
.dx-popup-wrapper:not(.dx-datagrid-column-chooser) > .dx-overlay-content.dx-popup-normal .dx-popup-bottom .dx-toolbar-items-container {
  height: 4.5rem;
}
.dx-popup-wrapper:not(.dx-datagrid-column-chooser) > .dx-overlay-content.dx-popup-normal .popup-confirmation--delete {
  text-align: center;
}
.dx-popup-wrapper:not(.dx-datagrid-column-chooser) > .dx-overlay-content.dx-popup-normal .popup-confirmation__icon {
  display: grid;
  place-items: center;
  margin-inline: auto;
  padding-block: 1.5rem 1.5rem;
}
.dx-popup-wrapper:not(.dx-datagrid-column-chooser) > .dx-overlay-content.dx-popup-normal .popup-confirmation__icon img {
  width: 8rem;
  height: auto;
}
.dx-popup-wrapper:not(.dx-datagrid-column-chooser) > .dx-overlay-content.dx-popup-normal .popup-confirmation__content {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.dx-popup-wrapper:not(.dx-datagrid-column-chooser) > .dx-overlay-content.dx-popup-normal .popup-confirmation__title {
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-bold);
  color: rgb(var(--color-rgb-error)/1);
}
.dx-popup-wrapper:not(.dx-datagrid-column-chooser) > .dx-overlay-content.dx-popup-normal .popup-confirmation__text {
  color: rgb(var(--color-rgb-text-main)/1);
}
.dx-popup-wrapper:not(.dx-datagrid-column-chooser) > .dx-overlay-content.dx-popup-normal .popup-confirmation__sub {
  color: rgb(var(--color-rgb-text-muted)/1);
}

.dx-popup-wrapper:not(.dx-datagrid-column-chooser).popup--noTitle > .dx-overlay-content.dx-popup-normal .dx-toolbar.dx-popup-title {
  position: absolute;
  right: 2rem;
  top: 1rem;
  padding: 0;
  border: 0;
}
.dx-popup-wrapper:not(.dx-datagrid-column-chooser).popup--noTitle .dx-popup-content {
  padding-bottom: 0;
}

.dx-popup-wrapper.dx-datagrid-column-chooser .dx-overlay-content.dx-popup-normal {
  border: 0;
  box-shadow: var(--shadow-lg);
  border-radius: var(--radius-xl);
}
.dx-popup-wrapper.dx-datagrid-column-chooser .dx-state-focused.dx-overlay-content {
  box-shadow: var(--shadow-lg-hover);
}
.dx-popup-wrapper.dx-datagrid-column-chooser .dx-overlay-content.dx-popup-normal .dx-popup-title {
  padding-bottom: 4px;
}
.dx-popup-wrapper.dx-datagrid-column-chooser .dx-overlay-content.dx-popup-normal .dx-popup-title .dx-toolbar-label {
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-semibold);
  color: rgb(var(--color-rgb-text-accent-dark)/1);
}
.dx-popup-wrapper.dx-datagrid-column-chooser .dx-toolbar .dx-closebutton .dx-icon {
  font-size: var(--font-size-base);
  color: rgb(var(--color-rgb-text-accent-dark)/1);
}
.dx-popup-wrapper.dx-datagrid-column-chooser .dx-toolbar .dx-closebutton .dx-button-content {
  padding: 0.5rem;
}
.dx-popup-wrapper.dx-datagrid-column-chooser .dx-toolbar .dx-closebutton.dx-state-hover {
  background-color: rgb(var(--color-rgb-neutral-base)/1);
}
.dx-popup-wrapper.dx-datagrid-column-chooser .dx-scrollable .dx-scrollable-content .dx-treeview-select-all-item {
  border-bottom-color: rgb(var(--color-rgb-border-light)/1);
  padding-left: 2px;
  padding-right: 0;
  margin-bottom: 0.65rem;
}
.dx-popup-wrapper.dx-datagrid-column-chooser .dx-scrollable .dx-scrollable-content .dx-treeview-select-all-item .dx-checkbox-text {
  font-weight: var(--font-weight-medium);
}
.dx-popup-wrapper.dx-datagrid-column-chooser .dx-scrollable .dx-scrollable-content .dx-treeview-node-container {
  padding-block-end: var(--space-4);
}
.dx-popup-wrapper.dx-datagrid-column-chooser .dx-scrollable .dx-scrollable-content .dx-treeview-node-container .dx-treeview-node {
  padding-inline-start: 0;
  padding-right: 1.5rem;
}
.dx-popup-wrapper.dx-datagrid-column-chooser .dx-scrollable .dx-scrollable-content .dx-treeview-node-container .dx-treeview-node .dx-treeview-item {
  align-items: flex-start;
  padding-inline: 0;
  padding-block: 0.75rem;
}
.dx-popup-wrapper.dx-datagrid-column-chooser .dx-scrollable .dx-scrollable-content .dx-treeview-node-container .dx-treeview-node .dx-treeview-item.dx-state-hover {
  background: transparent;
}
.dx-popup-wrapper.dx-datagrid-column-chooser .dx-scrollable .dx-scrollable-content .dx-treeview-node-container .dx-treeview-node .dx-treeview-item .dx-treeview-item-content {
  padding-top: 3px;
}
.dx-popup-wrapper.dx-datagrid-column-chooser .dx-scrollable .dx-scrollable-content .dx-treeview-node-container .dx-treeview-node .dx-treeview-item.dx-state-hover .dx-treeview-item-content {
  color: rgb(var(--color-rgb-secondary-accent)/1);
}
.dx-popup-wrapper.dx-datagrid-column-chooser .dx-scrollable .dx-scrollable-content .dx-treeview-node-container .dx-treeview-item-with-checkbox.dx-state-focused > .dx-treeview-item .dx-checkbox .dx-checkbox-icon {
  border: 1px solid rgb(var(--color-rgb-secondary-accent)/1);
}
.dx-popup-wrapper.dx-datagrid-column-chooser .dx-scrollable .dx-scrollable-content .dx-treeview-node-container .dx-treeview-node .dx-treeview-expander-icon-stub {
  position: absolute;
  right: 0;
}
.dx-popup-wrapper.dx-datagrid-column-chooser .dx-widget:not(.dx-selectbox).dx-texteditor.dx-editor-outlined.dx-searchbox .dx-texteditor-input {
  padding-block: 0.9rem;
}
.dx-popup-wrapper.dx-datagrid-column-chooser .dx-searchbox .dx-placeholder:before {
  padding-inline-start: 3rem;
}
.dx-popup-wrapper.dx-datagrid-column-chooser .dx-icon-search:before {
  content: "\e80f";
  font-family: "eody-icons";
  font-size: 2rem;
  color: rgb(var(--color-rgb-text-muted)/0.6);
}

.dx-popup-wrapper.dx-header-filter-menu .dx-popup-normal .dx-popup-content .dx-list-select-all,
.dx-popup-wrapper.dx-header-filter-menu .dx-popup-normal .dx-popup-content .dx-treeview-select-all-item {
  display: flex;
  align-items: center;
  font-weight: var(--font-weight-medium);
  color: rgb(var(--color-rgb-secondary)/1);
  background: rgb(var(--color-rgb-bg-light)/1);
  border: 0;
  border-radius: var(--radius-md);
  padding: var(--space-3) var(--space-4);
  margin-bottom: var(--space-2);
}
.dx-popup-wrapper.dx-header-filter-menu .dx-popup-normal .dx-popup-content .dx-list-select-all-checkbox {
  margin-inline-start: 0px;
  margin: 0;
}
.dx-popup-wrapper.dx-header-filter-menu .dx-popup-normal .dx-popup-content .dx-list-items .dx-list-item:not(:first-child) {
  border-top: 1px solid rgb(var(--color-rgb-neutral-base)/1);
}
.dx-popup-wrapper.dx-header-filter-menu .dx-popup-normal .dx-popup-content .dx-list-items .dx-list-item.dx-state-hover {
  color: rgb(var(--color-rgb-secondary-accent)/1);
}
.dx-popup-wrapper.dx-header-filter-menu .dx-popup-normal .dx-popup-content .dx-list-items .dx-list-item .dx-list-select-checkbox {
  margin-inline-start: var(--space-4);
}
.dx-popup-wrapper.dx-header-filter-menu .dx-popup-normal .dx-popup-content .dx-treeview .dx-treeview-node .dx-treeview-item.dx-state-hover {
  color: rgb(var(--color-rgb-secondary-accent)/1);
  background: transparent;
}

.dx-popup-wrapper .dx-popup-normal .dx-toolbar .dx-toolbar-before .dx-toolbar-button .dx-button {
  box-shadow: none;
}
.dx-popup-wrapper .dx-popup-normal .dx-toolbar .dx-toolbar-after .dx-toolbar-button .dx-button:not(.btn, .dx-button-has-icon) {
  color: rgb(var(--color-rgb-text-main)/1);
  padding-block: var(--space-3);
  border: 0;
  border-radius: var(--radius-md);
  background-color: rgb(var(--color-rgb-neutral-base)/1);
  transition: color var(--motion-duration-fast) var(--motion-ease-standard), background-color var(--motion-duration-fast) var(--motion-ease-standard), border-color var(--motion-duration-fast) var(--motion-ease-standard);
  box-shadow: none;
}
.dx-popup-wrapper .dx-popup-normal .dx-toolbar .dx-toolbar-after .dx-toolbar-button .dx-button:not(.btn, .dx-button-has-icon):hover {
  background-color: rgb(var(--color-rgb-neutral-base-dark)/1);
}
.dx-popup-wrapper .dx-popup-normal .dx-toolbar .dx-toolbar-after .dx-toolbar-button .dx-button:not(.btn, .dx-button-has-icon)[aria-label=OK] {
  color: rgb(var(--color-rgb-white)/1);
  background: rgb(var(--color-rgb-secondary-accent)/1);
}

.dx-checkbox {
  /* Simple DevExtreme checkbox skin (safe baseline) */
  /* Reset DX icon visuals completely */
  /* Kill any DevExtreme pseudo content */
  /* Checked state */
  /* Our checkmark */
  /* Unchecked: ensure nothing remains */
  /* Optional: focus */
  /* Optional: disabled */
}
.dx-checkbox:not(.dx-checkbox-has-text) .dx-checkbox-container {
  width: 25px;
  height: 25px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.dx-checkbox .dx-checkbox-icon {
  position: relative;
  width: 22px;
  height: 22px;
  border-radius: var(--radius-sm);
  background-image: none;
  background: rgb(var(--color-rgb-neutral-base)/1);
  border: 1px solid rgb(var(--color-rgb-border-dark)/1);
  box-shadow: none;
}
.dx-checkbox.dx-state-hover .dx-checkbox-icon {
  border-color: rgb(var(--color-rgb-secondary-accent)/1);
}
.dx-checkbox .dx-checkbox-icon::before {
  content: none !important;
}
.dx-checkbox.dx-checkbox-checked .dx-checkbox-icon {
  background: #1D4ED8;
}
.dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::after {
  content: "";
  position: absolute;
  left: 7px;
  top: 2px;
  width: 6px;
  height: 12px;
  border-right: 2px solid #FFFFFF;
  border-bottom: 2px solid #FFFFFF;
  transform: rotate(45deg);
}
.dx-checkbox:not(.dx-checkbox-checked) .dx-checkbox-icon::after {
  content: none;
}
.dx-checkbox.dx-state-focused .dx-checkbox-icon {
  outline: 2px solid #93C5FD;
  outline-offset: 2px;
}
.dx-checkbox.dx-state-disabled .dx-checkbox-icon {
  opacity: 0.5;
}

.dx-list-item-before-bag .dx-list-select-checkbox,
.dx-list-item-before-bag .dx-list-select-radiobutton {
  margin-top: -4px;
}

.dx-list.dx-list-select-decorator-enabled .dx-list-item.dx-state-focused .dx-checkbox-icon {
  border: 1px solid rgb(var(--color-rgb-secondary)/1);
}

.dx-dropdownlist-popup-wrapper .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item-content {
  text-align: center;
  padding: var(--space-1) 0;
}