@charset "UTF-8";

/* src/styles.scss */
@layer primeng, vendors, reset, general, layout, components, themes;
@layer vendors {
  @layer googlecode {
    pre code.hljs {
      display: block;
      overflow-x: auto;
      padding: 1em;
    }
    code.hljs {
      padding: 3px 5px;
    }
    .hljs {
      background: #fff;
      color: #000;
    }
    .hljs-comment,
    .hljs-quote {
      color: #800;
    }
    .hljs-keyword,
    .hljs-name,
    .hljs-section,
    .hljs-selector-tag,
    .hljs-title {
      color: #008;
    }
    .hljs-template-variable,
    .hljs-variable {
      color: #660;
    }
    .hljs-regexp,
    .hljs-selector-attr,
    .hljs-selector-pseudo,
    .hljs-string {
      color: #080;
    }
    .hljs-bullet,
    .hljs-link,
    .hljs-literal,
    .hljs-meta,
    .hljs-number,
    .hljs-symbol {
      color: #066;
    }
    .hljs-attr,
    .hljs-built_in,
    .hljs-doctag,
    .hljs-params,
    .hljs-title,
    .hljs-type {
      color: #606;
    }
    .hljs-attribute,
    .hljs-subst {
      color: #000;
    }
    .hljs-formula {
      background-color: #eee;
      font-style: italic;
    }
    .hljs-selector-class,
    .hljs-selector-id {
      color: #9b703f;
    }
    .hljs-addition {
      background-color: #baeeba;
    }
    .hljs-deletion {
      background-color: #ffc8bd;
    }
    .hljs-doctag,
    .hljs-strong {
      font-weight: 700;
    }
    .hljs-emphasis {
      font-style: italic;
    }
  }
}
@layer reset {
  /*!
   * Bootstrap Grid v5.3.3 (https://getbootstrap.com/)
   * Copyright 2011-2024 The Bootstrap Authors
   * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
   */
  .container,
  .container-fluid,
  .container-lg,
  .container-md,
  .container-sm,
  .container-xl,
  .container-xxl {
    --bs-gutter-x:1.5rem;
    --bs-gutter-y:0;
    width: 100%;
    padding-right: calc(var(--bs-gutter-x) * 0.5);
    padding-left: calc(var(--bs-gutter-x) * 0.5);
    margin-right: auto;
    margin-left: auto;
  }
  @media (min-width: 576px) {
    .container,
    .container-sm {
      max-width: 540px;
    }
  }
  @media (min-width: 768px) {
    .container,
    .container-md,
    .container-sm {
      max-width: 720px;
    }
  }
  @media (min-width: 992px) {
    .container,
    .container-lg,
    .container-md,
    .container-sm {
      max-width: 960px;
    }
  }
  @media (min-width: 1200px) {
    .container,
    .container-lg,
    .container-md,
    .container-sm,
    .container-xl {
      max-width: 1140px;
    }
  }
  @media (min-width: 1400px) {
    .container,
    .container-lg,
    .container-md,
    .container-sm,
    .container-xl,
    .container-xxl {
      max-width: 1320px;
    }
  }
  :root {
    --bs-breakpoint-xs:0;
    --bs-breakpoint-sm:576px;
    --bs-breakpoint-md:768px;
    --bs-breakpoint-lg:992px;
    --bs-breakpoint-xl:1200px;
    --bs-breakpoint-xxl:1400px;
  }
  .row {
    --bs-gutter-x:1.5rem;
    --bs-gutter-y:0;
    display: flex;
    flex-wrap: wrap;
    margin-top: calc(-1 * var(--bs-gutter-y));
    margin-right: calc(-0.5 * var(--bs-gutter-x));
    margin-left: calc(-0.5 * var(--bs-gutter-x));
  }
  .row > * {
    box-sizing: border-box;
    flex-shrink: 0;
    width: 100%;
    max-width: 100%;
    padding-right: calc(var(--bs-gutter-x) * 0.5);
    padding-left: calc(var(--bs-gutter-x) * 0.5);
    margin-top: var(--bs-gutter-y);
  }
  .col {
    flex: 1 0 0%;
  }
  .row-cols-auto > * {
    flex: 0 0 auto;
    width: auto;
  }
  .row-cols-1 > * {
    flex: 0 0 auto;
    width: 100%;
  }
  .row-cols-2 > * {
    flex: 0 0 auto;
    width: 50%;
  }
  .row-cols-3 > * {
    flex: 0 0 auto;
    width: 33.33333333%;
  }
  .row-cols-4 > * {
    flex: 0 0 auto;
    width: 25%;
  }
  .row-cols-5 > * {
    flex: 0 0 auto;
    width: 20%;
  }
  .row-cols-6 > * {
    flex: 0 0 auto;
    width: 16.66666667%;
  }
  .col-auto {
    flex: 0 0 auto;
    width: auto;
  }
  .col-1 {
    flex: 0 0 auto;
    width: 8.33333333%;
  }
  .col-2 {
    flex: 0 0 auto;
    width: 16.66666667%;
  }
  .col-3 {
    flex: 0 0 auto;
    width: 25%;
  }
  .col-4 {
    flex: 0 0 auto;
    width: 33.33333333%;
  }
  .col-5 {
    flex: 0 0 auto;
    width: 41.66666667%;
  }
  .col-6 {
    flex: 0 0 auto;
    width: 50%;
  }
  .col-7 {
    flex: 0 0 auto;
    width: 58.33333333%;
  }
  .col-8 {
    flex: 0 0 auto;
    width: 66.66666667%;
  }
  .col-9 {
    flex: 0 0 auto;
    width: 75%;
  }
  .col-10 {
    flex: 0 0 auto;
    width: 83.33333333%;
  }
  .col-11 {
    flex: 0 0 auto;
    width: 91.66666667%;
  }
  .col-12 {
    flex: 0 0 auto;
    width: 100%;
  }
  .offset-1 {
    margin-left: 8.33333333%;
  }
  .offset-2 {
    margin-left: 16.66666667%;
  }
  .offset-3 {
    margin-left: 25%;
  }
  .offset-4 {
    margin-left: 33.33333333%;
  }
  .offset-5 {
    margin-left: 41.66666667%;
  }
  .offset-6 {
    margin-left: 50%;
  }
  .offset-7 {
    margin-left: 58.33333333%;
  }
  .offset-8 {
    margin-left: 66.66666667%;
  }
  .offset-9 {
    margin-left: 75%;
  }
  .offset-10 {
    margin-left: 83.33333333%;
  }
  .offset-11 {
    margin-left: 91.66666667%;
  }
  .g-0,
  .gx-0 {
    --bs-gutter-x:0;
  }
  .g-0,
  .gy-0 {
    --bs-gutter-y:0;
  }
  .g-1,
  .gx-1 {
    --bs-gutter-x:0.25rem;
  }
  .g-1,
  .gy-1 {
    --bs-gutter-y:0.25rem;
  }
  .g-2,
  .gx-2 {
    --bs-gutter-x:0.5rem;
  }
  .g-2,
  .gy-2 {
    --bs-gutter-y:0.5rem;
  }
  .g-3,
  .gx-3 {
    --bs-gutter-x:1rem;
  }
  .g-3,
  .gy-3 {
    --bs-gutter-y:1rem;
  }
  .g-4,
  .gx-4 {
    --bs-gutter-x:1.5rem;
  }
  .g-4,
  .gy-4 {
    --bs-gutter-y:1.5rem;
  }
  .g-5,
  .gx-5 {
    --bs-gutter-x:3rem;
  }
  .g-5,
  .gy-5 {
    --bs-gutter-y:3rem;
  }
  @media (min-width: 576px) {
    .col-sm {
      flex: 1 0 0%;
    }
    .row-cols-sm-auto > * {
      flex: 0 0 auto;
      width: auto;
    }
    .row-cols-sm-1 > * {
      flex: 0 0 auto;
      width: 100%;
    }
    .row-cols-sm-2 > * {
      flex: 0 0 auto;
      width: 50%;
    }
    .row-cols-sm-3 > * {
      flex: 0 0 auto;
      width: 33.33333333%;
    }
    .row-cols-sm-4 > * {
      flex: 0 0 auto;
      width: 25%;
    }
    .row-cols-sm-5 > * {
      flex: 0 0 auto;
      width: 20%;
    }
    .row-cols-sm-6 > * {
      flex: 0 0 auto;
      width: 16.66666667%;
    }
    .col-sm-auto {
      flex: 0 0 auto;
      width: auto;
    }
    .col-sm-1 {
      flex: 0 0 auto;
      width: 8.33333333%;
    }
    .col-sm-2 {
      flex: 0 0 auto;
      width: 16.66666667%;
    }
    .col-sm-3 {
      flex: 0 0 auto;
      width: 25%;
    }
    .col-sm-4 {
      flex: 0 0 auto;
      width: 33.33333333%;
    }
    .col-sm-5 {
      flex: 0 0 auto;
      width: 41.66666667%;
    }
    .col-sm-6 {
      flex: 0 0 auto;
      width: 50%;
    }
    .col-sm-7 {
      flex: 0 0 auto;
      width: 58.33333333%;
    }
    .col-sm-8 {
      flex: 0 0 auto;
      width: 66.66666667%;
    }
    .col-sm-9 {
      flex: 0 0 auto;
      width: 75%;
    }
    .col-sm-10 {
      flex: 0 0 auto;
      width: 83.33333333%;
    }
    .col-sm-11 {
      flex: 0 0 auto;
      width: 91.66666667%;
    }
    .col-sm-12 {
      flex: 0 0 auto;
      width: 100%;
    }
    .offset-sm-0 {
      margin-left: 0;
    }
    .offset-sm-1 {
      margin-left: 8.33333333%;
    }
    .offset-sm-2 {
      margin-left: 16.66666667%;
    }
    .offset-sm-3 {
      margin-left: 25%;
    }
    .offset-sm-4 {
      margin-left: 33.33333333%;
    }
    .offset-sm-5 {
      margin-left: 41.66666667%;
    }
    .offset-sm-6 {
      margin-left: 50%;
    }
    .offset-sm-7 {
      margin-left: 58.33333333%;
    }
    .offset-sm-8 {
      margin-left: 66.66666667%;
    }
    .offset-sm-9 {
      margin-left: 75%;
    }
    .offset-sm-10 {
      margin-left: 83.33333333%;
    }
    .offset-sm-11 {
      margin-left: 91.66666667%;
    }
    .g-sm-0,
    .gx-sm-0 {
      --bs-gutter-x:0;
    }
    .g-sm-0,
    .gy-sm-0 {
      --bs-gutter-y:0;
    }
    .g-sm-1,
    .gx-sm-1 {
      --bs-gutter-x:0.25rem;
    }
    .g-sm-1,
    .gy-sm-1 {
      --bs-gutter-y:0.25rem;
    }
    .g-sm-2,
    .gx-sm-2 {
      --bs-gutter-x:0.5rem;
    }
    .g-sm-2,
    .gy-sm-2 {
      --bs-gutter-y:0.5rem;
    }
    .g-sm-3,
    .gx-sm-3 {
      --bs-gutter-x:1rem;
    }
    .g-sm-3,
    .gy-sm-3 {
      --bs-gutter-y:1rem;
    }
    .g-sm-4,
    .gx-sm-4 {
      --bs-gutter-x:1.5rem;
    }
    .g-sm-4,
    .gy-sm-4 {
      --bs-gutter-y:1.5rem;
    }
    .g-sm-5,
    .gx-sm-5 {
      --bs-gutter-x:3rem;
    }
    .g-sm-5,
    .gy-sm-5 {
      --bs-gutter-y:3rem;
    }
  }
  @media (min-width: 768px) {
    .col-md {
      flex: 1 0 0%;
    }
    .row-cols-md-auto > * {
      flex: 0 0 auto;
      width: auto;
    }
    .row-cols-md-1 > * {
      flex: 0 0 auto;
      width: 100%;
    }
    .row-cols-md-2 > * {
      flex: 0 0 auto;
      width: 50%;
    }
    .row-cols-md-3 > * {
      flex: 0 0 auto;
      width: 33.33333333%;
    }
    .row-cols-md-4 > * {
      flex: 0 0 auto;
      width: 25%;
    }
    .row-cols-md-5 > * {
      flex: 0 0 auto;
      width: 20%;
    }
    .row-cols-md-6 > * {
      flex: 0 0 auto;
      width: 16.66666667%;
    }
    .col-md-auto {
      flex: 0 0 auto;
      width: auto;
    }
    .col-md-1 {
      flex: 0 0 auto;
      width: 8.33333333%;
    }
    .col-md-2 {
      flex: 0 0 auto;
      width: 16.66666667%;
    }
    .col-md-3 {
      flex: 0 0 auto;
      width: 25%;
    }
    .col-md-4 {
      flex: 0 0 auto;
      width: 33.33333333%;
    }
    .col-md-5 {
      flex: 0 0 auto;
      width: 41.66666667%;
    }
    .col-md-6 {
      flex: 0 0 auto;
      width: 50%;
    }
    .col-md-7 {
      flex: 0 0 auto;
      width: 58.33333333%;
    }
    .col-md-8 {
      flex: 0 0 auto;
      width: 66.66666667%;
    }
    .col-md-9 {
      flex: 0 0 auto;
      width: 75%;
    }
    .col-md-10 {
      flex: 0 0 auto;
      width: 83.33333333%;
    }
    .col-md-11 {
      flex: 0 0 auto;
      width: 91.66666667%;
    }
    .col-md-12 {
      flex: 0 0 auto;
      width: 100%;
    }
    .offset-md-0 {
      margin-left: 0;
    }
    .offset-md-1 {
      margin-left: 8.33333333%;
    }
    .offset-md-2 {
      margin-left: 16.66666667%;
    }
    .offset-md-3 {
      margin-left: 25%;
    }
    .offset-md-4 {
      margin-left: 33.33333333%;
    }
    .offset-md-5 {
      margin-left: 41.66666667%;
    }
    .offset-md-6 {
      margin-left: 50%;
    }
    .offset-md-7 {
      margin-left: 58.33333333%;
    }
    .offset-md-8 {
      margin-left: 66.66666667%;
    }
    .offset-md-9 {
      margin-left: 75%;
    }
    .offset-md-10 {
      margin-left: 83.33333333%;
    }
    .offset-md-11 {
      margin-left: 91.66666667%;
    }
    .g-md-0,
    .gx-md-0 {
      --bs-gutter-x:0;
    }
    .g-md-0,
    .gy-md-0 {
      --bs-gutter-y:0;
    }
    .g-md-1,
    .gx-md-1 {
      --bs-gutter-x:0.25rem;
    }
    .g-md-1,
    .gy-md-1 {
      --bs-gutter-y:0.25rem;
    }
    .g-md-2,
    .gx-md-2 {
      --bs-gutter-x:0.5rem;
    }
    .g-md-2,
    .gy-md-2 {
      --bs-gutter-y:0.5rem;
    }
    .g-md-3,
    .gx-md-3 {
      --bs-gutter-x:1rem;
    }
    .g-md-3,
    .gy-md-3 {
      --bs-gutter-y:1rem;
    }
    .g-md-4,
    .gx-md-4 {
      --bs-gutter-x:1.5rem;
    }
    .g-md-4,
    .gy-md-4 {
      --bs-gutter-y:1.5rem;
    }
    .g-md-5,
    .gx-md-5 {
      --bs-gutter-x:3rem;
    }
    .g-md-5,
    .gy-md-5 {
      --bs-gutter-y:3rem;
    }
  }
  @media (min-width: 992px) {
    .col-lg {
      flex: 1 0 0%;
    }
    .row-cols-lg-auto > * {
      flex: 0 0 auto;
      width: auto;
    }
    .row-cols-lg-1 > * {
      flex: 0 0 auto;
      width: 100%;
    }
    .row-cols-lg-2 > * {
      flex: 0 0 auto;
      width: 50%;
    }
    .row-cols-lg-3 > * {
      flex: 0 0 auto;
      width: 33.33333333%;
    }
    .row-cols-lg-4 > * {
      flex: 0 0 auto;
      width: 25%;
    }
    .row-cols-lg-5 > * {
      flex: 0 0 auto;
      width: 20%;
    }
    .row-cols-lg-6 > * {
      flex: 0 0 auto;
      width: 16.66666667%;
    }
    .col-lg-auto {
      flex: 0 0 auto;
      width: auto;
    }
    .col-lg-1 {
      flex: 0 0 auto;
      width: 8.33333333%;
    }
    .col-lg-2 {
      flex: 0 0 auto;
      width: 16.66666667%;
    }
    .col-lg-3 {
      flex: 0 0 auto;
      width: 25%;
    }
    .col-lg-4 {
      flex: 0 0 auto;
      width: 33.33333333%;
    }
    .col-lg-5 {
      flex: 0 0 auto;
      width: 41.66666667%;
    }
    .col-lg-6 {
      flex: 0 0 auto;
      width: 50%;
    }
    .col-lg-7 {
      flex: 0 0 auto;
      width: 58.33333333%;
    }
    .col-lg-8 {
      flex: 0 0 auto;
      width: 66.66666667%;
    }
    .col-lg-9 {
      flex: 0 0 auto;
      width: 75%;
    }
    .col-lg-10 {
      flex: 0 0 auto;
      width: 83.33333333%;
    }
    .col-lg-11 {
      flex: 0 0 auto;
      width: 91.66666667%;
    }
    .col-lg-12 {
      flex: 0 0 auto;
      width: 100%;
    }
    .offset-lg-0 {
      margin-left: 0;
    }
    .offset-lg-1 {
      margin-left: 8.33333333%;
    }
    .offset-lg-2 {
      margin-left: 16.66666667%;
    }
    .offset-lg-3 {
      margin-left: 25%;
    }
    .offset-lg-4 {
      margin-left: 33.33333333%;
    }
    .offset-lg-5 {
      margin-left: 41.66666667%;
    }
    .offset-lg-6 {
      margin-left: 50%;
    }
    .offset-lg-7 {
      margin-left: 58.33333333%;
    }
    .offset-lg-8 {
      margin-left: 66.66666667%;
    }
    .offset-lg-9 {
      margin-left: 75%;
    }
    .offset-lg-10 {
      margin-left: 83.33333333%;
    }
    .offset-lg-11 {
      margin-left: 91.66666667%;
    }
    .g-lg-0,
    .gx-lg-0 {
      --bs-gutter-x:0;
    }
    .g-lg-0,
    .gy-lg-0 {
      --bs-gutter-y:0;
    }
    .g-lg-1,
    .gx-lg-1 {
      --bs-gutter-x:0.25rem;
    }
    .g-lg-1,
    .gy-lg-1 {
      --bs-gutter-y:0.25rem;
    }
    .g-lg-2,
    .gx-lg-2 {
      --bs-gutter-x:0.5rem;
    }
    .g-lg-2,
    .gy-lg-2 {
      --bs-gutter-y:0.5rem;
    }
    .g-lg-3,
    .gx-lg-3 {
      --bs-gutter-x:1rem;
    }
    .g-lg-3,
    .gy-lg-3 {
      --bs-gutter-y:1rem;
    }
    .g-lg-4,
    .gx-lg-4 {
      --bs-gutter-x:1.5rem;
    }
    .g-lg-4,
    .gy-lg-4 {
      --bs-gutter-y:1.5rem;
    }
    .g-lg-5,
    .gx-lg-5 {
      --bs-gutter-x:3rem;
    }
    .g-lg-5,
    .gy-lg-5 {
      --bs-gutter-y:3rem;
    }
  }
  @media (min-width: 1200px) {
    .col-xl {
      flex: 1 0 0%;
    }
    .row-cols-xl-auto > * {
      flex: 0 0 auto;
      width: auto;
    }
    .row-cols-xl-1 > * {
      flex: 0 0 auto;
      width: 100%;
    }
    .row-cols-xl-2 > * {
      flex: 0 0 auto;
      width: 50%;
    }
    .row-cols-xl-3 > * {
      flex: 0 0 auto;
      width: 33.33333333%;
    }
    .row-cols-xl-4 > * {
      flex: 0 0 auto;
      width: 25%;
    }
    .row-cols-xl-5 > * {
      flex: 0 0 auto;
      width: 20%;
    }
    .row-cols-xl-6 > * {
      flex: 0 0 auto;
      width: 16.66666667%;
    }
    .col-xl-auto {
      flex: 0 0 auto;
      width: auto;
    }
    .col-xl-1 {
      flex: 0 0 auto;
      width: 8.33333333%;
    }
    .col-xl-2 {
      flex: 0 0 auto;
      width: 16.66666667%;
    }
    .col-xl-3 {
      flex: 0 0 auto;
      width: 25%;
    }
    .col-xl-4 {
      flex: 0 0 auto;
      width: 33.33333333%;
    }
    .col-xl-5 {
      flex: 0 0 auto;
      width: 41.66666667%;
    }
    .col-xl-6 {
      flex: 0 0 auto;
      width: 50%;
    }
    .col-xl-7 {
      flex: 0 0 auto;
      width: 58.33333333%;
    }
    .col-xl-8 {
      flex: 0 0 auto;
      width: 66.66666667%;
    }
    .col-xl-9 {
      flex: 0 0 auto;
      width: 75%;
    }
    .col-xl-10 {
      flex: 0 0 auto;
      width: 83.33333333%;
    }
    .col-xl-11 {
      flex: 0 0 auto;
      width: 91.66666667%;
    }
    .col-xl-12 {
      flex: 0 0 auto;
      width: 100%;
    }
    .offset-xl-0 {
      margin-left: 0;
    }
    .offset-xl-1 {
      margin-left: 8.33333333%;
    }
    .offset-xl-2 {
      margin-left: 16.66666667%;
    }
    .offset-xl-3 {
      margin-left: 25%;
    }
    .offset-xl-4 {
      margin-left: 33.33333333%;
    }
    .offset-xl-5 {
      margin-left: 41.66666667%;
    }
    .offset-xl-6 {
      margin-left: 50%;
    }
    .offset-xl-7 {
      margin-left: 58.33333333%;
    }
    .offset-xl-8 {
      margin-left: 66.66666667%;
    }
    .offset-xl-9 {
      margin-left: 75%;
    }
    .offset-xl-10 {
      margin-left: 83.33333333%;
    }
    .offset-xl-11 {
      margin-left: 91.66666667%;
    }
    .g-xl-0,
    .gx-xl-0 {
      --bs-gutter-x:0;
    }
    .g-xl-0,
    .gy-xl-0 {
      --bs-gutter-y:0;
    }
    .g-xl-1,
    .gx-xl-1 {
      --bs-gutter-x:0.25rem;
    }
    .g-xl-1,
    .gy-xl-1 {
      --bs-gutter-y:0.25rem;
    }
    .g-xl-2,
    .gx-xl-2 {
      --bs-gutter-x:0.5rem;
    }
    .g-xl-2,
    .gy-xl-2 {
      --bs-gutter-y:0.5rem;
    }
    .g-xl-3,
    .gx-xl-3 {
      --bs-gutter-x:1rem;
    }
    .g-xl-3,
    .gy-xl-3 {
      --bs-gutter-y:1rem;
    }
    .g-xl-4,
    .gx-xl-4 {
      --bs-gutter-x:1.5rem;
    }
    .g-xl-4,
    .gy-xl-4 {
      --bs-gutter-y:1.5rem;
    }
    .g-xl-5,
    .gx-xl-5 {
      --bs-gutter-x:3rem;
    }
    .g-xl-5,
    .gy-xl-5 {
      --bs-gutter-y:3rem;
    }
  }
  @media (min-width: 1400px) {
    .col-xxl {
      flex: 1 0 0%;
    }
    .row-cols-xxl-auto > * {
      flex: 0 0 auto;
      width: auto;
    }
    .row-cols-xxl-1 > * {
      flex: 0 0 auto;
      width: 100%;
    }
    .row-cols-xxl-2 > * {
      flex: 0 0 auto;
      width: 50%;
    }
    .row-cols-xxl-3 > * {
      flex: 0 0 auto;
      width: 33.33333333%;
    }
    .row-cols-xxl-4 > * {
      flex: 0 0 auto;
      width: 25%;
    }
    .row-cols-xxl-5 > * {
      flex: 0 0 auto;
      width: 20%;
    }
    .row-cols-xxl-6 > * {
      flex: 0 0 auto;
      width: 16.66666667%;
    }
    .col-xxl-auto {
      flex: 0 0 auto;
      width: auto;
    }
    .col-xxl-1 {
      flex: 0 0 auto;
      width: 8.33333333%;
    }
    .col-xxl-2 {
      flex: 0 0 auto;
      width: 16.66666667%;
    }
    .col-xxl-3 {
      flex: 0 0 auto;
      width: 25%;
    }
    .col-xxl-4 {
      flex: 0 0 auto;
      width: 33.33333333%;
    }
    .col-xxl-5 {
      flex: 0 0 auto;
      width: 41.66666667%;
    }
    .col-xxl-6 {
      flex: 0 0 auto;
      width: 50%;
    }
    .col-xxl-7 {
      flex: 0 0 auto;
      width: 58.33333333%;
    }
    .col-xxl-8 {
      flex: 0 0 auto;
      width: 66.66666667%;
    }
    .col-xxl-9 {
      flex: 0 0 auto;
      width: 75%;
    }
    .col-xxl-10 {
      flex: 0 0 auto;
      width: 83.33333333%;
    }
    .col-xxl-11 {
      flex: 0 0 auto;
      width: 91.66666667%;
    }
    .col-xxl-12 {
      flex: 0 0 auto;
      width: 100%;
    }
    .offset-xxl-0 {
      margin-left: 0;
    }
    .offset-xxl-1 {
      margin-left: 8.33333333%;
    }
    .offset-xxl-2 {
      margin-left: 16.66666667%;
    }
    .offset-xxl-3 {
      margin-left: 25%;
    }
    .offset-xxl-4 {
      margin-left: 33.33333333%;
    }
    .offset-xxl-5 {
      margin-left: 41.66666667%;
    }
    .offset-xxl-6 {
      margin-left: 50%;
    }
    .offset-xxl-7 {
      margin-left: 58.33333333%;
    }
    .offset-xxl-8 {
      margin-left: 66.66666667%;
    }
    .offset-xxl-9 {
      margin-left: 75%;
    }
    .offset-xxl-10 {
      margin-left: 83.33333333%;
    }
    .offset-xxl-11 {
      margin-left: 91.66666667%;
    }
    .g-xxl-0,
    .gx-xxl-0 {
      --bs-gutter-x:0;
    }
    .g-xxl-0,
    .gy-xxl-0 {
      --bs-gutter-y:0;
    }
    .g-xxl-1,
    .gx-xxl-1 {
      --bs-gutter-x:0.25rem;
    }
    .g-xxl-1,
    .gy-xxl-1 {
      --bs-gutter-y:0.25rem;
    }
    .g-xxl-2,
    .gx-xxl-2 {
      --bs-gutter-x:0.5rem;
    }
    .g-xxl-2,
    .gy-xxl-2 {
      --bs-gutter-y:0.5rem;
    }
    .g-xxl-3,
    .gx-xxl-3 {
      --bs-gutter-x:1rem;
    }
    .g-xxl-3,
    .gy-xxl-3 {
      --bs-gutter-y:1rem;
    }
    .g-xxl-4,
    .gx-xxl-4 {
      --bs-gutter-x:1.5rem;
    }
    .g-xxl-4,
    .gy-xxl-4 {
      --bs-gutter-y:1.5rem;
    }
    .g-xxl-5,
    .gx-xxl-5 {
      --bs-gutter-x:3rem;
    }
    .g-xxl-5,
    .gy-xxl-5 {
      --bs-gutter-y:3rem;
    }
  }
  .d-inline {
    display: inline;
  }
  .d-inline-block {
    display: inline-block;
  }
  .d-block {
    display: block;
  }
  .d-grid {
    display: grid;
  }
  .d-inline-grid {
    display: inline-grid;
  }
  .d-table {
    display: table;
  }
  .d-table-row {
    display: table-row;
  }
  .d-table-cell {
    display: table-cell;
  }
  .d-flex {
    display: flex;
  }
  .d-inline-flex {
    display: inline-flex;
  }
  .d-none {
    display: none;
  }
  .flex-fill {
    flex: 1 1 auto;
  }
  .flex-row {
    flex-direction: row;
  }
  .flex-column {
    flex-direction: column;
  }
  .flex-row-reverse {
    flex-direction: row-reverse;
  }
  .flex-column-reverse {
    flex-direction: column-reverse;
  }
  .flex-grow-0 {
    flex-grow: 0;
  }
  .flex-grow-1 {
    flex-grow: 1;
  }
  .flex-shrink-0 {
    flex-shrink: 0;
  }
  .flex-shrink-1 {
    flex-shrink: 1;
  }
  .flex-wrap {
    flex-wrap: wrap;
  }
  .flex-nowrap {
    flex-wrap: nowrap;
  }
  .flex-wrap-reverse {
    flex-wrap: wrap-reverse;
  }
  .justify-content-start {
    justify-content: flex-start;
  }
  .justify-content-end {
    justify-content: flex-end;
  }
  .justify-content-center {
    justify-content: center;
  }
  .justify-content-between {
    justify-content: space-between;
  }
  .justify-content-around {
    justify-content: space-around;
  }
  .justify-content-evenly {
    justify-content: space-evenly;
  }
  .align-items-start {
    align-items: flex-start;
  }
  .align-items-end {
    align-items: flex-end;
  }
  .align-items-center {
    align-items: center;
  }
  .align-items-baseline {
    align-items: baseline;
  }
  .align-items-stretch {
    align-items: stretch;
  }
  .align-content-start {
    align-content: flex-start;
  }
  .align-content-end {
    align-content: flex-end;
  }
  .align-content-center {
    align-content: center;
  }
  .align-content-between {
    align-content: space-between;
  }
  .align-content-around {
    align-content: space-around;
  }
  .align-content-stretch {
    align-content: stretch;
  }
  .align-self-auto {
    align-self: auto;
  }
  .align-self-start {
    align-self: flex-start;
  }
  .align-self-end {
    align-self: flex-end;
  }
  .align-self-center {
    align-self: center;
  }
  .align-self-baseline {
    align-self: baseline;
  }
  .align-self-stretch {
    align-self: stretch;
  }
  .order-first {
    order: -1;
  }
  .order-0 {
    order: 0;
  }
  .order-1 {
    order: 1;
  }
  .order-2 {
    order: 2;
  }
  .order-3 {
    order: 3;
  }
  .order-4 {
    order: 4;
  }
  .order-5 {
    order: 5;
  }
  .order-last {
    order: 6;
  }
  .m-0 {
    margin: 0;
  }
  .m-1 {
    margin: 0.25rem;
  }
  .m-2 {
    margin: 0.5rem;
  }
  .m-3 {
    margin: 1rem;
  }
  .m-4 {
    margin: 1.5rem;
  }
  .m-5 {
    margin: 3rem;
  }
  .m-auto {
    margin: auto;
  }
  .mx-0 {
    margin-right: 0;
    margin-left: 0;
  }
  .mx-1 {
    margin-right: 0.25rem;
    margin-left: 0.25rem;
  }
  .mx-2 {
    margin-right: 0.5rem;
    margin-left: 0.5rem;
  }
  .mx-3 {
    margin-right: 1rem;
    margin-left: 1rem;
  }
  .mx-4 {
    margin-right: 1.5rem;
    margin-left: 1.5rem;
  }
  .mx-5 {
    margin-right: 3rem;
    margin-left: 3rem;
  }
  .mx-auto {
    margin-right: auto;
    margin-left: auto;
  }
  .my-0 {
    margin-top: 0;
    margin-bottom: 0;
  }
  .my-1 {
    margin-top: 0.25rem;
    margin-bottom: 0.25rem;
  }
  .my-2 {
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
  }
  .my-3 {
    margin-top: 1rem;
    margin-bottom: 1rem;
  }
  .my-4 {
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
  }
  .my-5 {
    margin-top: 3rem;
    margin-bottom: 3rem;
  }
  .my-auto {
    margin-top: auto;
    margin-bottom: auto;
  }
  .mt-0 {
    margin-top: 0;
  }
  .mt-1 {
    margin-top: 0.25rem;
  }
  .mt-2 {
    margin-top: 0.5rem;
  }
  .mt-3 {
    margin-top: 1rem;
  }
  .mt-4 {
    margin-top: 1.5rem;
  }
  .mt-5 {
    margin-top: 3rem;
  }
  .mt-auto {
    margin-top: auto;
  }
  .me-0 {
    margin-right: 0;
  }
  .me-1 {
    margin-right: 0.25rem;
  }
  .me-2 {
    margin-right: 0.5rem;
  }
  .me-3 {
    margin-right: 1rem;
  }
  .me-4 {
    margin-right: 1.5rem;
  }
  .me-5 {
    margin-right: 3rem;
  }
  .me-auto {
    margin-right: auto;
  }
  .mb-0 {
    margin-bottom: 0;
  }
  .mb-1 {
    margin-bottom: 0.25rem;
  }
  .mb-2 {
    margin-bottom: 0.5rem;
  }
  .mb-3 {
    margin-bottom: 1rem;
  }
  .mb-4 {
    margin-bottom: 1.5rem;
  }
  .mb-5 {
    margin-bottom: 3rem;
  }
  .mb-auto {
    margin-bottom: auto;
  }
  .ms-0 {
    margin-left: 0;
  }
  .ms-1 {
    margin-left: 0.25rem;
  }
  .ms-2 {
    margin-left: 0.5rem;
  }
  .ms-3 {
    margin-left: 1rem;
  }
  .ms-4 {
    margin-left: 1.5rem;
  }
  .ms-5 {
    margin-left: 3rem;
  }
  .ms-auto {
    margin-left: auto;
  }
  .p-0 {
    padding: 0;
  }
  .p-1 {
    padding: 0.25rem;
  }
  .p-2 {
    padding: 0.5rem;
  }
  .p-3 {
    padding: 1rem;
  }
  .p-4 {
    padding: 1.5rem;
  }
  .p-5 {
    padding: 3rem;
  }
  .px-0 {
    padding-right: 0;
    padding-left: 0;
  }
  .px-1 {
    padding-right: 0.25rem;
    padding-left: 0.25rem;
  }
  .px-2 {
    padding-right: 0.5rem;
    padding-left: 0.5rem;
  }
  .px-3 {
    padding-right: 1rem;
    padding-left: 1rem;
  }
  .px-4 {
    padding-right: 1.5rem;
    padding-left: 1.5rem;
  }
  .px-5 {
    padding-right: 3rem;
    padding-left: 3rem;
  }
  .py-0 {
    padding-top: 0;
    padding-bottom: 0;
  }
  .py-1 {
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
  }
  .py-2 {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
  }
  .py-3 {
    padding-top: 1rem;
    padding-bottom: 1rem;
  }
  .py-4 {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
  }
  .py-5 {
    padding-top: 3rem;
    padding-bottom: 3rem;
  }
  .pt-0 {
    padding-top: 0;
  }
  .pt-1 {
    padding-top: 0.25rem;
  }
  .pt-2 {
    padding-top: 0.5rem;
  }
  .pt-3 {
    padding-top: 1rem;
  }
  .pt-4 {
    padding-top: 1.5rem;
  }
  .pt-5 {
    padding-top: 3rem;
  }
  .pe-0 {
    padding-right: 0;
  }
  .pe-1 {
    padding-right: 0.25rem;
  }
  .pe-2 {
    padding-right: 0.5rem;
  }
  .pe-3 {
    padding-right: 1rem;
  }
  .pe-4 {
    padding-right: 1.5rem;
  }
  .pe-5 {
    padding-right: 3rem;
  }
  .pb-0 {
    padding-bottom: 0;
  }
  .pb-1 {
    padding-bottom: 0.25rem;
  }
  .pb-2 {
    padding-bottom: 0.5rem;
  }
  .pb-3 {
    padding-bottom: 1rem;
  }
  .pb-4 {
    padding-bottom: 1.5rem;
  }
  .pb-5 {
    padding-bottom: 3rem;
  }
  .ps-0 {
    padding-left: 0;
  }
  .ps-1 {
    padding-left: 0.25rem;
  }
  .ps-2 {
    padding-left: 0.5rem;
  }
  .ps-3 {
    padding-left: 1rem;
  }
  .ps-4 {
    padding-left: 1.5rem;
  }
  .ps-5 {
    padding-left: 3rem;
  }
  @media (min-width: 576px) {
    .d-sm-inline {
      display: inline;
    }
    .d-sm-inline-block {
      display: inline-block;
    }
    .d-sm-block {
      display: block;
    }
    .d-sm-grid {
      display: grid;
    }
    .d-sm-inline-grid {
      display: inline-grid;
    }
    .d-sm-table {
      display: table;
    }
    .d-sm-table-row {
      display: table-row;
    }
    .d-sm-table-cell {
      display: table-cell;
    }
    .d-sm-flex {
      display: flex;
    }
    .d-sm-inline-flex {
      display: inline-flex;
    }
    .d-sm-none {
      display: none;
    }
    .flex-sm-fill {
      flex: 1 1 auto;
    }
    .flex-sm-row {
      flex-direction: row;
    }
    .flex-sm-column {
      flex-direction: column;
    }
    .flex-sm-row-reverse {
      flex-direction: row-reverse;
    }
    .flex-sm-column-reverse {
      flex-direction: column-reverse;
    }
    .flex-sm-grow-0 {
      flex-grow: 0;
    }
    .flex-sm-grow-1 {
      flex-grow: 1;
    }
    .flex-sm-shrink-0 {
      flex-shrink: 0;
    }
    .flex-sm-shrink-1 {
      flex-shrink: 1;
    }
    .flex-sm-wrap {
      flex-wrap: wrap;
    }
    .flex-sm-nowrap {
      flex-wrap: nowrap;
    }
    .flex-sm-wrap-reverse {
      flex-wrap: wrap-reverse;
    }
    .justify-content-sm-start {
      justify-content: flex-start;
    }
    .justify-content-sm-end {
      justify-content: flex-end;
    }
    .justify-content-sm-center {
      justify-content: center;
    }
    .justify-content-sm-between {
      justify-content: space-between;
    }
    .justify-content-sm-around {
      justify-content: space-around;
    }
    .justify-content-sm-evenly {
      justify-content: space-evenly;
    }
    .align-items-sm-start {
      align-items: flex-start;
    }
    .align-items-sm-end {
      align-items: flex-end;
    }
    .align-items-sm-center {
      align-items: center;
    }
    .align-items-sm-baseline {
      align-items: baseline;
    }
    .align-items-sm-stretch {
      align-items: stretch;
    }
    .align-content-sm-start {
      align-content: flex-start;
    }
    .align-content-sm-end {
      align-content: flex-end;
    }
    .align-content-sm-center {
      align-content: center;
    }
    .align-content-sm-between {
      align-content: space-between;
    }
    .align-content-sm-around {
      align-content: space-around;
    }
    .align-content-sm-stretch {
      align-content: stretch;
    }
    .align-self-sm-auto {
      align-self: auto;
    }
    .align-self-sm-start {
      align-self: flex-start;
    }
    .align-self-sm-end {
      align-self: flex-end;
    }
    .align-self-sm-center {
      align-self: center;
    }
    .align-self-sm-baseline {
      align-self: baseline;
    }
    .align-self-sm-stretch {
      align-self: stretch;
    }
    .order-sm-first {
      order: -1;
    }
    .order-sm-0 {
      order: 0;
    }
    .order-sm-1 {
      order: 1;
    }
    .order-sm-2 {
      order: 2;
    }
    .order-sm-3 {
      order: 3;
    }
    .order-sm-4 {
      order: 4;
    }
    .order-sm-5 {
      order: 5;
    }
    .order-sm-last {
      order: 6;
    }
    .m-sm-0 {
      margin: 0;
    }
    .m-sm-1 {
      margin: 0.25rem;
    }
    .m-sm-2 {
      margin: 0.5rem;
    }
    .m-sm-3 {
      margin: 1rem;
    }
    .m-sm-4 {
      margin: 1.5rem;
    }
    .m-sm-5 {
      margin: 3rem;
    }
    .m-sm-auto {
      margin: auto;
    }
    .mx-sm-0 {
      margin-right: 0;
      margin-left: 0;
    }
    .mx-sm-1 {
      margin-right: 0.25rem;
      margin-left: 0.25rem;
    }
    .mx-sm-2 {
      margin-right: 0.5rem;
      margin-left: 0.5rem;
    }
    .mx-sm-3 {
      margin-right: 1rem;
      margin-left: 1rem;
    }
    .mx-sm-4 {
      margin-right: 1.5rem;
      margin-left: 1.5rem;
    }
    .mx-sm-5 {
      margin-right: 3rem;
      margin-left: 3rem;
    }
    .mx-sm-auto {
      margin-right: auto;
      margin-left: auto;
    }
    .my-sm-0 {
      margin-top: 0;
      margin-bottom: 0;
    }
    .my-sm-1 {
      margin-top: 0.25rem;
      margin-bottom: 0.25rem;
    }
    .my-sm-2 {
      margin-top: 0.5rem;
      margin-bottom: 0.5rem;
    }
    .my-sm-3 {
      margin-top: 1rem;
      margin-bottom: 1rem;
    }
    .my-sm-4 {
      margin-top: 1.5rem;
      margin-bottom: 1.5rem;
    }
    .my-sm-5 {
      margin-top: 3rem;
      margin-bottom: 3rem;
    }
    .my-sm-auto {
      margin-top: auto;
      margin-bottom: auto;
    }
    .mt-sm-0 {
      margin-top: 0;
    }
    .mt-sm-1 {
      margin-top: 0.25rem;
    }
    .mt-sm-2 {
      margin-top: 0.5rem;
    }
    .mt-sm-3 {
      margin-top: 1rem;
    }
    .mt-sm-4 {
      margin-top: 1.5rem;
    }
    .mt-sm-5 {
      margin-top: 3rem;
    }
    .mt-sm-auto {
      margin-top: auto;
    }
    .me-sm-0 {
      margin-right: 0;
    }
    .me-sm-1 {
      margin-right: 0.25rem;
    }
    .me-sm-2 {
      margin-right: 0.5rem;
    }
    .me-sm-3 {
      margin-right: 1rem;
    }
    .me-sm-4 {
      margin-right: 1.5rem;
    }
    .me-sm-5 {
      margin-right: 3rem;
    }
    .me-sm-auto {
      margin-right: auto;
    }
    .mb-sm-0 {
      margin-bottom: 0;
    }
    .mb-sm-1 {
      margin-bottom: 0.25rem;
    }
    .mb-sm-2 {
      margin-bottom: 0.5rem;
    }
    .mb-sm-3 {
      margin-bottom: 1rem;
    }
    .mb-sm-4 {
      margin-bottom: 1.5rem;
    }
    .mb-sm-5 {
      margin-bottom: 3rem;
    }
    .mb-sm-auto {
      margin-bottom: auto;
    }
    .ms-sm-0 {
      margin-left: 0;
    }
    .ms-sm-1 {
      margin-left: 0.25rem;
    }
    .ms-sm-2 {
      margin-left: 0.5rem;
    }
    .ms-sm-3 {
      margin-left: 1rem;
    }
    .ms-sm-4 {
      margin-left: 1.5rem;
    }
    .ms-sm-5 {
      margin-left: 3rem;
    }
    .ms-sm-auto {
      margin-left: auto;
    }
    .p-sm-0 {
      padding: 0;
    }
    .p-sm-1 {
      padding: 0.25rem;
    }
    .p-sm-2 {
      padding: 0.5rem;
    }
    .p-sm-3 {
      padding: 1rem;
    }
    .p-sm-4 {
      padding: 1.5rem;
    }
    .p-sm-5 {
      padding: 3rem;
    }
    .px-sm-0 {
      padding-right: 0;
      padding-left: 0;
    }
    .px-sm-1 {
      padding-right: 0.25rem;
      padding-left: 0.25rem;
    }
    .px-sm-2 {
      padding-right: 0.5rem;
      padding-left: 0.5rem;
    }
    .px-sm-3 {
      padding-right: 1rem;
      padding-left: 1rem;
    }
    .px-sm-4 {
      padding-right: 1.5rem;
      padding-left: 1.5rem;
    }
    .px-sm-5 {
      padding-right: 3rem;
      padding-left: 3rem;
    }
    .py-sm-0 {
      padding-top: 0;
      padding-bottom: 0;
    }
    .py-sm-1 {
      padding-top: 0.25rem;
      padding-bottom: 0.25rem;
    }
    .py-sm-2 {
      padding-top: 0.5rem;
      padding-bottom: 0.5rem;
    }
    .py-sm-3 {
      padding-top: 1rem;
      padding-bottom: 1rem;
    }
    .py-sm-4 {
      padding-top: 1.5rem;
      padding-bottom: 1.5rem;
    }
    .py-sm-5 {
      padding-top: 3rem;
      padding-bottom: 3rem;
    }
    .pt-sm-0 {
      padding-top: 0;
    }
    .pt-sm-1 {
      padding-top: 0.25rem;
    }
    .pt-sm-2 {
      padding-top: 0.5rem;
    }
    .pt-sm-3 {
      padding-top: 1rem;
    }
    .pt-sm-4 {
      padding-top: 1.5rem;
    }
    .pt-sm-5 {
      padding-top: 3rem;
    }
    .pe-sm-0 {
      padding-right: 0;
    }
    .pe-sm-1 {
      padding-right: 0.25rem;
    }
    .pe-sm-2 {
      padding-right: 0.5rem;
    }
    .pe-sm-3 {
      padding-right: 1rem;
    }
    .pe-sm-4 {
      padding-right: 1.5rem;
    }
    .pe-sm-5 {
      padding-right: 3rem;
    }
    .pb-sm-0 {
      padding-bottom: 0;
    }
    .pb-sm-1 {
      padding-bottom: 0.25rem;
    }
    .pb-sm-2 {
      padding-bottom: 0.5rem;
    }
    .pb-sm-3 {
      padding-bottom: 1rem;
    }
    .pb-sm-4 {
      padding-bottom: 1.5rem;
    }
    .pb-sm-5 {
      padding-bottom: 3rem;
    }
    .ps-sm-0 {
      padding-left: 0;
    }
    .ps-sm-1 {
      padding-left: 0.25rem;
    }
    .ps-sm-2 {
      padding-left: 0.5rem;
    }
    .ps-sm-3 {
      padding-left: 1rem;
    }
    .ps-sm-4 {
      padding-left: 1.5rem;
    }
    .ps-sm-5 {
      padding-left: 3rem;
    }
  }
  @media (min-width: 768px) {
    .d-md-inline {
      display: inline;
    }
    .d-md-inline-block {
      display: inline-block;
    }
    .d-md-block {
      display: block;
    }
    .d-md-grid {
      display: grid;
    }
    .d-md-inline-grid {
      display: inline-grid;
    }
    .d-md-table {
      display: table;
    }
    .d-md-table-row {
      display: table-row;
    }
    .d-md-table-cell {
      display: table-cell;
    }
    .d-md-flex {
      display: flex;
    }
    .d-md-inline-flex {
      display: inline-flex;
    }
    .d-md-none {
      display: none;
    }
    .flex-md-fill {
      flex: 1 1 auto;
    }
    .flex-md-row {
      flex-direction: row;
    }
    .flex-md-column {
      flex-direction: column;
    }
    .flex-md-row-reverse {
      flex-direction: row-reverse;
    }
    .flex-md-column-reverse {
      flex-direction: column-reverse;
    }
    .flex-md-grow-0 {
      flex-grow: 0;
    }
    .flex-md-grow-1 {
      flex-grow: 1;
    }
    .flex-md-shrink-0 {
      flex-shrink: 0;
    }
    .flex-md-shrink-1 {
      flex-shrink: 1;
    }
    .flex-md-wrap {
      flex-wrap: wrap;
    }
    .flex-md-nowrap {
      flex-wrap: nowrap;
    }
    .flex-md-wrap-reverse {
      flex-wrap: wrap-reverse;
    }
    .justify-content-md-start {
      justify-content: flex-start;
    }
    .justify-content-md-end {
      justify-content: flex-end;
    }
    .justify-content-md-center {
      justify-content: center;
    }
    .justify-content-md-between {
      justify-content: space-between;
    }
    .justify-content-md-around {
      justify-content: space-around;
    }
    .justify-content-md-evenly {
      justify-content: space-evenly;
    }
    .align-items-md-start {
      align-items: flex-start;
    }
    .align-items-md-end {
      align-items: flex-end;
    }
    .align-items-md-center {
      align-items: center;
    }
    .align-items-md-baseline {
      align-items: baseline;
    }
    .align-items-md-stretch {
      align-items: stretch;
    }
    .align-content-md-start {
      align-content: flex-start;
    }
    .align-content-md-end {
      align-content: flex-end;
    }
    .align-content-md-center {
      align-content: center;
    }
    .align-content-md-between {
      align-content: space-between;
    }
    .align-content-md-around {
      align-content: space-around;
    }
    .align-content-md-stretch {
      align-content: stretch;
    }
    .align-self-md-auto {
      align-self: auto;
    }
    .align-self-md-start {
      align-self: flex-start;
    }
    .align-self-md-end {
      align-self: flex-end;
    }
    .align-self-md-center {
      align-self: center;
    }
    .align-self-md-baseline {
      align-self: baseline;
    }
    .align-self-md-stretch {
      align-self: stretch;
    }
    .order-md-first {
      order: -1;
    }
    .order-md-0 {
      order: 0;
    }
    .order-md-1 {
      order: 1;
    }
    .order-md-2 {
      order: 2;
    }
    .order-md-3 {
      order: 3;
    }
    .order-md-4 {
      order: 4;
    }
    .order-md-5 {
      order: 5;
    }
    .order-md-last {
      order: 6;
    }
    .m-md-0 {
      margin: 0;
    }
    .m-md-1 {
      margin: 0.25rem;
    }
    .m-md-2 {
      margin: 0.5rem;
    }
    .m-md-3 {
      margin: 1rem;
    }
    .m-md-4 {
      margin: 1.5rem;
    }
    .m-md-5 {
      margin: 3rem;
    }
    .m-md-auto {
      margin: auto;
    }
    .mx-md-0 {
      margin-right: 0;
      margin-left: 0;
    }
    .mx-md-1 {
      margin-right: 0.25rem;
      margin-left: 0.25rem;
    }
    .mx-md-2 {
      margin-right: 0.5rem;
      margin-left: 0.5rem;
    }
    .mx-md-3 {
      margin-right: 1rem;
      margin-left: 1rem;
    }
    .mx-md-4 {
      margin-right: 1.5rem;
      margin-left: 1.5rem;
    }
    .mx-md-5 {
      margin-right: 3rem;
      margin-left: 3rem;
    }
    .mx-md-auto {
      margin-right: auto;
      margin-left: auto;
    }
    .my-md-0 {
      margin-top: 0;
      margin-bottom: 0;
    }
    .my-md-1 {
      margin-top: 0.25rem;
      margin-bottom: 0.25rem;
    }
    .my-md-2 {
      margin-top: 0.5rem;
      margin-bottom: 0.5rem;
    }
    .my-md-3 {
      margin-top: 1rem;
      margin-bottom: 1rem;
    }
    .my-md-4 {
      margin-top: 1.5rem;
      margin-bottom: 1.5rem;
    }
    .my-md-5 {
      margin-top: 3rem;
      margin-bottom: 3rem;
    }
    .my-md-auto {
      margin-top: auto;
      margin-bottom: auto;
    }
    .mt-md-0 {
      margin-top: 0;
    }
    .mt-md-1 {
      margin-top: 0.25rem;
    }
    .mt-md-2 {
      margin-top: 0.5rem;
    }
    .mt-md-3 {
      margin-top: 1rem;
    }
    .mt-md-4 {
      margin-top: 1.5rem;
    }
    .mt-md-5 {
      margin-top: 3rem;
    }
    .mt-md-auto {
      margin-top: auto;
    }
    .me-md-0 {
      margin-right: 0;
    }
    .me-md-1 {
      margin-right: 0.25rem;
    }
    .me-md-2 {
      margin-right: 0.5rem;
    }
    .me-md-3 {
      margin-right: 1rem;
    }
    .me-md-4 {
      margin-right: 1.5rem;
    }
    .me-md-5 {
      margin-right: 3rem;
    }
    .me-md-auto {
      margin-right: auto;
    }
    .mb-md-0 {
      margin-bottom: 0;
    }
    .mb-md-1 {
      margin-bottom: 0.25rem;
    }
    .mb-md-2 {
      margin-bottom: 0.5rem;
    }
    .mb-md-3 {
      margin-bottom: 1rem;
    }
    .mb-md-4 {
      margin-bottom: 1.5rem;
    }
    .mb-md-5 {
      margin-bottom: 3rem;
    }
    .mb-md-auto {
      margin-bottom: auto;
    }
    .ms-md-0 {
      margin-left: 0;
    }
    .ms-md-1 {
      margin-left: 0.25rem;
    }
    .ms-md-2 {
      margin-left: 0.5rem;
    }
    .ms-md-3 {
      margin-left: 1rem;
    }
    .ms-md-4 {
      margin-left: 1.5rem;
    }
    .ms-md-5 {
      margin-left: 3rem;
    }
    .ms-md-auto {
      margin-left: auto;
    }
    .p-md-0 {
      padding: 0;
    }
    .p-md-1 {
      padding: 0.25rem;
    }
    .p-md-2 {
      padding: 0.5rem;
    }
    .p-md-3 {
      padding: 1rem;
    }
    .p-md-4 {
      padding: 1.5rem;
    }
    .p-md-5 {
      padding: 3rem;
    }
    .px-md-0 {
      padding-right: 0;
      padding-left: 0;
    }
    .px-md-1 {
      padding-right: 0.25rem;
      padding-left: 0.25rem;
    }
    .px-md-2 {
      padding-right: 0.5rem;
      padding-left: 0.5rem;
    }
    .px-md-3 {
      padding-right: 1rem;
      padding-left: 1rem;
    }
    .px-md-4 {
      padding-right: 1.5rem;
      padding-left: 1.5rem;
    }
    .px-md-5 {
      padding-right: 3rem;
      padding-left: 3rem;
    }
    .py-md-0 {
      padding-top: 0;
      padding-bottom: 0;
    }
    .py-md-1 {
      padding-top: 0.25rem;
      padding-bottom: 0.25rem;
    }
    .py-md-2 {
      padding-top: 0.5rem;
      padding-bottom: 0.5rem;
    }
    .py-md-3 {
      padding-top: 1rem;
      padding-bottom: 1rem;
    }
    .py-md-4 {
      padding-top: 1.5rem;
      padding-bottom: 1.5rem;
    }
    .py-md-5 {
      padding-top: 3rem;
      padding-bottom: 3rem;
    }
    .pt-md-0 {
      padding-top: 0;
    }
    .pt-md-1 {
      padding-top: 0.25rem;
    }
    .pt-md-2 {
      padding-top: 0.5rem;
    }
    .pt-md-3 {
      padding-top: 1rem;
    }
    .pt-md-4 {
      padding-top: 1.5rem;
    }
    .pt-md-5 {
      padding-top: 3rem;
    }
    .pe-md-0 {
      padding-right: 0;
    }
    .pe-md-1 {
      padding-right: 0.25rem;
    }
    .pe-md-2 {
      padding-right: 0.5rem;
    }
    .pe-md-3 {
      padding-right: 1rem;
    }
    .pe-md-4 {
      padding-right: 1.5rem;
    }
    .pe-md-5 {
      padding-right: 3rem;
    }
    .pb-md-0 {
      padding-bottom: 0;
    }
    .pb-md-1 {
      padding-bottom: 0.25rem;
    }
    .pb-md-2 {
      padding-bottom: 0.5rem;
    }
    .pb-md-3 {
      padding-bottom: 1rem;
    }
    .pb-md-4 {
      padding-bottom: 1.5rem;
    }
    .pb-md-5 {
      padding-bottom: 3rem;
    }
    .ps-md-0 {
      padding-left: 0;
    }
    .ps-md-1 {
      padding-left: 0.25rem;
    }
    .ps-md-2 {
      padding-left: 0.5rem;
    }
    .ps-md-3 {
      padding-left: 1rem;
    }
    .ps-md-4 {
      padding-left: 1.5rem;
    }
    .ps-md-5 {
      padding-left: 3rem;
    }
  }
  @media (min-width: 992px) {
    .d-lg-inline {
      display: inline;
    }
    .d-lg-inline-block {
      display: inline-block;
    }
    .d-lg-block {
      display: block;
    }
    .d-lg-grid {
      display: grid;
    }
    .d-lg-inline-grid {
      display: inline-grid;
    }
    .d-lg-table {
      display: table;
    }
    .d-lg-table-row {
      display: table-row;
    }
    .d-lg-table-cell {
      display: table-cell;
    }
    .d-lg-flex {
      display: flex;
    }
    .d-lg-inline-flex {
      display: inline-flex;
    }
    .d-lg-none {
      display: none;
    }
    .flex-lg-fill {
      flex: 1 1 auto;
    }
    .flex-lg-row {
      flex-direction: row;
    }
    .flex-lg-column {
      flex-direction: column;
    }
    .flex-lg-row-reverse {
      flex-direction: row-reverse;
    }
    .flex-lg-column-reverse {
      flex-direction: column-reverse;
    }
    .flex-lg-grow-0 {
      flex-grow: 0;
    }
    .flex-lg-grow-1 {
      flex-grow: 1;
    }
    .flex-lg-shrink-0 {
      flex-shrink: 0;
    }
    .flex-lg-shrink-1 {
      flex-shrink: 1;
    }
    .flex-lg-wrap {
      flex-wrap: wrap;
    }
    .flex-lg-nowrap {
      flex-wrap: nowrap;
    }
    .flex-lg-wrap-reverse {
      flex-wrap: wrap-reverse;
    }
    .justify-content-lg-start {
      justify-content: flex-start;
    }
    .justify-content-lg-end {
      justify-content: flex-end;
    }
    .justify-content-lg-center {
      justify-content: center;
    }
    .justify-content-lg-between {
      justify-content: space-between;
    }
    .justify-content-lg-around {
      justify-content: space-around;
    }
    .justify-content-lg-evenly {
      justify-content: space-evenly;
    }
    .align-items-lg-start {
      align-items: flex-start;
    }
    .align-items-lg-end {
      align-items: flex-end;
    }
    .align-items-lg-center {
      align-items: center;
    }
    .align-items-lg-baseline {
      align-items: baseline;
    }
    .align-items-lg-stretch {
      align-items: stretch;
    }
    .align-content-lg-start {
      align-content: flex-start;
    }
    .align-content-lg-end {
      align-content: flex-end;
    }
    .align-content-lg-center {
      align-content: center;
    }
    .align-content-lg-between {
      align-content: space-between;
    }
    .align-content-lg-around {
      align-content: space-around;
    }
    .align-content-lg-stretch {
      align-content: stretch;
    }
    .align-self-lg-auto {
      align-self: auto;
    }
    .align-self-lg-start {
      align-self: flex-start;
    }
    .align-self-lg-end {
      align-self: flex-end;
    }
    .align-self-lg-center {
      align-self: center;
    }
    .align-self-lg-baseline {
      align-self: baseline;
    }
    .align-self-lg-stretch {
      align-self: stretch;
    }
    .order-lg-first {
      order: -1;
    }
    .order-lg-0 {
      order: 0;
    }
    .order-lg-1 {
      order: 1;
    }
    .order-lg-2 {
      order: 2;
    }
    .order-lg-3 {
      order: 3;
    }
    .order-lg-4 {
      order: 4;
    }
    .order-lg-5 {
      order: 5;
    }
    .order-lg-last {
      order: 6;
    }
    .m-lg-0 {
      margin: 0;
    }
    .m-lg-1 {
      margin: 0.25rem;
    }
    .m-lg-2 {
      margin: 0.5rem;
    }
    .m-lg-3 {
      margin: 1rem;
    }
    .m-lg-4 {
      margin: 1.5rem;
    }
    .m-lg-5 {
      margin: 3rem;
    }
    .m-lg-auto {
      margin: auto;
    }
    .mx-lg-0 {
      margin-right: 0;
      margin-left: 0;
    }
    .mx-lg-1 {
      margin-right: 0.25rem;
      margin-left: 0.25rem;
    }
    .mx-lg-2 {
      margin-right: 0.5rem;
      margin-left: 0.5rem;
    }
    .mx-lg-3 {
      margin-right: 1rem;
      margin-left: 1rem;
    }
    .mx-lg-4 {
      margin-right: 1.5rem;
      margin-left: 1.5rem;
    }
    .mx-lg-5 {
      margin-right: 3rem;
      margin-left: 3rem;
    }
    .mx-lg-auto {
      margin-right: auto;
      margin-left: auto;
    }
    .my-lg-0 {
      margin-top: 0;
      margin-bottom: 0;
    }
    .my-lg-1 {
      margin-top: 0.25rem;
      margin-bottom: 0.25rem;
    }
    .my-lg-2 {
      margin-top: 0.5rem;
      margin-bottom: 0.5rem;
    }
    .my-lg-3 {
      margin-top: 1rem;
      margin-bottom: 1rem;
    }
    .my-lg-4 {
      margin-top: 1.5rem;
      margin-bottom: 1.5rem;
    }
    .my-lg-5 {
      margin-top: 3rem;
      margin-bottom: 3rem;
    }
    .my-lg-auto {
      margin-top: auto;
      margin-bottom: auto;
    }
    .mt-lg-0 {
      margin-top: 0;
    }
    .mt-lg-1 {
      margin-top: 0.25rem;
    }
    .mt-lg-2 {
      margin-top: 0.5rem;
    }
    .mt-lg-3 {
      margin-top: 1rem;
    }
    .mt-lg-4 {
      margin-top: 1.5rem;
    }
    .mt-lg-5 {
      margin-top: 3rem;
    }
    .mt-lg-auto {
      margin-top: auto;
    }
    .me-lg-0 {
      margin-right: 0;
    }
    .me-lg-1 {
      margin-right: 0.25rem;
    }
    .me-lg-2 {
      margin-right: 0.5rem;
    }
    .me-lg-3 {
      margin-right: 1rem;
    }
    .me-lg-4 {
      margin-right: 1.5rem;
    }
    .me-lg-5 {
      margin-right: 3rem;
    }
    .me-lg-auto {
      margin-right: auto;
    }
    .mb-lg-0 {
      margin-bottom: 0;
    }
    .mb-lg-1 {
      margin-bottom: 0.25rem;
    }
    .mb-lg-2 {
      margin-bottom: 0.5rem;
    }
    .mb-lg-3 {
      margin-bottom: 1rem;
    }
    .mb-lg-4 {
      margin-bottom: 1.5rem;
    }
    .mb-lg-5 {
      margin-bottom: 3rem;
    }
    .mb-lg-auto {
      margin-bottom: auto;
    }
    .ms-lg-0 {
      margin-left: 0;
    }
    .ms-lg-1 {
      margin-left: 0.25rem;
    }
    .ms-lg-2 {
      margin-left: 0.5rem;
    }
    .ms-lg-3 {
      margin-left: 1rem;
    }
    .ms-lg-4 {
      margin-left: 1.5rem;
    }
    .ms-lg-5 {
      margin-left: 3rem;
    }
    .ms-lg-auto {
      margin-left: auto;
    }
    .p-lg-0 {
      padding: 0;
    }
    .p-lg-1 {
      padding: 0.25rem;
    }
    .p-lg-2 {
      padding: 0.5rem;
    }
    .p-lg-3 {
      padding: 1rem;
    }
    .p-lg-4 {
      padding: 1.5rem;
    }
    .p-lg-5 {
      padding: 3rem;
    }
    .px-lg-0 {
      padding-right: 0;
      padding-left: 0;
    }
    .px-lg-1 {
      padding-right: 0.25rem;
      padding-left: 0.25rem;
    }
    .px-lg-2 {
      padding-right: 0.5rem;
      padding-left: 0.5rem;
    }
    .px-lg-3 {
      padding-right: 1rem;
      padding-left: 1rem;
    }
    .px-lg-4 {
      padding-right: 1.5rem;
      padding-left: 1.5rem;
    }
    .px-lg-5 {
      padding-right: 3rem;
      padding-left: 3rem;
    }
    .py-lg-0 {
      padding-top: 0;
      padding-bottom: 0;
    }
    .py-lg-1 {
      padding-top: 0.25rem;
      padding-bottom: 0.25rem;
    }
    .py-lg-2 {
      padding-top: 0.5rem;
      padding-bottom: 0.5rem;
    }
    .py-lg-3 {
      padding-top: 1rem;
      padding-bottom: 1rem;
    }
    .py-lg-4 {
      padding-top: 1.5rem;
      padding-bottom: 1.5rem;
    }
    .py-lg-5 {
      padding-top: 3rem;
      padding-bottom: 3rem;
    }
    .pt-lg-0 {
      padding-top: 0;
    }
    .pt-lg-1 {
      padding-top: 0.25rem;
    }
    .pt-lg-2 {
      padding-top: 0.5rem;
    }
    .pt-lg-3 {
      padding-top: 1rem;
    }
    .pt-lg-4 {
      padding-top: 1.5rem;
    }
    .pt-lg-5 {
      padding-top: 3rem;
    }
    .pe-lg-0 {
      padding-right: 0;
    }
    .pe-lg-1 {
      padding-right: 0.25rem;
    }
    .pe-lg-2 {
      padding-right: 0.5rem;
    }
    .pe-lg-3 {
      padding-right: 1rem;
    }
    .pe-lg-4 {
      padding-right: 1.5rem;
    }
    .pe-lg-5 {
      padding-right: 3rem;
    }
    .pb-lg-0 {
      padding-bottom: 0;
    }
    .pb-lg-1 {
      padding-bottom: 0.25rem;
    }
    .pb-lg-2 {
      padding-bottom: 0.5rem;
    }
    .pb-lg-3 {
      padding-bottom: 1rem;
    }
    .pb-lg-4 {
      padding-bottom: 1.5rem;
    }
    .pb-lg-5 {
      padding-bottom: 3rem;
    }
    .ps-lg-0 {
      padding-left: 0;
    }
    .ps-lg-1 {
      padding-left: 0.25rem;
    }
    .ps-lg-2 {
      padding-left: 0.5rem;
    }
    .ps-lg-3 {
      padding-left: 1rem;
    }
    .ps-lg-4 {
      padding-left: 1.5rem;
    }
    .ps-lg-5 {
      padding-left: 3rem;
    }
  }
  @media (min-width: 1200px) {
    .d-xl-inline {
      display: inline;
    }
    .d-xl-inline-block {
      display: inline-block;
    }
    .d-xl-block {
      display: block;
    }
    .d-xl-grid {
      display: grid;
    }
    .d-xl-inline-grid {
      display: inline-grid;
    }
    .d-xl-table {
      display: table;
    }
    .d-xl-table-row {
      display: table-row;
    }
    .d-xl-table-cell {
      display: table-cell;
    }
    .d-xl-flex {
      display: flex;
    }
    .d-xl-inline-flex {
      display: inline-flex;
    }
    .d-xl-none {
      display: none;
    }
    .flex-xl-fill {
      flex: 1 1 auto;
    }
    .flex-xl-row {
      flex-direction: row;
    }
    .flex-xl-column {
      flex-direction: column;
    }
    .flex-xl-row-reverse {
      flex-direction: row-reverse;
    }
    .flex-xl-column-reverse {
      flex-direction: column-reverse;
    }
    .flex-xl-grow-0 {
      flex-grow: 0;
    }
    .flex-xl-grow-1 {
      flex-grow: 1;
    }
    .flex-xl-shrink-0 {
      flex-shrink: 0;
    }
    .flex-xl-shrink-1 {
      flex-shrink: 1;
    }
    .flex-xl-wrap {
      flex-wrap: wrap;
    }
    .flex-xl-nowrap {
      flex-wrap: nowrap;
    }
    .flex-xl-wrap-reverse {
      flex-wrap: wrap-reverse;
    }
    .justify-content-xl-start {
      justify-content: flex-start;
    }
    .justify-content-xl-end {
      justify-content: flex-end;
    }
    .justify-content-xl-center {
      justify-content: center;
    }
    .justify-content-xl-between {
      justify-content: space-between;
    }
    .justify-content-xl-around {
      justify-content: space-around;
    }
    .justify-content-xl-evenly {
      justify-content: space-evenly;
    }
    .align-items-xl-start {
      align-items: flex-start;
    }
    .align-items-xl-end {
      align-items: flex-end;
    }
    .align-items-xl-center {
      align-items: center;
    }
    .align-items-xl-baseline {
      align-items: baseline;
    }
    .align-items-xl-stretch {
      align-items: stretch;
    }
    .align-content-xl-start {
      align-content: flex-start;
    }
    .align-content-xl-end {
      align-content: flex-end;
    }
    .align-content-xl-center {
      align-content: center;
    }
    .align-content-xl-between {
      align-content: space-between;
    }
    .align-content-xl-around {
      align-content: space-around;
    }
    .align-content-xl-stretch {
      align-content: stretch;
    }
    .align-self-xl-auto {
      align-self: auto;
    }
    .align-self-xl-start {
      align-self: flex-start;
    }
    .align-self-xl-end {
      align-self: flex-end;
    }
    .align-self-xl-center {
      align-self: center;
    }
    .align-self-xl-baseline {
      align-self: baseline;
    }
    .align-self-xl-stretch {
      align-self: stretch;
    }
    .order-xl-first {
      order: -1;
    }
    .order-xl-0 {
      order: 0;
    }
    .order-xl-1 {
      order: 1;
    }
    .order-xl-2 {
      order: 2;
    }
    .order-xl-3 {
      order: 3;
    }
    .order-xl-4 {
      order: 4;
    }
    .order-xl-5 {
      order: 5;
    }
    .order-xl-last {
      order: 6;
    }
    .m-xl-0 {
      margin: 0;
    }
    .m-xl-1 {
      margin: 0.25rem;
    }
    .m-xl-2 {
      margin: 0.5rem;
    }
    .m-xl-3 {
      margin: 1rem;
    }
    .m-xl-4 {
      margin: 1.5rem;
    }
    .m-xl-5 {
      margin: 3rem;
    }
    .m-xl-auto {
      margin: auto;
    }
    .mx-xl-0 {
      margin-right: 0;
      margin-left: 0;
    }
    .mx-xl-1 {
      margin-right: 0.25rem;
      margin-left: 0.25rem;
    }
    .mx-xl-2 {
      margin-right: 0.5rem;
      margin-left: 0.5rem;
    }
    .mx-xl-3 {
      margin-right: 1rem;
      margin-left: 1rem;
    }
    .mx-xl-4 {
      margin-right: 1.5rem;
      margin-left: 1.5rem;
    }
    .mx-xl-5 {
      margin-right: 3rem;
      margin-left: 3rem;
    }
    .mx-xl-auto {
      margin-right: auto;
      margin-left: auto;
    }
    .my-xl-0 {
      margin-top: 0;
      margin-bottom: 0;
    }
    .my-xl-1 {
      margin-top: 0.25rem;
      margin-bottom: 0.25rem;
    }
    .my-xl-2 {
      margin-top: 0.5rem;
      margin-bottom: 0.5rem;
    }
    .my-xl-3 {
      margin-top: 1rem;
      margin-bottom: 1rem;
    }
    .my-xl-4 {
      margin-top: 1.5rem;
      margin-bottom: 1.5rem;
    }
    .my-xl-5 {
      margin-top: 3rem;
      margin-bottom: 3rem;
    }
    .my-xl-auto {
      margin-top: auto;
      margin-bottom: auto;
    }
    .mt-xl-0 {
      margin-top: 0;
    }
    .mt-xl-1 {
      margin-top: 0.25rem;
    }
    .mt-xl-2 {
      margin-top: 0.5rem;
    }
    .mt-xl-3 {
      margin-top: 1rem;
    }
    .mt-xl-4 {
      margin-top: 1.5rem;
    }
    .mt-xl-5 {
      margin-top: 3rem;
    }
    .mt-xl-auto {
      margin-top: auto;
    }
    .me-xl-0 {
      margin-right: 0;
    }
    .me-xl-1 {
      margin-right: 0.25rem;
    }
    .me-xl-2 {
      margin-right: 0.5rem;
    }
    .me-xl-3 {
      margin-right: 1rem;
    }
    .me-xl-4 {
      margin-right: 1.5rem;
    }
    .me-xl-5 {
      margin-right: 3rem;
    }
    .me-xl-auto {
      margin-right: auto;
    }
    .mb-xl-0 {
      margin-bottom: 0;
    }
    .mb-xl-1 {
      margin-bottom: 0.25rem;
    }
    .mb-xl-2 {
      margin-bottom: 0.5rem;
    }
    .mb-xl-3 {
      margin-bottom: 1rem;
    }
    .mb-xl-4 {
      margin-bottom: 1.5rem;
    }
    .mb-xl-5 {
      margin-bottom: 3rem;
    }
    .mb-xl-auto {
      margin-bottom: auto;
    }
    .ms-xl-0 {
      margin-left: 0;
    }
    .ms-xl-1 {
      margin-left: 0.25rem;
    }
    .ms-xl-2 {
      margin-left: 0.5rem;
    }
    .ms-xl-3 {
      margin-left: 1rem;
    }
    .ms-xl-4 {
      margin-left: 1.5rem;
    }
    .ms-xl-5 {
      margin-left: 3rem;
    }
    .ms-xl-auto {
      margin-left: auto;
    }
    .p-xl-0 {
      padding: 0;
    }
    .p-xl-1 {
      padding: 0.25rem;
    }
    .p-xl-2 {
      padding: 0.5rem;
    }
    .p-xl-3 {
      padding: 1rem;
    }
    .p-xl-4 {
      padding: 1.5rem;
    }
    .p-xl-5 {
      padding: 3rem;
    }
    .px-xl-0 {
      padding-right: 0;
      padding-left: 0;
    }
    .px-xl-1 {
      padding-right: 0.25rem;
      padding-left: 0.25rem;
    }
    .px-xl-2 {
      padding-right: 0.5rem;
      padding-left: 0.5rem;
    }
    .px-xl-3 {
      padding-right: 1rem;
      padding-left: 1rem;
    }
    .px-xl-4 {
      padding-right: 1.5rem;
      padding-left: 1.5rem;
    }
    .px-xl-5 {
      padding-right: 3rem;
      padding-left: 3rem;
    }
    .py-xl-0 {
      padding-top: 0;
      padding-bottom: 0;
    }
    .py-xl-1 {
      padding-top: 0.25rem;
      padding-bottom: 0.25rem;
    }
    .py-xl-2 {
      padding-top: 0.5rem;
      padding-bottom: 0.5rem;
    }
    .py-xl-3 {
      padding-top: 1rem;
      padding-bottom: 1rem;
    }
    .py-xl-4 {
      padding-top: 1.5rem;
      padding-bottom: 1.5rem;
    }
    .py-xl-5 {
      padding-top: 3rem;
      padding-bottom: 3rem;
    }
    .pt-xl-0 {
      padding-top: 0;
    }
    .pt-xl-1 {
      padding-top: 0.25rem;
    }
    .pt-xl-2 {
      padding-top: 0.5rem;
    }
    .pt-xl-3 {
      padding-top: 1rem;
    }
    .pt-xl-4 {
      padding-top: 1.5rem;
    }
    .pt-xl-5 {
      padding-top: 3rem;
    }
    .pe-xl-0 {
      padding-right: 0;
    }
    .pe-xl-1 {
      padding-right: 0.25rem;
    }
    .pe-xl-2 {
      padding-right: 0.5rem;
    }
    .pe-xl-3 {
      padding-right: 1rem;
    }
    .pe-xl-4 {
      padding-right: 1.5rem;
    }
    .pe-xl-5 {
      padding-right: 3rem;
    }
    .pb-xl-0 {
      padding-bottom: 0;
    }
    .pb-xl-1 {
      padding-bottom: 0.25rem;
    }
    .pb-xl-2 {
      padding-bottom: 0.5rem;
    }
    .pb-xl-3 {
      padding-bottom: 1rem;
    }
    .pb-xl-4 {
      padding-bottom: 1.5rem;
    }
    .pb-xl-5 {
      padding-bottom: 3rem;
    }
    .ps-xl-0 {
      padding-left: 0;
    }
    .ps-xl-1 {
      padding-left: 0.25rem;
    }
    .ps-xl-2 {
      padding-left: 0.5rem;
    }
    .ps-xl-3 {
      padding-left: 1rem;
    }
    .ps-xl-4 {
      padding-left: 1.5rem;
    }
    .ps-xl-5 {
      padding-left: 3rem;
    }
  }
  @media (min-width: 1400px) {
    .d-xxl-inline {
      display: inline;
    }
    .d-xxl-inline-block {
      display: inline-block;
    }
    .d-xxl-block {
      display: block;
    }
    .d-xxl-grid {
      display: grid;
    }
    .d-xxl-inline-grid {
      display: inline-grid;
    }
    .d-xxl-table {
      display: table;
    }
    .d-xxl-table-row {
      display: table-row;
    }
    .d-xxl-table-cell {
      display: table-cell;
    }
    .d-xxl-flex {
      display: flex;
    }
    .d-xxl-inline-flex {
      display: inline-flex;
    }
    .d-xxl-none {
      display: none;
    }
    .flex-xxl-fill {
      flex: 1 1 auto;
    }
    .flex-xxl-row {
      flex-direction: row;
    }
    .flex-xxl-column {
      flex-direction: column;
    }
    .flex-xxl-row-reverse {
      flex-direction: row-reverse;
    }
    .flex-xxl-column-reverse {
      flex-direction: column-reverse;
    }
    .flex-xxl-grow-0 {
      flex-grow: 0;
    }
    .flex-xxl-grow-1 {
      flex-grow: 1;
    }
    .flex-xxl-shrink-0 {
      flex-shrink: 0;
    }
    .flex-xxl-shrink-1 {
      flex-shrink: 1;
    }
    .flex-xxl-wrap {
      flex-wrap: wrap;
    }
    .flex-xxl-nowrap {
      flex-wrap: nowrap;
    }
    .flex-xxl-wrap-reverse {
      flex-wrap: wrap-reverse;
    }
    .justify-content-xxl-start {
      justify-content: flex-start;
    }
    .justify-content-xxl-end {
      justify-content: flex-end;
    }
    .justify-content-xxl-center {
      justify-content: center;
    }
    .justify-content-xxl-between {
      justify-content: space-between;
    }
    .justify-content-xxl-around {
      justify-content: space-around;
    }
    .justify-content-xxl-evenly {
      justify-content: space-evenly;
    }
    .align-items-xxl-start {
      align-items: flex-start;
    }
    .align-items-xxl-end {
      align-items: flex-end;
    }
    .align-items-xxl-center {
      align-items: center;
    }
    .align-items-xxl-baseline {
      align-items: baseline;
    }
    .align-items-xxl-stretch {
      align-items: stretch;
    }
    .align-content-xxl-start {
      align-content: flex-start;
    }
    .align-content-xxl-end {
      align-content: flex-end;
    }
    .align-content-xxl-center {
      align-content: center;
    }
    .align-content-xxl-between {
      align-content: space-between;
    }
    .align-content-xxl-around {
      align-content: space-around;
    }
    .align-content-xxl-stretch {
      align-content: stretch;
    }
    .align-self-xxl-auto {
      align-self: auto;
    }
    .align-self-xxl-start {
      align-self: flex-start;
    }
    .align-self-xxl-end {
      align-self: flex-end;
    }
    .align-self-xxl-center {
      align-self: center;
    }
    .align-self-xxl-baseline {
      align-self: baseline;
    }
    .align-self-xxl-stretch {
      align-self: stretch;
    }
    .order-xxl-first {
      order: -1;
    }
    .order-xxl-0 {
      order: 0;
    }
    .order-xxl-1 {
      order: 1;
    }
    .order-xxl-2 {
      order: 2;
    }
    .order-xxl-3 {
      order: 3;
    }
    .order-xxl-4 {
      order: 4;
    }
    .order-xxl-5 {
      order: 5;
    }
    .order-xxl-last {
      order: 6;
    }
    .m-xxl-0 {
      margin: 0;
    }
    .m-xxl-1 {
      margin: 0.25rem;
    }
    .m-xxl-2 {
      margin: 0.5rem;
    }
    .m-xxl-3 {
      margin: 1rem;
    }
    .m-xxl-4 {
      margin: 1.5rem;
    }
    .m-xxl-5 {
      margin: 3rem;
    }
    .m-xxl-auto {
      margin: auto;
    }
    .mx-xxl-0 {
      margin-right: 0;
      margin-left: 0;
    }
    .mx-xxl-1 {
      margin-right: 0.25rem;
      margin-left: 0.25rem;
    }
    .mx-xxl-2 {
      margin-right: 0.5rem;
      margin-left: 0.5rem;
    }
    .mx-xxl-3 {
      margin-right: 1rem;
      margin-left: 1rem;
    }
    .mx-xxl-4 {
      margin-right: 1.5rem;
      margin-left: 1.5rem;
    }
    .mx-xxl-5 {
      margin-right: 3rem;
      margin-left: 3rem;
    }
    .mx-xxl-auto {
      margin-right: auto;
      margin-left: auto;
    }
    .my-xxl-0 {
      margin-top: 0;
      margin-bottom: 0;
    }
    .my-xxl-1 {
      margin-top: 0.25rem;
      margin-bottom: 0.25rem;
    }
    .my-xxl-2 {
      margin-top: 0.5rem;
      margin-bottom: 0.5rem;
    }
    .my-xxl-3 {
      margin-top: 1rem;
      margin-bottom: 1rem;
    }
    .my-xxl-4 {
      margin-top: 1.5rem;
      margin-bottom: 1.5rem;
    }
    .my-xxl-5 {
      margin-top: 3rem;
      margin-bottom: 3rem;
    }
    .my-xxl-auto {
      margin-top: auto;
      margin-bottom: auto;
    }
    .mt-xxl-0 {
      margin-top: 0;
    }
    .mt-xxl-1 {
      margin-top: 0.25rem;
    }
    .mt-xxl-2 {
      margin-top: 0.5rem;
    }
    .mt-xxl-3 {
      margin-top: 1rem;
    }
    .mt-xxl-4 {
      margin-top: 1.5rem;
    }
    .mt-xxl-5 {
      margin-top: 3rem;
    }
    .mt-xxl-auto {
      margin-top: auto;
    }
    .me-xxl-0 {
      margin-right: 0;
    }
    .me-xxl-1 {
      margin-right: 0.25rem;
    }
    .me-xxl-2 {
      margin-right: 0.5rem;
    }
    .me-xxl-3 {
      margin-right: 1rem;
    }
    .me-xxl-4 {
      margin-right: 1.5rem;
    }
    .me-xxl-5 {
      margin-right: 3rem;
    }
    .me-xxl-auto {
      margin-right: auto;
    }
    .mb-xxl-0 {
      margin-bottom: 0;
    }
    .mb-xxl-1 {
      margin-bottom: 0.25rem;
    }
    .mb-xxl-2 {
      margin-bottom: 0.5rem;
    }
    .mb-xxl-3 {
      margin-bottom: 1rem;
    }
    .mb-xxl-4 {
      margin-bottom: 1.5rem;
    }
    .mb-xxl-5 {
      margin-bottom: 3rem;
    }
    .mb-xxl-auto {
      margin-bottom: auto;
    }
    .ms-xxl-0 {
      margin-left: 0;
    }
    .ms-xxl-1 {
      margin-left: 0.25rem;
    }
    .ms-xxl-2 {
      margin-left: 0.5rem;
    }
    .ms-xxl-3 {
      margin-left: 1rem;
    }
    .ms-xxl-4 {
      margin-left: 1.5rem;
    }
    .ms-xxl-5 {
      margin-left: 3rem;
    }
    .ms-xxl-auto {
      margin-left: auto;
    }
    .p-xxl-0 {
      padding: 0;
    }
    .p-xxl-1 {
      padding: 0.25rem;
    }
    .p-xxl-2 {
      padding: 0.5rem;
    }
    .p-xxl-3 {
      padding: 1rem;
    }
    .p-xxl-4 {
      padding: 1.5rem;
    }
    .p-xxl-5 {
      padding: 3rem;
    }
    .px-xxl-0 {
      padding-right: 0;
      padding-left: 0;
    }
    .px-xxl-1 {
      padding-right: 0.25rem;
      padding-left: 0.25rem;
    }
    .px-xxl-2 {
      padding-right: 0.5rem;
      padding-left: 0.5rem;
    }
    .px-xxl-3 {
      padding-right: 1rem;
      padding-left: 1rem;
    }
    .px-xxl-4 {
      padding-right: 1.5rem;
      padding-left: 1.5rem;
    }
    .px-xxl-5 {
      padding-right: 3rem;
      padding-left: 3rem;
    }
    .py-xxl-0 {
      padding-top: 0;
      padding-bottom: 0;
    }
    .py-xxl-1 {
      padding-top: 0.25rem;
      padding-bottom: 0.25rem;
    }
    .py-xxl-2 {
      padding-top: 0.5rem;
      padding-bottom: 0.5rem;
    }
    .py-xxl-3 {
      padding-top: 1rem;
      padding-bottom: 1rem;
    }
    .py-xxl-4 {
      padding-top: 1.5rem;
      padding-bottom: 1.5rem;
    }
    .py-xxl-5 {
      padding-top: 3rem;
      padding-bottom: 3rem;
    }
    .pt-xxl-0 {
      padding-top: 0;
    }
    .pt-xxl-1 {
      padding-top: 0.25rem;
    }
    .pt-xxl-2 {
      padding-top: 0.5rem;
    }
    .pt-xxl-3 {
      padding-top: 1rem;
    }
    .pt-xxl-4 {
      padding-top: 1.5rem;
    }
    .pt-xxl-5 {
      padding-top: 3rem;
    }
    .pe-xxl-0 {
      padding-right: 0;
    }
    .pe-xxl-1 {
      padding-right: 0.25rem;
    }
    .pe-xxl-2 {
      padding-right: 0.5rem;
    }
    .pe-xxl-3 {
      padding-right: 1rem;
    }
    .pe-xxl-4 {
      padding-right: 1.5rem;
    }
    .pe-xxl-5 {
      padding-right: 3rem;
    }
    .pb-xxl-0 {
      padding-bottom: 0;
    }
    .pb-xxl-1 {
      padding-bottom: 0.25rem;
    }
    .pb-xxl-2 {
      padding-bottom: 0.5rem;
    }
    .pb-xxl-3 {
      padding-bottom: 1rem;
    }
    .pb-xxl-4 {
      padding-bottom: 1.5rem;
    }
    .pb-xxl-5 {
      padding-bottom: 3rem;
    }
    .ps-xxl-0 {
      padding-left: 0;
    }
    .ps-xxl-1 {
      padding-left: 0.25rem;
    }
    .ps-xxl-2 {
      padding-left: 0.5rem;
    }
    .ps-xxl-3 {
      padding-left: 1rem;
    }
    .ps-xxl-4 {
      padding-left: 1.5rem;
    }
    .ps-xxl-5 {
      padding-left: 3rem;
    }
  }
  @media print {
    .d-print-inline {
      display: inline;
    }
    .d-print-inline-block {
      display: inline-block;
    }
    .d-print-block {
      display: block;
    }
    .d-print-grid {
      display: grid;
    }
    .d-print-inline-grid {
      display: inline-grid;
    }
    .d-print-table {
      display: table;
    }
    .d-print-table-row {
      display: table-row;
    }
    .d-print-table-cell {
      display: table-cell;
    }
    .d-print-flex {
      display: flex;
    }
    .d-print-inline-flex {
      display: inline-flex;
    }
    .d-print-none {
      display: none;
    }
  }
  *,
  *::before,
  *::after {
    box-sizing: border-box;
  }
  * {
    margin: 0;
    padding: 0;
  }
  *:not([type=password]) {
    font: inherit;
  }
  html {
    color-scheme: dark light;
  }
  img,
  picture,
  video {
    display: block;
    max-width: 100%;
  }
  ul {
    list-style: none;
    padding: 0;
    margin: 0;
  }
  a {
    text-decoration: none;
    transition: 0.2s all ease-in-out;
    cursor: pointer;
    color: inherit;
  }
  a:-webkit-any-link:focus-visible {
    outline: 0px;
  }
  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  p {
    margin: 0;
  }
  input:not([type=password]),
  textarea,
  button,
  select {
    font: inherit;
  }
}
@layer general {
  :root {
    --body-clr: initial;
    --body-bg: #F0F3FA;
    --body-fs: initial;
    --body-fw: initial;
    --body-ff-ar:
      ui-system,
      -apple-system,
      BlinkMacSystemFont,
      Segoe UI,
      sans-serif;
    --body-ff-en:
      ui-system,
      -apple-system,
      BlinkMacSystemFont,
      Segoe UI,
      sans-serif;
    --clr-primary: #0d6efd;
    --clr-secondary: #6c757d;
    --clr-third: #0dcaf0;
    --clr-success: #198754;
    --clr-warning: #ffc107;
    --clr-danger: #dc3545;
    --clr-info: #0dcaf0;
  }
  body {
    color: var(--body-clr, #333);
    font-size: var(--body-fs, 1rem);
    font-weight: var(--body-fw, 400);
    background: var(--body-bg, #EDECF2);
    font-family:
      ui-system,
      -apple-system,
      BlinkMacSystemFont,
      "Segoe UI",
      Roboto,
      Helvetica,
      Arial,
      sans-serif,
      "Apple Color Emoji",
      "Segoe UI Emoji",
      "Segoe UI Symbol";
  }
  html[dir=rtl] body {
    font-family:
      var(--body-ff-ar),
      ui-system,
      -apple-system,
      BlinkMacSystemFont,
      "Segoe UI",
      Roboto,
      Helvetica,
      Arial,
      sans-serif,
      "Apple Color Emoji",
      "Segoe UI Emoji",
      "Segoe UI Symbol";
  }
  html[dir=ltr] body {
    font-family:
      var(--body-ff-en),
      -apple-system,
      BlinkMacSystemFont,
      "Segoe UI",
      Roboto,
      Helvetica,
      Arial,
      sans-serif,
      "Apple Color Emoji",
      "Segoe UI Emoji",
      "Segoe UI Symbol";
  }
  .bp-template {
    background: #F0F3FA;
    padding: 3rem;
  }
  .bp-template-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    background: white;
    padding: 1rem 2rem;
  }
  .bp-template-header .bp-header-title {
    display: flex;
    align-items: center;
    gap: 2rem;
  }
  .bp-template-header .bp-header-title .bp-header-nav {
    display: flex;
    align-items: center;
    gap: 1rem;
  }
  .bp-template-header .bp-header-title .bp-header-nav li a {
    font-size: 1rem;
    font-weight: 500;
    color: #333;
  }
  .bp-template-header .bp-header-title .bp-header-nav li a:hover,
  .bp-template-header .bp-header-title .bp-header-nav li a.active {
    color: blue;
    text-decoration: underline;
  }
  .bp-template-content-wrapper {
    display: grid;
    grid-template-columns: 15rem 1fr 15rem;
    gap: 1rem;
    position: relative;
    height: 100%;
  }
  .bp-template-content-wrapper .bp-template-aside {
    padding-block: 2rem;
    padding-inline: 2rem;
    background: lightblue;
  }
  .bp-template-content-wrapper .bp-template-aside > ul {
    position: sticky;
    top: 1rem;
  }
  .bp-template-content-wrapper .bp-template-inner-menu {
    padding-block: 2rem;
    padding-inline: 1.5rem;
    background: lightblue;
  }
  .bp-template-content-wrapper .bp-template-inner-menu > ul {
    position: sticky;
    top: 1rem;
  }
  .bp-template-content-wrapper .bp-template-inner-menu > ul li a.active {
    font-weight: bold;
    color: var(--highlight-color, #007bff);
    position: relative;
  }
  .bp-template-content-wrapper .bp-template-inner-menu > ul li a.active::before {
    content: "";
    position: absolute;
    left: -8px;
    top: 50%;
    transform: translateY(-50%);
    width: 4px;
    height: 12px;
    background: currentColor;
    border-radius: 4px;
  }
  .bp-template-content-wrapper .bp-component-wrapper {
    padding-top: 2rem;
  }
  .bp-template-content-wrapper .bp-component-wrapper .bp-component-title {
    margin-bottom: 2rem;
  }
  .bp-template-content-wrapper .bp-component-wrapper .bp-component-title h2 {
    font-size: 2rem;
    font-weight: 700;
    text-transform: uppercase;
    color: darkblue;
    margin-bottom: 0.25rem;
  }
  .bp-template-content-wrapper .bp-component-wrapper .bp-component-title p {
    font-size: 1rem;
    font-weight: 500;
    color: #6c757d;
  }
  .bp-template-content-wrapper .bp-component-wrapper .bp-component-title p .component-class {
    color: darkblue;
    font-style: italic;
  }
  .bp-template-content-wrapper .bp-component-wrapper .bp-component-variant {
    padding-bottom: 2.25rem;
  }
  .bp-template-content-wrapper .bp-component-wrapper .bp-component-variant h3 {
    font-size: 1.5rem;
    font-weight: 600;
    color: #333;
    margin-bottom: 0.5rem;
  }
  .bp-template-content-wrapper .bp-component-wrapper .bp-component-variant p {
    font-size: 1rem;
    font-weight: 500;
    color: #6c757d;
  }
  .bp-template-content-wrapper .bp-component-wrapper .template-code {
    padding: 0.625rem;
    border: 1px dashed lightgray;
    border-radius: 0.375rem;
    background: white;
    margin-top: 0.875rem;
  }
  .bp-template-content-wrapper .bp-component-wrapper .template-code .preview {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 0.375rem;
    flex-wrap: wrap;
  }
  .bp-template-content-wrapper .bp-component-wrapper .template-code .preview .preview-item {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    min-width: max-content;
  }
  .bp-template-content-wrapper .bp-component-wrapper .template-code .preview .preview-item .preview-actions {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.25rem;
  }
  .bp-template-content-wrapper .bp-component-wrapper .template-code .preview .preview-item .preview-actions .copy-btn {
    outline: 0;
    border: 0;
    padding: 2px;
    width: 1.3125rem;
    height: 1.3125rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    color: dimgrey;
    cursor: pointer;
    line-height: 1;
  }
  .bp-template-content-wrapper .bp-component-wrapper .template-code .preview .preview-item .preview-actions .copy-btn.code-copied .copy-icon,
  .bp-template-content-wrapper .bp-component-wrapper .template-code .preview .preview-item .preview-actions .copy-btn:has(.code-copied) .copy-icon {
    display: none;
  }
  .bp-template-content-wrapper .bp-component-wrapper .template-code .preview .preview-item .preview-actions .copy-btn.code-copied .check-icon,
  .bp-template-content-wrapper .bp-component-wrapper .template-code .preview .preview-item .preview-actions .copy-btn:has(.code-copied) .check-icon {
    color: green;
  }
  .bp-template-content-wrapper .bp-component-wrapper .template-code .preview .preview-item .preview-actions .copy-btn:not(.code-copied, :has(.code-copied)) .check-icon {
    display: none;
  }
  .bp-template-content-wrapper .bp-component-wrapper .template-code .preview .preview-item .preview-actions .view-btn {
    outline: 0;
    border: 0;
    padding: 2px;
    width: 1.3125rem;
    height: 1.3125rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    color: dimgrey;
    cursor: pointer;
    line-height: 1;
  }
  .bp-template-content-wrapper .bp-component-wrapper .template-code .preview .preview-item .preview-actions .view-btn.view-opened .view-icon,
  .bp-template-content-wrapper .bp-component-wrapper .template-code .preview .preview-item .preview-actions .view-btn:has(.view-opened) .view-icon {
    display: none;
  }
  .bp-template-content-wrapper .bp-component-wrapper .template-code .preview .preview-item .preview-actions .view-btn.view-opened .hide-icon,
  .bp-template-content-wrapper .bp-component-wrapper .template-code .preview .preview-item .preview-actions .view-btn:has(.view-opened) .hide-icon {
    color: dimgrey;
  }
  .bp-template-content-wrapper .bp-component-wrapper .template-code .preview .preview-item .preview-actions .view-btn:not(.view-opened, :has(.view-opened)) .hide-icon {
    display: none;
  }
  .bp-template-content-wrapper .bp-component-wrapper .template-code .html-code {
    position: relative;
    background: #1f1f1f;
    border-radius: 0.375rem;
    color: #e1dfdf;
    transition: max-height 0.3s ease, opacity 0.3s ease;
  }
  .bp-template-content-wrapper .bp-component-wrapper .template-code .html-code:not(.show) {
    overflow: hidden;
    max-height: 0;
    opacity: 0;
  }
  .bp-template-content-wrapper .bp-component-wrapper .template-code .html-code:not(.show) .code-item {
    width: 0;
  }
  .bp-template-content-wrapper .bp-component-wrapper .template-code .html-code.show,
  .bp-template-content-wrapper .bp-component-wrapper .template-code .html-code.show-only {
    padding: 0.5rem 1rem;
    height: auto;
    max-height: 1000px;
    opacity: 1;
  }
  .bp-template-content-wrapper .bp-component-wrapper .template-code .html-code.show .code-item,
  .bp-template-content-wrapper .bp-component-wrapper .template-code .html-code.show-only .code-item {
    width: auto;
  }
  .bp-template-content-wrapper .bp-component-wrapper .template-code .html-code.show .close-btn,
  .bp-template-content-wrapper .bp-component-wrapper .template-code .html-code.show-only .close-btn {
    inset-inline-end: -1.25rem;
  }
  .bp-template-content-wrapper .bp-component-wrapper .template-code .html-code .close-btn {
    outline: 0;
    border: 0;
    padding: 4px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: lightcoral;
    color: darkred;
    cursor: pointer;
    border-radius: 0.25rem;
    aspect-ratio: 1/1;
    position: absolute;
    inset-inline-end: 0;
    transition: 0.5s inset ease-in-out;
  }
  .bp-template-content-wrapper .bp-component-wrapper .template-code .html-code .code-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
  }
  .bp-template .grid-col {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 10px;
  }
  .bp-template .grid-col .example-wrapper {
    margin-block: 0;
  }
  .bp-template .grid-col .example-code,
  .bp-template .grid-col #example > .example-header {
    display: none !important;
  }
  .bp-template .svg-card {
    display: grid;
    place-items: center;
    gap: 10px;
    min-height: 100px;
  }
  .bp-template .svg-card .svg-icon {
    border-radius: 8px;
    background: #dde1eb;
    padding: 10px;
  }
  .bp-template .svg-card .svg-icon svg {
    max-height: 50px;
    width: auto;
    object-fit: contain;
    color: #333;
  }
  .bp-template .svg-card p {
    font-size: 14px;
    font-weight: 500;
    color: #333;
  }
  .container-grid {
    --padding-inline: 1rem;
    --content-max-width: 900px;
    --breakout-max-width: 1200px;
    --content-padding: min(100% - (var(--padding-inline) * 2), calc(var(--content-max-width)/2));
    --breakout-width: calc((var(--breakout-max-width) - var(--content-max-width)) / 2);
    display: grid;
    grid-template-columns: [full-width-start] minmax(var(--padding-inline), 1fr) [breakout-start] minmax(0, var(--breakout-width)) [content-start] var(--content-padding) [split-middle] var(--content-padding) [content-end] minmax(0, var(--breakout-width)) [breakout-end] minmax(var(--padding-inline), 1fr) [full-width-end];
  }
  .container-grid > :not(.breakout, .full-width) {
    grid-column: content;
  }
  .container-grid .grid-split {
    grid-template-columns: inherit;
  }
  .container-grid.grid-split,
  .container-grid .grid-split {
    --split-first-block-startpoint: content-start;
    --split-first-block-endpoint: split-middle;
    --split-last-block-startpoint: split-middle;
    --split-last-block-endpoint: content-end;
  }
  .container-grid.grid-split > *,
  .container-grid .grid-split > * {
    display: grid;
    align-content: center;
    justify-items: start;
    height: 100%;
  }
  .container-grid.grid-split > :first-child,
  .container-grid .grid-split > :first-child {
    grid-column-start: var(--split-first-block-startpoint);
    grid-column-end: var(--split-first-block-endpoint);
  }
  .container-grid.grid-split > :first-child.breakout,
  .container-grid .grid-split > :first-child.breakout {
    --split-first-block-startpoint: breakout-start;
  }
  .container-grid.grid-split > :last-child,
  .container-grid .grid-split > :last-child {
    grid-column-start: var(--split-last-block-startpoint);
    grid-column-end: var(--split-last-block-endpoint);
  }
  .container-grid.grid-split > :last-child.breakout,
  .container-grid .grid-split > :last-child.breakout {
    --split-last-block-endpoint: breakout-end;
  }
  .text-trim {
    --txtsplit-maxwidth: 21ch;
    max-width: var(--txtsplit-maxwidth, 21ch);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .line-trim {
    --trim-lines-nubmers: 2;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: var(--trim-lines-nubmers, 2);
    line-clamp: var(--trim-lines-nubmers, 2);
    -webkit-box-orient: vertical;
  }
  .separator {
    --separator-height: 1px;
    --separator-bg: gray;
    height: var(--separator-height, 1px);
    background: var(--separator-bg, gray);
  }
  .svg-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  .scroll {
    padding-inline-end: var(--scroll-padding-istart);
    max-height: var(--scroll-min-height);
    object-fit: contain;
    overflow: hidden;
    overflow-y: auto;
    scrollbar-width: auto;
    scrollbar-color: var(--scroll-clr);
  }
  .scroll::-webkit-scrollbar {
    width: var(--scroll-width);
  }
  .scroll::-webkit-scrollbar-track {
    background: var(--scroll-bg);
    border-radius: var(--scroll-border-radius);
  }
  .scroll::-webkit-scrollbar-thumb {
    background-clip: content-box;
    background-color: var(--scroll-clr);
    border: var(--scroll-border-width) var(--scroll-border-style) var(--scroll-border-clr);
    border-radius: var(--scroll-thumb-border-radius);
  }
  .scroll {
    --scroll-min-height: 100px;
    --scroll-padding-istart: 10px;
    --scroll-bg: #E5EEF9;
    --scroll-border-radius: 8px;
    --scroll-clr: var(--clr-primary);
    --scroll-width: 6px;
    --scroll-border-width: 0px;
    --scroll-border-style: solid;
    --scroll-border-clr: var(--clr-primary);
    --scroll-track-border-radius: 8px;
    --scroll-thumb-border-radius: 8px;
  }
  @-moz-document url-prefix() {
    *,
    html,
    body {
      scrollbar-width: thin;
      scrollbar-color: #909090 #505152;
    }
  }
}
@layer layout {
  @layer main, grid, containers, extras;
  @layer main {
    .wrapper {
      position: relative;
      transition: 0.2s all ease-in-out;
      padding-inline: 24px;
      padding-block: 24px;
    }
    .wrapper .container-fluid {
      padding-inline: 0;
    }
    .flex-root {
      display: flex;
      -webkit-box-flex: 1;
      -ms-flex: 1 0 0;
      flex: 1;
      min-height: 100vh;
    }
    .flex-root .flex-column-fluid {
      display: flex;
      -webkit-box-flex: 1;
      -ms-flex: 1 0 auto;
      flex: 1 0 auto;
      flex-direction: column;
    }
    .flex-root .flex-column-fluid.flex-shrink {
      flex-shrink: 1;
    }
    .flex-root .flex-row-fluid {
      display: flex;
      -webkit-box-flex: 1;
      -ms-flex: 1 0 0;
      flex: 1 auto;
      min-width: 0;
    }
    .flex-root .flex-row-auto {
      display: flex;
      -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
      flex: 0 0 auto;
    }
  }
  @layer grid {
  }
  @layer containers {
  }
  @layer extras {
    body:has(.het-spinner) {
      overflow: hidden;
    }
    .het-spinner {
      position: fixed;
      width: 100vw;
      height: 100vh;
      inset: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      z-index: 2000;
    }
    .het-spinner > .overlay {
      position: fixed;
      width: 100vw;
      height: 100vh;
      inset: 0;
      opacity: 1;
      background-color: var(--spinner-overlay-bg, rgba(249, 252, 254, 0.33));
      -webkit-backdrop-filter: blur(37px) brightness(106%);
      backdrop-filter: blur(37px) brightness(106%);
    }
    .het-spinner > img {
      width: var(--spinner-img-width, 150px);
      z-index: 2001;
    }
    .het-spinner svg {
      z-index: 1060;
      width: var(--spinner-svg-width, 200px);
      height: auto;
    }
    .scrolltop {
      position: fixed;
      opacity: 0;
      display: none;
      justify-content: center;
      align-items: center;
      width: var(--scrolltop-width, 2rem);
      height: var(--scrolltop-height, 2rem);
      bottom: var(--scrolltop-inset-bottom, 2.5rem);
      inset-inline-end: var(--scrolltop-inset-end, 1.5rem);
      cursor: pointer;
      z-index: var(--scrolltop-z-index, 101);
      background-color: var(--scrolltop-bg, #1769CC);
      box-shadow: var(--scrolltop-shadowbox, 0 5px 15px 5px rgba(0, 0, 0, 0.075));
      transition:
        color 0.15s ease,
        background-color 0.15s ease,
        border-color 0.15s ease,
        box-shadow 0.15s ease;
      border-width: var(--scrolltop-border-width, 1px);
      border-style: var(--scrolltop-border-style, solid);
      border-color: var(--scrolltop-border-clr, transparent);
      border-radius: var(--scrolltop-border-radius, 0.5rem);
    }
    .scrolltop {
      --scrolltop-width: 2.5rem;
      --scrolltop-height: 2.5rem;
      --scrolltop-inset-bottom: 2.5rem;
      --scrolltop-inset-end: 2.5rem;
      --scrolltop-z-index: 101;
      --scrolltop-bg: #1769CC;
      --scrolltop-shadowbox: 0 5px 15px 5px rgba(0, 0, 0, 0.075);
      --scrolltop-border-width: 1px;
      --scrolltop-border-style: solid;
      --scrolltop-border-clr: transparent;
      --scrolltop-border-radius: 0.5rem;
      --scrolltop-opacity: 0.5;
      --scrolltop-hover-opacity: 1;
      --scrolltop-icon-width: 1rem;
      --scrolltop-icon-height: 1rem;
      --scrolltop-icon-clr: white;
    }
    [data-scrolltop=on] .scrolltop {
      opacity: var(--scrolltop-opacity, 0.3);
      -webkit-animation: animation-scrolltop 0.4s ease-out 1;
      animation: animation-scrolltop 0.4s ease-out 1;
      display: flex;
    }
    [data-scrolltop=on] .scrolltop:hover {
      transition:
        color 0.15s ease,
        background-color 0.15s ease,
        border-color 0.15s ease,
        box-shadow 0.15s ease;
      opacity: var(--scrolltop-hover-opacity, 1);
    }
    .scrolltop svg {
      width: var(--scrolltop-icon-width, 1.5rem);
      height: var(--scrolltop-icon-height, 1.5rem);
    }
    .scrolltop svg [fill] {
      transition: fill 0.3s ease;
      fill: var(--scrolltop-icon-clr, white);
    }
    .scrolltop svg:hover [fill] {
      transition: fill 0.3s ease;
    }
    .scrolltop:hover svg [fill] {
      transition: fill 0.3s ease;
      fill: var(--scrolltop-icon-clr, white);
    }
    .scrolltop:hover svg:hover [fill] {
      transition: fill 0.3s ease;
    }
    @media (max-width: 991.98px) {
      .scrolltop {
        bottom: calc(var(--scrolltop-inset-bottom) - 1rem);
        inset-inline-end: calc(var(--scrolltop-inset-end) - 0.5rem);
      }
    }
    @-webkit-keyframes animation-scrolltop {
      0% {
        margin-bottom: -1rem;
      }
      to {
        margin-bottom: 0;
      }
    }
    @keyframes animation-scrolltop {
      0% {
        margin-bottom: -1rem;
      }
      to {
        margin-bottom: 0;
      }
    }
  }
}
@layer components {
  @layer avatars, tags, alerts, buttons, cards, chips, labels, forms, tables, pagination, tablists, progressbar, tooltips, dropdown, breadcrumbs, panel, menuPanel, menu, modals, fileUpload, sliderRange, toast, stepper, editor;
  @layer avatars {
    .p-avatar {
      background-color: var(--avatar-bg, #dee2e6) !important;
      border-radius: var(--avatar-border-radius, 6px) !important;
      width: var(--avatar-width, 3rem) !important;
      height: var(--avatar-height, 3rem) !important;
      font-size: var(--avatar-fs, 1.5rem !important);
    }
    .p-avatar.p-avatar-circle {
      border-radius: 100% !important;
    }
    .p-avatar.p-avatar-image {
      background-color: transparent !important;
    }
    .p-avatar .p-avatar-icon {
      font-size: var(--avatar-icon-fs, 1.5rem) !important;
    }
    .p-avatar.p-avatar-lg {
      width: var(--avatar-lg-width, 3rem) !important;
      height: var(--avatar-lg-height, 3rem) !important;
      font-size: var(--avatar-lg-fs, 1.5rem) !important;
    }
    .p-avatar.p-avatar-lg .p-avatar-icon {
      font-size: var(--avatar-lg-icon-fs, 1.5rem) !important;
    }
    .p-avatar.p-avatar-xl {
      width: var(--avatar-xl-width, 4rem) !important;
      height: var(--avatar-xl-height, 4rem) !important;
      font-size: var(--avatar-xl-fs, 2rem) !important;
    }
    .p-avatar.p-avatar-xl .p-avatar-icon {
      font-size: var(--avatar-xl-icon-fs, 2rem) !important;
    }
    .p-avatar-group > .p-avatar {
      border: var(--avatar-group-border-width, 2px) var(--avatar-group-border-style, solid) var(--avatar-group-border-clr, white) !important;
    }
    .p-avatar {
      --avatar-bg: #dee2e6;
      --avatar-border-radius: 6px;
      --avatar-width: 2rem;
      --avatar-height: 2rem;
      --avatar-fs: 1rem;
      --avatar-icon-fs: 1rem;
      --avatar-lg-width: 3rem;
      --avatar-lg-height: 3rem;
      --avatar-lg-fs: 1.5rem;
      --avatar-lg-icon-fs: 1.5rem;
      --avatar-xl-width: 4rem;
      --avatar-xl-height: 4rem;
      --avatar-xl-fs: 2rem;
      --avatar-xl-icon-fs: 2rem;
      --avatar-group-border-width: 2px --avatar-group-border-style: solid;
      --avatar-group-border-clr: white;
    }
  }
  @layer tags {
    .p-tag {
      background: var(--ptag-bg, var(--clr-primary));
      color: var(--ptag-clr, white);
      font-size: var(--ptag-fs, 0.75rem);
      font-weight: var(--ptag-fw, 700);
      line-height: var(--ptag-lh, 12.62px);
      padding-block: var(--ptag-py, 0.25rem);
      padding-inline: var(--ptag-px, 0.4rem);
      border-radius: var(--ptag-border-radius, 6px);
      gap: var(--ptag-gap, 0);
    }
    .p-tag.p-tag-rounded {
      border-radius: var(--ptag-rounded-border-radius, 40vw);
    }
    .p-tag {
      --ptag-bg: var(--clr-primary);
      --ptag-clr: white;
      --ptag-fs: 0.75rem;
      --ptag-fw: 400;
      --ptag-lh: 1.125rem;
      --ptag-py: 0.25rem;
      --ptag-px: 0.4rem;
      --ptag-border-radius: 0.5rem;
      --ptag-rounded-border-radius: 40vw;
      --ptag-gap: 0;
    }
  }
  @layer alerts {
    .p-message {
      outline-width: 0;
      box-shadow: 0;
      border-radius: var(--palert-border-radius, 6px);
    }
    .p-message .p-message-content {
      justify-content: var(--palert-content-align, space-between);
      gap: var(--palert-content-gap, 0);
      margin-block: var(--palert-my, 0);
      margin-inline: var(--palert-mx, 0);
      padding-block: var(--palert-py, 0.625rem);
      padding-inline: var(--palert-px, 0.75rem);
      color: var(--palert-clr, #696cff);
      background: var(--palert-bg, #e9e9ff);
      border-width: var(--palert-border-width, 1px);
      border-color: var(--palert-border-clr, transparent);
      border-style: var(--palert-border-style, solid);
      border-radius: var(--palert-border-radius, 6px);
    }
    .p-message .p-message-content > :not(.p-message-text):has(> .p-message-text:empty) {
      display: none;
    }
    .p-message .p-message-content .p-message-text {
      display: inline-flex;
      align-items: center;
      gap: var(--palert-text-gap, 0.5rem);
    }
    .p-message .p-message-content .p-message-text .svg-icon svg {
      width: auto;
      height: var(--palert-svg-height, 20px);
      color: var(--palert-svg-clr, #424B59);
    }
    .p-message .p-message-content .p-message-text p {
      font-size: var(--palert-content-fs, 0.875rem);
      font-weight: var(--palert-content-fw, 400);
      line-height: var(--palert-content-lh, 1.0625rem);
      color: var(--palert-content-clr, #424B59);
    }
    .p-message .p-message-content .p-message-close-button {
      width: var(--palert-close-width, 2rem);
      height: var(--palert-close-height, 2rem);
      border-width: var(--palert-close-border-width, 1px);
      border-color: var(--palert-close-border-clr, transparent);
      border-style: var(--palert-close-border-style, solid);
      border-radius: var(--palert-close-border-radius, 50%);
      background: var(--palert-close-bg, transparent);
      color: var(--palert-close-clr, inherit);
      padding-block: var(--palert-close-py, 1.25rem);
      padding-inline: var(--palert-close-px, 1.75rem);
    }
    .p-message .p-message-content .p-message-close-button:hover {
      background: var(--palert-close-hover-bg, lightblue);
      color: var(--palert-close-hover-clr, inherit);
    }
    .p-message .p-message-content .p-message-close-button:focus-visible {
      outline: 0 none;
      outline-offset: 0;
      box-shadow: 0 0 0 0.2rem #BFDBFE;
    }
    .p-message.p-message-info {
      --palert-clr: var(--palert-info-clr);
      --palert-bg: var(--palert-info-bg);
      --palert-border-clr: var(--palert-info-border-clr);
      --palert-svg-clr: var(--palert-info-svg-clr);
      --palert-content-clr: var(--palert-info-content-clr);
      --palert-close-clr: var(--palert-info-close-clr);
    }
    .p-message.p-message-success {
      --palert-clr: var(--palert-success-clr);
      --palert-bg: var(--palert-success-bg);
      --palert-border-clr: var(--palert-success-border-clr);
      --palert-svg-clr: var(--palert-success-svg-clr);
      --palert-content-clr: var(--palert-success-content-clr);
      --palert-close-clr: var(--palert-success-close-clr);
    }
    .p-message.p-message-warning {
      --palert-clr: var(--palert-warning-clr);
      --palert-bg: var(--palert-warning-bg);
      --palert-border-clr: var(--palert-warning-border-clr);
      --palert-svg-clr: var(--palert-warning-svg-clr);
      --palert-content-clr: var(--palert-warning-content-clr);
      --palert-close-clr: var(--palert-warning-close-clr);
    }
    .p-message.p-message-error {
      --palert-clr: var(--palert-error-clr);
      --palert-bg: var(--palert-error-bg);
      --palert-border-clr: var(--palert-error-border-clr);
      --palert-svg-clr: var(--palert-error-svg-clr);
      --palert-content-clr: var(--palert-error-content-clr);
      --palert-close-clr: var(--palert-error-close-clr);
    }
    .p-message {
      --palert-content-align: space-between;
      --palert-content-gap: 0;
      --palert-my: 0;
      --palert-mx: 0;
      --palert-py: 1.25rem;
      --palert-px: 1.75rem;
      --palert-clr: #696cff;
      --palert-bg: #e9e9ff;
      --palert-border-width: 1px;
      --palert-border-clr: transparent;
      --palert-border-style: solid;
      --palert-border-radius: 6px;
      --palert-svg-height: 1rem;
      --palert-svg-clr: #424B59;
      --palert-text-gap: 0.5rem;
      --palert-content-fs: 0.875rem;
      --palert-content-fw: 400;
      --palert-content-lh: 1.0625rem;
      --palert-content-clr: #424B59;
      --palert-close-width: 2rem;
      --palert-close-height: 2rem;
      --palert-close-border-width: 1px;
      --palert-close-border-clr: transparent;
      --palert-close-border-style: solid;
      --palert-close-border-radius: 50%;
      --palert-close-bg: transparent;
      --palert-close-clr: inherit;
      --palert-close-py: 1.25rem;
      --palert-close-px: 1.75rem;
      --palert-close-hover-bg: lightblue;
      --palert-close-hover-clr: inherit;
      --palert-info-bg: #e9e9ff;
      --palert-info-border-clr: #696cff;
      --palert-info-clr: #696cff;
      --palert-info-svg-clr: #696cff;
      --palert-info-content-clr: #696cff;
      --palert-info-clr: #696cff;
      --palert-success-bg: #e4f8f0;
      --palert-success-border-clr: #1ea97c;
      --palert-success-clr: #1ea97c;
      --palert-success-svg-clr: #1ea97c;
      --palert-success-content-clr: #1ea97c;
      --palert-success-clr: #1ea97c;
      --palert-success-clr: #1ea97c;
      --palert-warning-bg: #fff2e2;
      --palert-warning-border-clr: #cc8925;
      --palert-warning-clr: #cc8925;
      --palert-warning-svg-clr: #cc8925;
      --palert-warning-content-clr: #cc8925;
      --palert-error-bg: #ffe7e6;
      --palert-error-border-clr: #ff5757;
      --palert-error-clr: #ff5757;
      --palert-error-svg-clr: #ff5757;
      --palert-error-content-clr: #ff5757;
    }
    .p-message:is([class*=-form-error]) {
      --palert-my: 0.5rem 0;
      --palert-py: 0;
      --palert-px: 0;
      --palert-bg: transparent;
      --palert-border-width: 0;
      --palert-content-clr: var(--clr-danger);
      --palert-content-fs: 0.75rem;
      --palert-content-lh: 0.875rem;
      -webkit-user-select: none;
      user-select: none;
    }
  }
  @layer buttons {
    p-button {
      display: inline-flex;
      align-items: center;
      justify-content: center;
    }
    p-button .p-button {
      display: inline-flex;
      align-items: center;
      cursor: pointer;
      transition: 0.2s all ease-in-out;
      justify-content: var(--pbtn-justify-content, center);
      text-align: var(--pbtn-align, center);
      width: var(--pbtn-width, auto);
      min-width: var(--pbtn-minwidth, auto);
      height: var(--pbtn-height, auto);
      min-height: var(--pbtn-minheight, 44px);
      padding-block: var(--pbtn-padding-block, 5px);
      padding-inline: var(--pbtn-padding-inline, 20px);
      margin-block: var(--pbtn-margin-block, 5px);
      margin-inline: var(--pbtn-margin-inline, 0px);
      gap: var(--pbtn-gap, 0.5rem);
      text-decoration: var(--pbtn-text-decoration, none);
      font-size: var(--pbtn-fs, 0.875rem);
      font-weight: var(--pbtn-fw, bold);
      border-radius: var(--pbtn-border-radius, 8px);
      color: var(--pbtn-clr, white);
      background-color: var(--pbtn-bg, var(--clr-primary));
      border-width: var(--pbtn-border-width, 1px);
      border-style: var(--pbtn-border-style, solid);
      border-color: var(--pbtn-border-clr, transparent);
      opacity: var(--pbtn-opacity, 1);
      box-shadow: var(--pbtn-boxshadow, none);
      outline: var(--pbtn-outline, 0);
      line-height: var(--pbtn-lineheight, 1.5);
    }
    p-button .p-button:hover {
      --pbtn-opacity:0.7;
    }
    p-button .p-button:focus,
    p-button .p-button:focus-visible {
      --pbtn-boxshadow: none;
    }
    p-button .p-button.p-button-outlined {
      --pbtn-bg: transparent;
    }
    p-button .p-button.btn-sm {
      --pbtn-padding-inline: 1rem;
      --pbtn-minheight: 2rem;
      --pbtn-fs: 0.75rem;
      --pbtn-border-radius: 0.375rem;
    }
    p-button .p-button.btn-lg {
      --pbtn-padding-inline: 1.5rem;
      --pbtn-minheight: 3.5rem;
      --pbtn-fs: 1rem;
      --pbtn-border-radius: 0.75rem;
    }
    p-button .p-button.btn-xl {
      --pbtn-padding-inline: 1.5rem;
      --pbtn-minheight: 4rem;
      --pbtn-fs: 1rem;
      --pbtn-border-radius: 1rem;
    }
    p-button .p-button:disabled {
      --pbtn-opacity:var(--pbtn-disabled-opacity, 0.4);
      --pbtn-clr: var(--pbtn-disabled-clr);
      --pbtn-bg: var(--pbtn-disabled-bg);
      --pbtn-border-clr: var(--pbtn-disabled-clr);
      pointer-events: none;
      cursor: default;
    }
    p-button .p-button.btn-link:disabled,
    p-button .p-button.p-button-link:disabled {
      --pbtn-opacity:var(--pbtn-disabled-opacity, 0.4);
      --pbtn-clr: var(--pbtn-disabled-clr);
      --pbtn-bg: transparent;
      --pbtn-border-clr: transparent;
    }
    p-button .p-button.p-button-outlined:disabled {
      --pbtn-opacity:var(--pbtn-disabled-opacity, 0.4);
      --pbtn-bg: transparent;
      --pbtn-border-clr: inherit;
    }
    p-button .p-button.p-button-link:enabled:hover,
    p-button .p-button.p-button-link:enabled:active {
      transition: 0s;
      --pbtn-clr:var(--pbtn-link-hover-clr, var(--clr-primary));
      --pbtn-opacity: 1;
    }
    p-button .p-button.p-button-link:enabled:hover .p-button-label,
    p-button .p-button.p-button-link:enabled:active .p-button-label {
      text-decoration: underline;
    }
    p-button.btn-xs > .p-button {
      --pbtn-minheight: 40px;
    }
    p-button.btn-sm > .p-button {
      --pbtn-padding-inline: 15px;
      --pbtn-minheight: 44px;
      --pbtn-fs: 0.875rem;
      --pbtn-border-radius: 8px;
    }
    p-button.btn-lg > .p-button {
      --pbtn-padding-inline: 20px;
      --pbtn-minheight: 56px;
      --pbtn-fs: 1rem;
      --pbtn-border-radius: 8px;
    }
    p-button.btn-xl > .p-button {
      --pbtn-padding-inline: 20px;
      --pbtn-minheight: 68px;
      --pbtn-fs: 1rem;
      --pbtn-border-radius: 8px;
    }
    p-button .p-button-link,
    p-button.btn-sm .p-button-link,
    p-button.btn-transparent:focus-visible > .p-button,
    p-button.btn-link > .p-button,
    p-button.btn-transparent > .p-button {
      --pbtn-padding-block: 0px;
      --pbtn-padding-inline: 0px;
      --pbtn-bg: transparent;
      --pbtn-border-clr: transparent;
      --pbtn-minheight: auto;
      --pbtn-clr: var(--body-clr, black);
    }
    p-button.btn-transparent:hover > .p-button,
    p-button.btn-link:hover > .p-button {
      --pbtn-opacity:0.7;
    }
    p-button.btn-icon > .p-button {
      --pbtn-padding-inline: 5px;
      --pbtn-padding-block: var(--pbtn-padding-inline);
      --pbtn-width: var(--pbtn-minheight);
      --pbtn-height: var(--pbtn-minheight);
      --pbtn-lineheight: 1.5;
    }
    p-button.btn-primary .p-button-outlined {
      --pbtn-clr: var(--clr-primary);
    }
    p-button.btn-dark-primary .p-button-outlined {
      --pbtn-clr: var(--clr-dark-primary);
    }
    p-button.btn-secondary .p-button-outlined {
      --pbtn-clr: var(--clr-secondary);
    }
    p-button.btn-third .p-button-outlined {
      --pbtn-clr: var(--clr-third);
    }
    p-button.btn-success .p-button-outlined {
      --pbtn-clr: var(--clr-success);
    }
    p-button.btn-warning .p-button-outlined {
      --pbtn-clr: var(--clr-warning);
    }
    p-button.btn-danger .p-button-outlined {
      --pbtn-clr: var(--clr-danger);
    }
    p-button.btn-info .p-button-outlined {
      --pbtn-clr: var(--clr-info);
    }
    p-button.btn-sharp > .p-button {
      --pbtn-border-radius: 0;
    }
    p-button.btn-pill:not(.btn-icon) > .p-button {
      --pbtn-border-radius: 40vw;
    }
    p-button.btn-pill.btn-icon > .p-button {
      --pbtn-border-radius: 100%;
    }
    p-button {
      --pbtn-padding-block: 5px;
      --pbtn-padding-inline: 20px;
      --pbtn-margin-block: 0px;
      --pbtn-margin-inline: 0px;
      --pbtn-align: center;
      --pbtn-justify-content: center;
      --pbtn-gap: 0.5rem;
      --pbtn-width: auto;
      --pbtn-minwidth: auto;
      --pbtn-height: auto;
      --pbtn-minheight: 44px;
      --pbtn-fs: 0.875rem;
      --pbtn-fw: 500;
      --pbtn-lineheight: 1.5;
      --pbtn-text-decoration: none;
      --pbtn-clr: white;
      --pbtn-bg: var(--clr-primary);
      --pbtn-border-radius: 8px;
      --pbtn-border-width: 1px;
      --pbtn-border-style: solid;
      --pbtn-border-clr: transparent;
      --pbtn-opacity: 1;
      --pbtn-boxshadow: none;
      --pbtn-outline: 0;
      --pbtn-link-hover-clr: var(--clr-primary);
    }
  }
  @layer cards {
    .p-card {
      position: relative;
      display: flex;
      flex-direction: column;
      min-width: 0;
      word-wrap: break-word;
      background-clip: border-box;
      padding: var(--pcard-padding, 1.5rem);
      background-color: var(--pcard-bg, white);
      border: var(--pcard-border-width, 0) var(--pcard-border-style, solid) var(--pcard-border-clr, transparent);
      border-radius: var(--pcard-border-radius, 0.5rem);
      margin-bottom: var(--pcard-mb, 1.5rem);
      box-shadow: var(--pcard-boxshadow, none);
    }
    .p-card.card-stretch {
      align-items: stretch;
      height: calc(100% - var(--pcard-mb));
    }
    .p-card .p-card-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      flex-wrap: wrap;
      gap: var(--pcard-header-gap, 0);
      padding: var(--pcard-header-padding, 0);
      background-color: var(--pcard-header-bg, transparent);
      border-bottom: var(--pcard-header-borderbottom-width, 0) var(--pcard-header-borderbottom-style, solid) var(--pcard-header-borderbottom-clr, transparent);
      border-radius: var(--pcard-header-border-radius, var(--pcard-border-radius) 0 0 var(--pcard-border-radius));
    }
    .p-card .p-card-header .card-title {
      display: flex;
      align-items: center;
      gap: var(--pcard-header-title-gap, 0);
      margin-block: var(--pcard-header-title-marginblock, 0);
      margin-inline: var(--pcard-header-title-margininline, 0);
    }
    .p-card .p-card-header .card-title h2 {
      color: var(--pcard-header-title-clr, black);
      font-size: var(--pcard-header-title-fs, 0.875rem);
      font-weight: var(--pcard-header-title-fw, 700);
      line-height: var(--pcard-header-title-linheight, 1.5);
    }
    .p-card .p-card-header .card-title .card-subtitle {
      margin-block: var(--pcard-header-subtitle-marginblock, 0);
      margin-inline: var(--pcard-header-subtitle-margininline, 0);
      color: var(--pcard-header-subtitle-clr, gray);
      font-size: var(--pcard-header-subtitle-fs, 0.75rem);
      font-weight: var(--pcard-header-subtitle-fw, 400);
      line-height: var(--pcard-header-subtitle-linheight, 1.5);
    }
    .p-card .p-card-header .card-toolbar {
      display: flex;
      align-items: center;
      flex-wrap: wrap;
      gap: var(--pcard-header-toolbar-gap, 0);
      margin-block: var(--pcard-header-toolbar-marginblock, 0);
      margin-inline: var(--pcard-header-toolbar-margininline, 0);
    }
    @media screen and (max-width: 767.98px) {
      .p-card .p-card-header {
        --pcard-header-gap: var(--pcard-header-mobile-gap, 1rem);
        flex-direction: column;
        align-items: flex-start;
      }
      .p-card .p-card-header .card-title,
      .p-card .p-card-header .card-toolbar,
      .p-card .p-card-header .card-toolbar > .btn {
        width: 100%;
      }
    }
    .p-card .p-card-title,
    .p-card .p-card-subtitle {
      display: none;
    }
    .p-card .p-card-content {
      padding-block: var(--pcard-body-padding-block, 0);
      padding-inline: var(--pcard-body-padding-inline, 0);
    }
    .p-card .p-card-footer {
      display: flex;
      align-items: center;
      justify-content: var(--pcard-footer-justify, space-between);
      gap: var(--pcard-footer-gap, 16px);
      margin-block: var(--pcard-footer-margin-block, 0);
      margin-inline: var(--pcard-footer-margin-inline, 0);
      padding-block: var(--pcard-footer-padding-block, 0);
      padding-inline: var(--pcard-footer-padding-inline, 0);
      background-color: var(--pcard-footer-bg, transparent);
      border-top: var(--pcard-footer-bordertop-width, 0) var(--pcard-footer-bordertop-style, solid) var(--pcard-footer-bordertop-clr, transparent);
    }
    .p-card .p-card-footer .card-action {
      display: flex;
      align-items: center;
      gap: var(--pcard-footer-action-gap, 16px);
    }
    @media screen and (max-width: 767.98px) {
      .p-card .p-card-footer {
        --pcard-footer-gap: 0px;
        flex-direction: column;
      }
      .p-card .p-card-footer > *,
      .p-card .p-card-footer .card-action > .btn {
        width: 100%;
      }
      .p-card .p-card-footer .card-action {
        flex-direction: column;
      }
    }
    .p-card {
      --pcard-padding: 1.5rem;
      --pcard-mb: 1.25rem;
      --pcard-bg: white;
      --pcard-border-width: 1px;
      --pcard-border-style: solid;
      --pcard-border-clr: transparent;
      --pcard-border-radius: 0.5rem;
      --pcard-boxshadow: none;
      --pcard-header-padding: 0 0 0 0;
      --pcard-header-bg: transparent;
      --pcard-header-borderbottom-width: 1px;
      --pcard-header-borderbottom-style: solid;
      --pcard-header-borderbottom-clr: transparent;
      --pcard-header-border-radius: 0 0 0 0;
      --pcard-header-gap: 0;
      --pcard-header-mobile-gap:0;
      --pcard-header-title-marginblock: 0;
      --pcard-header-title-margininline: 0;
      --pcard-header-title-gap: 0;
      --pcard-header-title-clr: black;
      --pcard-header-title-fs: 1rem;
      --pcard-header-title-fw: 700;
      --pcard-header-title-linheight: 1.5;
      --pcard-header-subtitle-marginblock: 0;
      --pcard-header-subtitle-margininline: 0;
      --pcard-header-subtitle-clr: gray;
      --pcard-header-subtitle-fs: 0.875rem;
      --pcard-header-subtitle-fw: 400;
      --pcard-header-subtitle-linheight: 1.5;
      --pcard-header-toolbar-gap: 0;
      --pcard-header-toolbar-marginblock: 0;
      --pcard-header-toolbar-margininline: 0;
      --pcard-body-padding-block: 0;
      --pcard-body-padding-inline: 0;
      --pcard-footer-margin-block: 0;
      --pcard-footer-margin-inline: 0;
      --pcard-footer-padding-block: 0;
      --pcard-footer-padding-inline: 0;
      --pcard-footer-justify: space-between;
      --pcard-footer-gap: 0;
      --pcard-footer-bg: transparent;
      --pcard-footer-bordertop-width: 1px;
      --pcard-footer-bordertop-style: solid;
      --pcard-footer-bordertop-clr: transparent;
      --pcard-footer-action-gap: 0;
    }
  }
  @layer chips {
    .p-chip {
      gap: var(--chip-gap, 8px);
      padding-block: var(--chip-py, 0);
      padding-inline: var(--chip-px, 0.75rem);
      color: var(--chip-clr, #495057);
      background: var(--chip-bg, #dee2e6);
      border: var(--chip-border-width, 1px) solid var(--chip-border-clr, transparent);
      border-radius: var(--chip-border-radius, 16px);
    }
    .p-chip .p-chip-text {
      color: var(--chip-clr, #495057);
      font-size: var(--chip-fs, 16px);
      font-weight: var(--chip-fw, 400);
      line-height: var(--chip-lh, 1.5);
      margin-block: var(--chip-text-my, 0.375rem);
      margin-inline: var(--chip-text-mx, 0);
    }
    .p-chip .p-chip-icon {
      margin-block: var(--chip-customicon-my, 0);
      margin-inline: var(--chip-customicon-mx, 0 0.5rem);
    }
    .p-chip .p-chip-remove-icon {
      display: flex;
      align-items: center;
      justify-content: center;
      width: var(--chip-icon-width, 18px);
      height: var(--chip-icon-height, 18px);
      padding-block: var(--chip-icon-py, 0);
      padding-inline: var(--chip-icon-px, 0);
      margin-block: var(--chip-icon-my, 0);
      margin-inline: var(--chip-icon-mx, 0.5rem 0);
      color: var(--chip-icon-clr, #495057);
      background: var(--chip-icon-bg, transparent);
      border: var(--chip-icon-border-width, 1px) solid var(--chip-icon-border-clr, transparent);
      border-radius: var(--chip-icon-border-radius, 6px);
      transition:
        background-color 0.2s,
        color 0.2s,
        box-shadow 0.2s;
    }
    .p-chip .p-chip-remove-icon:hover {
      color: var(--chip-icon-hover-clr, #495057);
      background: var(--chip-icon-hover-bg, transparent);
      border-color: var(--chip-icon-hover-border-clr, transparent);
      border-radius: var(--chip-icon-hover-border-radius, 6px);
    }
    .p-chip .p-chip-remove-icon:focus-visible {
      box-shadow: var(--chip-icon-focus-boxshadow, 0 0 0 0.2rem #BFDBFE);
    }
    .p-chip .p-chip-remove-icon:focus,
    .p-chip .p-chip-remove-icon:focus-visible {
      outline: 0 none;
      outline-offset: 0;
    }
    .p-chip img {
      width: var(--chip-img-width, 2.25rem);
      height: var(--chip-img-height, 2.25rem);
      margin-block: var(--chip-img-my, 0);
      margin-inline: var(--chip-img-mx, -0.75rem 0.5rem);
    }
    .p-chip {
      --chip-py: 0;
      --chip-px: 0.75rem;
      --chip-clr: #495057;
      --chip-bg: #dee2e6;
      --chip-border-width: 1px;
      --chip-border-clr: transparent;
      --chip-border-radius: 16px;
      --chip-fs: 16px;
      --chip-fw: 400;
      --chip-lh: 1.5;
      --chip-text-my: 0.375rem;
      --chip-text-mx: 0;
      --chip-icon-py: 0;
      --chip-icon-px: 0;
      --chip-icon-my: 0;
      --chip-icon-mx: 0.5rem 0;
      --chip-icon-width: 18px;
      --chip-icon-height: 18px;
      --chip-icon-clr: #495057;
      --chip-icon-bg: transparent;
      --chip-icon-border-width: 1px;
      --chip-icon-border-clr: transparent;
      --chip-icon-border-radius: 6px;
      --chip-icon-hover-clr: #495057;
      --chip-icon-hover-bg: transparent;
      --chip-icon-hover-border-clr: transparent;
      --chip-icon-hover-border-radius: 6px;
      --chip-icon-focus-boxshadow: 0 0 0 0.2rem #BFDBFE;
      --chip-customicon-my: 0;
      --chip-customicon-mx: 0 0.5rem;
      --chip-img-width: 2.25rem;
      --chip-img-height: 2.25rem;
      --chip-img-my: 0;
      --chip-img-mx: -0.75rem 0.5rem;
    }
  }
  @layer forms {
    .form-group {
      margin-bottom: 24px;
    }
    label {
      display: block;
      font-size: 0.875rem;
      font-weight: 400;
      color: #4C515B;
      margin-bottom: 8px;
      -webkit-user-select: none;
      user-select: none;
    }
    :is([class*=-form-control]) {
      font-feature-settings: var(--font-feature-settings, normal);
      display: inline-block;
      width: var(--form-control-width, 100%);
      height: var(--form-control-height, auto);
      min-width: var(--form-control-minwidth, 150px);
      min-height: var(--form-control-minheight, 40px);
      line-height: var(--form-control-lh, 40px);
      padding-block: var(--form-control-py, 5px);
      padding-inline: var(--form-control-px, 20px);
      border-width: var(--form-control-border-width, 1px);
      border-style: solid;
      border-color: var(--form-control-border-clr, transparent);
      border-radius: var(--form-control-border-radius, 6px);
      background: var(--form-control-bg, white);
      color: var(--form-control-clr, #495057);
      font-size: var(--form-control-fs, 1rem);
      font-weight: var(--form-control-fw, 500);
      box-shadow: var(--form-control-boxshadow, none);
      cursor: text;
      transition: var(--form-control-transition, background-color 0.2s, color 0.2s, border-color 0.2s, box-shadow 0.2s);
      appearance: none;
    }
    :is([class*=-form-control]):enabled:hover {
      border-color: var(--form-control-hover-border-clr, var(--clr-primary));
    }
    :is([class*=-form-control]):enabled:focus,
    :is([class*=-form-control]):enabled:focus-visible {
      outline: 0 none;
      outline-offset: 0;
      box-shadow: var(--form-control-focus-boxshadow, 0 0 0 0.2rem #BFDBFE);
      border-color: var(--form-control-focus-border-clr, var(--clr-primary));
    }
    :is([class*=-form-control])::placeholder {
      min-height: var(--form-control-placeholder-minheight, 18px);
      font-size: var(--form-control-placeholder-fs, 16px);
      font-weight: var(--form-control-placeholder-fw, 400);
      color: var(--form-control-placeholder-clr, lightgrey);
    }
    :is([class*=-form-control])[readonly],
    :is([class*=-form-control])[disabled],
    :is([class*=-form-control]):disabled {
      cursor: default;
      color: var(--form-control-disabled-clr, lightgray);
      background: var(--form-control-disabled-bg, lightgray);
      border-color: var(--form-control-disabled-border-clr, lightgray);
    }
    :is([class*=-form-control])[readonly]:enabled:focus,
    :is([class*=-form-control])[readonly]:enabled:focus-within,
    :is([class*=-form-control])[readonly]:enabled:hover {
      border-color: var(--form-control-disabled-border-clr, lightgray);
    }
    :is([class*=-form-control]).ng-dirty.ng-invalid,
    :is([class*=-form-control]).ng-dirty.ng-invalid:focus,
    :is([class*=-form-control])[invalid]:focus-visible,
    :is([class*=-form-control]).ng-dirty.ng-invalid:focus-visible,
    :is([class*=-form-control])[invalid]:hover,
    :is([class*=-form-control]).ng-dirty.ng-invalid:hover {
      border-color: var(--form-control-invalid-border-clr, var(--clr-danger));
    }
    :is([class*=-form-control]) {
      --form-control-width: auto;
      --form-control-height: auto;
      --form-control-minwidth: 150px;
      --form-control-minheight: 40px;
      --form-control-lh: 40px;
      --form-control-py: 5px;
      --form-control-px: 20px;
      --form-control-border-width: 1px;
      --form-control-border-clr: transparent;
      --form-control-border-radius: 6px;
      --form-control-bg: white;
      --form-control-clr: #495057;
      --form-control-fs: 1rem;
      --form-control-fw: 500;
      --form-control-boxshadow: none;
      --form-control-transition:
        background-color 0.2s,
        color 0.2s,
        border-color 0.2s,
        box-shadow 0.2s;
      --form-control-hover-border-clr: var(--clr-primary);
      --form-control-focus-boxshadow: none;
      --form-control-focus-border-clr: var(--clr-primary);
      --form-control-invalid-border-clr: var(--clr-danger);
      --form-control-placeholder-minheight: 18px;
      --form-control-placeholder-fs: 16px;
      --form-control-placeholder-fw: 400;
      --form-control-placeholder-clr: lightgrey;
      --form-control-disabled-bg: lightgray;
      --form-control-disabled-border-clr: lightgray;
      --form-control-autofill-boxshadow: 0 0 0 100px #fff inset;
      --form-control-autofill-bg: white;
      --form-control-autofill-clr: #2B374D;
    }
    .p-iconfield {
      display: flex;
      align-items: center;
    }
    .p-iconfield > .svg-icon {
      position: absolute;
      inset-block: 0;
      margin-block: auto;
      color: #6E7C91;
    }
    [dir=rtl] .p-iconfield.p-iconfield-left > .svg-icon {
      inset-inline-end: 12px;
    }
    [dir=ltr] .p-iconfield.p-iconfield-left > .svg-icon {
      inset-inline-end: 12px;
    }
    [dir=rtl] .p-iconfield.p-iconfield-left .het-form-control.p-password-input,
    [dir=rtl] .p-iconfield.p-iconfield-left > .het-form-control {
      padding-inline-end: 44px;
    }
    [dir=ltr] .p-iconfield.p-iconfield-left .het-form-control.p-password-input,
    [dir=ltr] .p-iconfield.p-iconfield-left > .het-form-control {
      padding-inline-end: 44px;
    }
    [dir=rtl] .p-iconfield.p-iconfield-right > .svg-icon {
      inset-inline-start: 12px;
    }
    [dir=ltr] .p-iconfield.p-iconfield-right > .svg-icon {
      inset-inline-start: 12px;
    }
    [dir=ltr] .p-iconfield.p-iconfield-right .het-form-control.p-password-input,
    [dir=ltr] .p-iconfield.p-iconfield-right > .het-form-control {
      padding-inline-start: 44px;
    }
    [dir=rtl] .p-iconfield.p-iconfield-right .het-form-control.p-password-input,
    [dir=rtl] .p-iconfield.p-iconfield-right > .het-form-control {
      padding-inline-start: 44px;
    }
    p-password [class*=-form-control] {
      padding-inline-end: calc(var(--ppassword-icon-width, 1rem) + var(--ppassword-icon-insetend, 1rem) + 0.5rem);
    }
    p-password .p-password > span > .password-icon,
    p-password .p-password-toggle-mask-icon {
      position: absolute;
      width: var(--ppassword-icon-width, 1rem);
      height: var(--ppassword-icon-height, var(--ppassword-icon-width, 1rem));
      inset-block: 0;
      margin-block: auto;
      inset-inline-end: var(--ppassword-icon-insetend, 1rem);
      color: var(--ppassword-icon-color, lightgray);
      cursor: pointer;
    }
    p-password {
      --ppassword-icon-insetend: 1rem;
      --ppassword-icon-width: 1rem;
      --ppassword-icon-height: 1rem;
      --ppassword-icon-color: lightgray;
    }
    p-password .p-password-panel {
      padding: 1.25rem;
      background: #ffffff;
      color: #495057;
      border: 0 none;
      box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
      border-radius: 6px;
    }
    p-password .p-password-panel .p-password-meter {
      margin-bottom: 0.5rem;
      background: #dee2e6;
    }
    p-password .p-password-panel .p-password-meter .p-password-strength.weak {
      background: #ea5455;
    }
    p-password .p-password-panel .p-password-meter .p-password-strength.medium {
      background: #ff9f42;
    }
    p-password .p-password-panel .p-password-meter .p-password-strength.strong {
      background: #29c76f;
    }
    p-password.ng-invalid.ng-dirty > .p-password > .p-inputtext {
      border-color: #e24c4c;
    }
    p-password.p-password-clearable .p-password-input {
      padding-right: 2.5rem;
    }
    p-password.p-password-clearable .p-password-clear-icon {
      color: #6c757d;
      right: 0.75rem;
    }
    p-password.p-password-clearable.p-password-mask .p-password-input {
      padding-right: 4.25rem;
    }
    p-password.p-password-clearable.p-password-mask .p-password-clear-icon {
      color: #6c757d;
      right: 2.5rem;
    }
    p-password .p-password {
      width: 100%;
    }
    p-password .p-password > .p-icon-wrapper {
      top: auto;
      inset-block: 0;
      margin-block: auto;
      inset-inline-end: 16px;
      align-items: center;
      justify-content: center;
      height: 16px;
      width: 16px;
    }
    p-password .p-password > .p-icon-wrapper svg {
      height: 16px;
      width: 16px;
    }
    p-datepicker .p-datepicker {
      width: var(--calendar-width, auto);
    }
    p-datepicker .p-datepicker .p-inputtext {
      padding-inline-end: var(--calendar-input-padding-ie, 12px);
    }
    p-datepicker .p-datepicker .p-datepicker-icon {
      position: absolute;
      top: auto;
      margin-top: 0;
      inset-block: 0;
      margin-block: auto;
      width: var(--calendar-icon-width, 16px);
      height: var(--calendar-icon-height, 16px);
      inset-inline-end: var(--calendar-icon-inset-ie, 12px);
      color: #6E7C91;
    }
    p-datepicker .p-datepicker .p-datepicker-icon svg {
      display: none;
    }
    p-datepicker .p-datepicker .p-datepicker-icon:before {
      content: "";
      display: flex;
      align-items: center;
      justify-content: center;
      width: var(--calendar-icon-width, 16px);
      height: var(--calendar-icon-height, 16px);
      background-image: url('data:image/svg+xml;utf8,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M8 2V5" stroke="rgb(110 124 145)" stroke-width="2" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/><path d="M16 2V5" stroke="rgb(110 124 145)" stroke-width="2" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/><path d="M3.5 9.09H20.5" stroke="rgb(110 124 145)" stroke-width="2" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/><path d="M21 8.5V17C21 20 19.5 22 16 22H8C4.5 22 3 20 3 17V8.5C3 5.5 4.5 3.5 8 3.5H16C19.5 3.5 21 5.5 21 8.5Z" stroke="rgb(110 124 145)" stroke-width="2" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/><path d="M15.6947 13.7H15.7037" stroke="rgb(110 124 145)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/><path d="M15.6947 16.7H15.7037" stroke="rgb(110 124 145)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/><path d="M11.9955 13.7H12.0045" stroke="rgb(110 124 145)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/><path d="M11.9955 16.7H12.0045" stroke="rgb(110 124 145)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/><path d="M8.29431 13.7H8.30329" stroke="rgb(110 124 145)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/><path d="M8.29431 16.7H8.30329" stroke="rgb(110 124 145)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>');
      background-repeat: no-repeat;
      background-position: center;
      background-size: var(--calendar-icon-width, 16px);
    }
    p-datepicker.p-datepicker-clearable .p-inputtext {
      padding-inline-end: var(--calendar-input-clear-padding-ie, 26px);
    }
    p-datepicker.p-datepicker-clearable timesicon.p-icon-wrapper {
      position: absolute;
      inset-block: 0;
      margin-block: auto;
      inset-inline-end: var(--calendar-clear-icon-inset-ie, 28px);
      width: var(--calendar-clear-icon-width, 16px);
      height: var(--calendar-clear-icon-height, 16px);
    }
    p-datepicker.p-datepicker-clearable timesicon.p-icon-wrapper .p-calendar-clear-icon {
      position: relative !important;
      margin: 0;
      top: 0;
      color: var(--calendar-clear-icon-clr, #6c757d);
    }
    p-datepicker.p-datepicker-clearable .p-calendar-w-btn timesicon.p-icon-wrapper {
      inset-inline-end: 3.75rem;
    }
    p-datepicker {
      --calendar-width: auto;
      --calendar-input-padding-ie: 12px;
      --calendar-icon-width: 16px;
      --calendar-icon-height: 16px;
      --calendar-icon-inset-ie: 12px;
      --calendar-icon-width: 16px;
      --calendar-icon-height: 16px;
      --calendar-input-clear-padding-ie: 26px;
      --calendar-clear-icon-inset-ie: 28px;
      --calendar-clear-icon-width: 16px;
      --calendar-clear-icon-height: 16px;
      --calendar-clear-icon-clr: #6c757d;
    }
    .p-datepicker-panel {
      padding-block: var(--calendar-ddl-py, 0.5rem);
      padding-inline: var(--calendar-ddl-px, 0.5rem);
      background: var(--calendar-ddl-bg, white);
      color: var(--calendar-ddl-clr, #495057);
      border: solid var(--calendar-ddl-border-clr, #ced4da);
      border-width: var(--calendar-ddl-border-width, 1px);
      border-radius: var(--calendar-ddl-border-radius, 6px);
    }
    .p-datepicker-panel:not(.p-datepicker-inline) {
      background: #ffffff;
      border: 0 none;
      box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
    }
    .p-datepicker-panel:not(.p-datepicker-inline) .p-datepicker-header {
      background: #ffffff;
    }
    .p-datepicker-panel .p-datepicker-header {
      padding-block: var(--calendar-ddl-header-py, 0.5rem);
      padding-inline: var(--calendar-ddl-header-px, 0.5rem);
      color: var(--calendar-ddl-header-clr, #495057);
      background: var(--calendar-ddl-header-bg, white);
      font-weight: var(--calendar-ddl-header-fw, 600);
      margin-block: var(--calendar-ddl-header-my, 0);
      margin-inline: var(--calendar-ddl-header-mx, 0);
      border: solid var(--calendar-ddl-header-border-clr, #dee2e6);
      border-width: var(--calendar-ddl-header-border-width, 0 1px 0 0);
      border-start-start-radius: var(--calendar-ddl-header-border-radius-ss, 6px);
      border-start-end-radius: var(--calendar-ddl-header-border-radius-se, 6px);
      border-end-start-radius: var(--calendar-ddl-header-border-radius-es, 0px);
      border-end-end-radius: var(--calendar-ddl-header-border-radius-ee, 0px);
    }
    .p-datepicker-panel .p-datepicker-header .p-datepicker-prev,
    .p-datepicker-panel .p-datepicker-header .p-datepicker-next {
      width: var(--calendar-ddl-header-prevNextBtn-width, 2rem);
      height: var(--calendar-ddl-header-prevNextBtn-height, 2rem);
      color: var(--calendar-ddl-header-prevNextBtn-clr, #6c757d);
      background: var(--calendar-ddl-header-prevNextBtn-bg, transparent);
      border: solid var(--calendar-ddl-header-prevNextBtn-border-clr, transparent);
      border-width: var(--calendar-ddl-header-prevNextBtn-border-width, 0);
      border-radius: var(--calendar-ddl-header-prevNextBtn-border-radius, 50%);
      transition:
        background-color 0.2s,
        color 0.2s,
        box-shadow 0.2s;
    }
    .p-datepicker-panel .p-datepicker-header .p-datepicker-prev:enabled:hover,
    .p-datepicker-panel .p-datepicker-header .p-datepicker-next:enabled:hover {
      color: var(--calendar-ddl-header-prevNextBtn-hover-clr, #343a40);
      background: var(--calendar-ddl-header-prevNextBtn-hover-bg, #e9ecef);
      border-color: var(--calendar-ddl-header-prevNextBtn-hover-border-clr, transparent);
    }
    .p-datepicker-panel .p-datepicker-header .p-datepicker-prev:focus-visible,
    .p-datepicker-panel .p-datepicker-header .p-datepicker-next:focus-visible {
      outline: 0 none;
      outline-offset: 0;
      box-shadow: 0 0 0 0.2rem #BFDBFE;
    }
    .p-datepicker-panel .p-datepicker-header .p-datepicker-title {
      line-height: var(--calendar-ddl-header-title-lh, 2rem);
    }
    .p-datepicker-panel .p-datepicker-header .p-datepicker-title .p-datepicker-year,
    .p-datepicker-panel .p-datepicker-header .p-datepicker-title .p-datepicker-month {
      padding-block: var(--calendar-ddl-header-title-py, 0.5rem);
      padding-inline: var(--calendar-ddl-header-title-px, 0.5rem);
      color: var(--calendar-ddl-header-title-clr, #495057);
      font-size: var(--calendar-ddl-header-title-fs, 14px);
      font-weight: var(--calendar-ddl-header-title-fw, 600);
      line-height: inherit;
      transition:
        background-color 0.2s,
        color 0.2s,
        box-shadow 0.2s;
    }
    .p-datepicker-panel .p-datepicker-header .p-datepicker-title .p-datepicker-year:enabled:hover,
    .p-datepicker-panel .p-datepicker-header .p-datepicker-title .p-datepicker-month:enabled:hover {
      color: var(--calendar-ddl-header-title-hover-clr, #3B82F6);
    }
    .p-datepicker-panel .p-datepicker-header .p-datepicker-title .p-datepicker-month {
      margin-inline-end: var(--calendar-ddl-header-title-yearMonth-gap, 0.5rem);
    }
    .p-datepicker-panel table {
      font-size: var(--calendar-ddl-table-fs, 1rem);
      margin-block: var(--calendar-ddl-table-my, 0.5rem);
      margin-inline: var(--calendar-ddl-table-mx, 0);
    }
    .p-datepicker-panel table th {
      padding-block: var(--calendar-ddl-table-th-py, 0.5rem);
      padding-inline: var(--calendar-ddl-table-th-px, 0.5rem);
    }
    .p-datepicker-panel table th > span {
      width: var(--calendar-ddl-table-th-width, 2.5rem);
      height: var(--calendar-ddl-table-th-height, 2.5rem);
      color: var(--calendar-ddl-table-th-clr, #495057);
      font-size: var(--calendar-ddl-table-th-fs, 1rem);
      font-weight: var(--calendar-ddl-table-th-fw, 600);
      line-height: var(--calendar-ddl-table-th-lh, inherit);
      background: var(--calendar-ddl-table-th-bg, transparent);
    }
    .p-datepicker-panel table td {
      padding-block: var(--calendar-ddl-table-td-py, 0.5rem);
      padding-inline: var(--calendar-ddl-table-td-px, 0.5rem);
      background: var(--calendar-ddl-table-td-bg, transparent);
    }
    .p-datepicker-panel table td > span {
      width: var(--calendar-ddl-table-td-width, 2.5rem);
      height: var(--calendar-ddl-table-td-height, 2.5rem);
      font-size: var(--calendar-ddl-table-td-fs, 1rem);
      font-weight: var(--calendar-ddl-table-td-fw, 600);
      line-height: var(--calendar-ddl-table-td-lh, inherit);
      color: var(--calendar-ddl-table-td-clr, #495057);
      background: var(--calendar-ddl-table-td-bg, transparent);
      border: solid var(--calendar-ddl-table-td-border-clr, transparent);
      border-width: var(--calendar-ddl-table-td-border-width, 1px);
      border-radius: var(--calendar-ddl-table-td-border-radius, 50%);
      transition: box-shadow 0.2s;
    }
    .p-datepicker-panel table td > span.p-highlight {
      color: var(--calendar-ddl-table-td-highlight-clr, #1D4ED8);
      background: var(--calendar-ddl-table-td-highlight-bg, #EFF6FF);
    }
    .p-datepicker-panel table td > span:focus {
      outline: 0 none;
      outline-offset: 0;
      box-shadow: 0 0 0 0.2rem #BFDBFE;
    }
    .p-datepicker-panel table td.p-datepicker-today > span {
      color: var(--calendar-ddl-table-today-clr, #495057);
      background: var(--calendar-ddl-table-today-bg, #ced4da);
      border-color: var(--calendar-ddl-table-today-border-clr, transparent);
    }
    .p-datepicker-panel table td.p-datepicker-today > span.p-highlight {
      color: var(--calendar-ddl-table-today-highlight-clr, #1D4ED8);
      background: var(--calendar-ddl-table-today-highlight-bg, #EFF6FF);
    }
    .p-datepicker-panel table td .p-datepicker-day-selected-range,
    .p-datepicker-panel table td .p-datepicker-day-selected {
      color: var(--calendar-ddl-table-selected-clr, #495057);
      background: var(--calendar-ddl-table-selected-bg, #ced4da);
      border-color: var(--calendar-ddl-table-selected-border-clr, transparent);
    }
    .p-datepicker-panel table td .p-datepicker-day-selected-range {
      color: var(--calendar-ddl-table-selected-range-clr, #495057);
      background: var(--calendar-ddl-table-selected-range-bg, #ced4da);
    }
    .p-datepicker-panel {
      --calendar-ddl-py: 0.5rem;
      --calendar-ddl-px: 0.5rem;
      --calendar-ddl-bg: white;
      --calendar-ddl-clr: #495057;
      --calendar-ddl-border-clr: #ced4da;
      --calendar-ddl-border-width: 1px;
      --calendar-ddl-border-radius: 6px;
      --calendar-ddl-header-py: 0.5rem;
      --calendar-ddl-header-px: 0.5rem;
      --calendar-ddl-header-clr: #495057;
      --calendar-ddl-header-bg: white;
      --calendar-ddl-header-fw: 600;
      --calendar-ddl-header-my: 0;
      --calendar-ddl-header-mx: 0;
      --calendar-ddl-header-border-clr: #dee2e6;
      --calendar-ddl-header-border-width: 0 1px 0 0;
      --calendar-ddl-header-border-radius-ss: 6px;
      --calendar-ddl-header-border-radius-se: 6px;
      --calendar-ddl-header-border-radius-es: 0px;
      --calendar-ddl-header-border-radius-ee: 0px;
      --calendar-ddl-header-prevNextBtn-width: 2rem;
      --calendar-ddl-header-prevNextBtn-height: 2rem;
      --calendar-ddl-header-prevNextBtn-clr: #6c757d;
      --calendar-ddl-header-prevNextBtn-bg: transparent;
      --calendar-ddl-header-prevNextBtn-border-clr: transparent;
      --calendar-ddl-header-prevNextBtn-border-width: 0;
      --calendar-ddl-header-prevNextBtn-border-radius: 50%;
      --calendar-ddl-header-prevNextBtn-hover-clr: #343a40;
      --calendar-ddl-header-prevNextBtn-hover-bg: #e9ecef;
      --calendar-ddl-header-prevNextBtn-hover-border-clr: transparent;
      --calendar-ddl-header-title-lh: 2rem;
      --calendar-ddl-header-title-py: 0.5rem;
      --calendar-ddl-header-title-px: 0.5rem;
      --calendar-ddl-header-title-clr: #495057;
      --calendar-ddl-header-title-fs: 14px;
      --calendar-ddl-header-title-fw: 600;
      --calendar-ddl-header-title-hover-clr: #3B82F6;
      --calendar-ddl-header-title-yearMonth-gap: 0.5rem;
      --calendar-ddl-table-fs: 1rem;
      --calendar-ddl-table-my: 0.5rem;
      --calendar-ddl-table-mx: 0;
      --calendar-ddl-table-th-py: 0.5rem;
      --calendar-ddl-table-th-px: 0.5rem;
      --calendar-ddl-table-th-width: 2.5rem;
      --calendar-ddl-table-th-height: 2.5rem;
      --calendar-ddl-table-th-clr: #495057;
      --calendar-ddl-table-th-fs: 1rem;
      --calendar-ddl-table-th-fw: 600;
      --calendar-ddl-table-th-lh: inherit;
      --calendar-ddl-table-th-bg: transparent;
      --calendar-ddl-table-td-py: 0.5rem;
      --calendar-ddl-table-td-px: 0.5rem;
      --calendar-ddl-table-td-bg: transparent;
      --calendar-ddl-table-td-width: 2.5rem;
      --calendar-ddl-table-td-height: 2.5rem;
      --calendar-ddl-table-td-fs: 1rem;
      --calendar-ddl-table-td-fw: 600;
      --calendar-ddl-table-td-lh: inherit;
      --calendar-ddl-table-td-clr: #495057;
      --calendar-ddl-table-td-bg: transparent;
      --calendar-ddl-table-td-border-clr: transparent;
      --calendar-ddl-table-td-border-width: 1px;
      --calendar-ddl-table-td-border-radius: 50%;
      --calendar-ddl-table-td-highlight-clr: #1D4ED8;
      --calendar-ddl-table-td-highlight-bg: #EFF6FF;
      --calendar-ddl-table-today-clr: #495057;
      --calendar-ddl-table-today-bg: #ced4da;
      --calendar-ddl-table-today-border-clr: transparent;
      --calendar-ddl-table-today-highlight-clr: #1D4ED8;
      --calendar-ddl-table-today-highlight-bg: #EFF6FF;
      --calendar-ddl-table-selected-clr: #495057;
      --calendar-ddl-table-selected-bg: #ced4da;
      --calendar-ddl-table-selected-border-clr: transparent;
      --calendar-ddl-table-selected-range-bg: #ced4da;
      --calendar-ddl-table-selected-range-clr: #495057;
    }
    .p-datepicker-panel .p-datepicker-buttonbar {
      padding: 1rem 0;
      border-top: 1px solid #dee2e6;
    }
    .p-datepicker-panel .p-datepicker-buttonbar .p-button {
      width: auto;
    }
    .p-datepicker-panel .p-timepicker {
      border-top: 1px solid #dee2e6;
      padding: 0.5rem;
    }
    .p-datepicker-panel .p-timepicker button {
      width: 2rem;
      height: 2rem;
      color: #6c757d;
      border: 0 none;
      background: transparent;
      border-radius: 50%;
      transition:
        background-color 0.2s,
        color 0.2s,
        box-shadow 0.2s;
    }
    .p-datepicker-panel .p-timepicker button:enabled:hover {
      color: #343a40;
      border-color: transparent;
      background: #e9ecef;
    }
    .p-datepicker-panel .p-timepicker button:focus-visible {
      outline: 0 none;
      outline-offset: 0;
      box-shadow: 0 0 0 0.2rem #BFDBFE;
    }
    .p-datepicker-panel .p-timepicker button:last-child {
      margin-top: 0.2em;
    }
    .p-datepicker-panel .p-timepicker span {
      font-size: 1.25rem;
    }
    .p-datepicker-panel .p-timepicker > div {
      padding: 0 0.5rem;
    }
    .p-datepicker-panel .p-monthpicker {
      margin: 0.5rem 0;
    }
    .p-datepicker-panel .p-monthpicker .p-monthpicker-month {
      padding: 0.5rem;
      transition: box-shadow 0.2s;
      border-radius: 6px;
    }
    .p-datepicker-panel .p-monthpicker .p-monthpicker-month.p-highlight {
      color: #1D4ED8;
      background: #EFF6FF;
    }
    .p-datepicker-panel .p-yearpicker {
      margin: 0.5rem 0;
    }
    .p-datepicker-panel .p-yearpicker .p-yearpicker-year {
      padding: 0.5rem;
      transition: box-shadow 0.2s;
      border-radius: 6px;
    }
    .p-datepicker-panel .p-yearpicker .p-yearpicker-year.p-highlight {
      color: #1D4ED8;
      background: #EFF6FF;
    }
    .p-datepicker-panel.p-datepicker-timeonly .p-timepicker {
      border-top: 0 none;
    }
    .p-datepicker-panel:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled):hover {
      background: #e9ecef;
    }
    .p-datepicker-panel:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled):focus {
      outline: 0 none;
      outline-offset: 0;
      box-shadow: 0 0 0 0.2rem #BFDBFE;
    }
    .p-datepicker-panel:not(.p-disabled) .p-monthpicker .p-monthpicker-month:not(.p-disabled):not(.p-highlight):hover {
      background: #e9ecef;
    }
    .p-datepicker-panel:not(.p-disabled) .p-monthpicker .p-monthpicker-month:not(.p-disabled):focus {
      outline: 0 none;
      outline-offset: 0;
      box-shadow: 0 0 0 0.2rem #BFDBFE;
    }
    .p-datepicker-panel:not(.p-disabled) .p-yearpicker .p-yearpicker-year:not(.p-disabled):not(.p-highlight):hover {
      background: #e9ecef;
    }
    .p-datepicker-panel:not(.p-disabled) .p-yearpicker .p-yearpicker-year:not(.p-disabled):focus {
      outline: 0 none;
      outline-offset: 0;
      box-shadow: 0 0 0 0.2rem #BFDBFE;
    }
    .p-datepicker-panel.p-datepicker-multiple-month .p-datepicker-group {
      border-left: 1px solid #dee2e6;
      padding-right: 0.5rem;
      padding-left: 0.5rem;
      padding-top: 0;
      padding-bottom: 0;
    }
    .p-datepicker-panel.p-datepicker-multiple-month .p-datepicker-group:first-child {
      padding-left: 0;
      border-left: 0 none;
    }
    .p-datepicker-panel.p-datepicker-multiple-month .p-datepicker-group:last-child {
      padding-right: 0;
    }
    @media screen and (max-width: 769px) {
      .p-datepicker-panel table th,
      .p-datepicker-panel table td {
        padding: 0;
      }
    }
    p-inputswitch {
      display: inline-flex;
      align-items: center;
    }
    p-inputswitch.ng-dirty.ng-invalid > .p-toggleswitch {
      border-color: var(--clr-danger);
    }
    p-inputswitch .p-toggleswitch {
      width: var(--pswitch-width, 3rem);
      height: var(--pswitch-height, 1.75rem);
    }
    p-inputswitch .p-toggleswitch .p-toggleswitch-slider {
      background: var(--pswitch-slider-bg, #ced4da);
      transition: var(--pswitch-slider-transition, background-color 0.2s, color 0.2s, border-color 0.2s, box-shadow 0.2s);
      border-radius: var(--pswitch-slider-border-radius, 30px);
    }
    p-inputswitch .p-toggleswitch .p-toggleswitch-slider:before {
      background: var(--pswitch-circle-bg, white);
      width: var(--pswitch-circle-width, calc(var(--pswitch-height) - 8px));
      height: var(--pswitch-circle-height, calc(var(--pswitch-height) - 8px));
      left: var(--pswitch-circle-left, 0.25rem);
      top: 0;
      inset-block: 0;
      margin-block: auto;
      border-radius: var(--pswitch-circle-border-radius, 100%);
      transition-duration: 0.2s;
    }
    p-inputswitch .p-toggleswitch.p-toggleswitch-checked .p-toggleswitch-slider {
      background: var(--pswitch-slider-checked-bg, #3B82F6);
    }
    p-inputswitch .p-toggleswitch.p-toggleswitch-checked .p-toggleswitch-slider:before {
      transform: translateX(calc(var(--pswitch-width) - var(--pswitch-circle-width) - 10px));
      background: var(--pswitch-circle-checked-bg, white);
    }
    p-inputswitch .p-toggleswitch.p-toggleswitch-checked:not(.p-disabled):hover .p-toggleswitch-slider {
      background: var(--pswitch-slider-checked-hover-bg, #2563eb);
    }
    p-inputswitch .p-toggleswitch.p-focus .p-toggleswitch-slider {
      outline: 0 none;
      outline-offset: 0;
      box-shadow: var(--pswitch-slider-focus-boxshadow, 0 0 0 0.2rem #BFDBFE);
    }
    p-inputswitch .p-toggleswitch:not(.p-disabled):hover .p-toggleswitch-slider {
      background: var(--pswitch-slider-hover-bg, #b6bfc8);
    }
    p-inputswitch .p-toggleswitch:not(.p-disabled):has(.p-toggleswitch-input:focus-visible) .p-toggleswitch-slider {
      outline-color: var(--pswitch-focus-border-clr, var(--clr-primary));
    }
    p-inputswitch .p-toggleswitch {
      --pswitch-width: 3rem;
      --pswitch-height: 1.75rem;
      --pswitch-slider-bg: #ced4da;
      --pswitch-slider-transition:
        background-color 0.2s,
        color 0.2s,
        border-color 0.2s,
        box-shadow 0.2s;
      --pswitch-slider-border-radius: 30px;
      --pswitch-circle-bg: white;
      --pswitch-circle-width: calc(var(--pswitch-height) - 8px);
      --pswitch-circle-height: calc(var(--pswitch-height) - 8px);
      --pswitch-circle-border-radius: 100%;
      --pswitch-circle-left: 0.25rem;
      --pswitch-slider-checked-bg: #3B82F6;
      --pswitch-circle-checked-bg: white;
      --pswitch-slider-checked-hover-bg: #2563eb;
      --pswitch-slider-focus-boxshadow: 0 0 0 0.2rem #BFDBFE;
      --pswitch-slider-hover-bg: #b6bfc8;
      --pswitch-focus-border-clr: var(--clr-primary);
    }
    p-radiobutton {
      gap: var(--radio-wrapper-gap, 8px);
    }
    p-radiobutton .p-radiobutton {
      width: var(--radio-width, 22px);
      height: var(--radio-height, 22px);
    }
    p-radiobutton .p-radiobutton .p-radiobutton-box {
      width: var(--radio-width, 22px);
      height: var(--radio-height, 22px);
      color: var(--radio-clr, #495057);
      background: var(--radio-bg, white);
      border: solid var(--radio-border-clr, #ced4da);
      border-width: var(--radio-border-width, 2px);
      border-radius: var(--radio-border-radius, 50%);
      transition:
        background-color 0.2s,
        color 0.2s,
        border-color 0.2s,
        box-shadow 0.2s;
    }
    p-radiobutton .p-radiobutton .p-radiobutton-box:not(.p-disabled):not(.p-highlight):hover {
      border-color: var(--radio-active-border-clr, #3B82F6);
    }
    p-radiobutton .p-radiobutton .p-radiobutton-box:not(.p-disabled):not(.p-highlight):hover .p-radiobutton-icon {
      background-color: var(--radio-active-icon-bg, #3B82F6);
      transform: unset;
      visibility: unset;
    }
    p-radiobutton .p-radiobutton .p-radiobutton-box:not(.p-disabled).p-focus {
      outline: 0 none;
      outline-offset: 0;
      box-shadow: var(--radio-boxshadow, 0 0 0 0.2rem #BFDBFE);
      border-color: var(--radio-active-border-clr, #3B82F6);
    }
    p-radiobutton .p-radiobutton .p-radiobutton-box:not(.p-disabled).p-focus .p-radiobutton-icon {
      background-color: var(--radio-active-icon-bg, #3B82F6);
    }
    p-radiobutton .p-radiobutton .p-radiobutton-box.p-highlight {
      border-color: var(--radio-active-border-clr, #3B82F6);
      background: var(--radio-active-bg, #3B82F6);
    }
    p-radiobutton .p-radiobutton .p-radiobutton-box.p-highlight .p-radiobutton-icon {
      background-color: var(--radio-active-icon-bg, #3B82F6);
    }
    p-radiobutton .p-radiobutton .p-radiobutton-box.p-highlight:not(.p-disabled):hover {
      border-color: var(--radio-active-hover-border-clr, #1D4ED8);
      background: var(--radio-active-hover-bg, #1D4ED8);
      color: var(--radio-active-hover-clr, white);
    }
    p-radiobutton .p-radiobutton .p-radiobutton-box .p-radiobutton-icon {
      width: var(--radio-icon-width, 12px);
      height: var(--radio-icon-height, 12px);
      background-color: var(--radio-icon-bg, white);
      transition-duration: 0.2s;
    }
    p-radiobutton .p-radiobutton-label {
      margin-block: var(--radio-label-my, 0);
      margin-inline: var(--radio-label-mx, 0);
      padding-block: var(--radio-label-py, 0);
      padding-inline: var(--radio-label-px, 0);
      color: var(--radio-label-clr, #333);
      font-size: var(--radio-label-fs, 16px);
      font-weight: var(--radio-label-fw, 400);
      line-height: var(--radio-label-lh, 1.5);
    }
    p-radiobutton.ng-dirty.ng-invalid > .p-radiobutton > .p-radiobutton-box {
      border-color: var(--radio-invalid-border-clr, #e24c4c);
    }
    p-radiobutton {
      --radio-wrapper-gap: 8px;
      --radio-width: 22px;
      --radio-height: 22px;
      --radio-clr: #495057;
      --radio-bg: white;
      --radio-border-clr: #ced4da;
      --radio-border-width: 2px;
      --radio-border-radius: 50%;
      --radio-boxshadow: 0 0 0 0.2rem #BFDBFE;
      --radio-active-border-clr: #3B82F6;
      --radio-active-bg: #3B82F6;
      --radio-active-hover-border-clr: #1D4ED8;
      --radio-active-hover-bg: #1D4ED8;
      --radio-active-hover-clr: white;
      --radio-icon-width: 12px;
      --radio-icon-height: 12px;
      --radio-icon-bg: white;
      --radio-active-icon-bg: #3B82F6;
      --radio-invalid-border-clr: #e24c4c;
      --radio-label-my: 0;
      --radio-label-mx: 0;
      --radio-label-py: 0;
      --radio-label-px: 0;
      --radio-label-clr: #333;
      --radio-label-fs: 16px;
      --radio-label-fw: 400;
      --radio-label-lh: 1.5;
    }
    .p-input-filled .p-radiobutton .p-radiobutton-box {
      background-color: #e9ecef;
    }
    .p-input-filled .p-radiobutton .p-radiobutton-box:not(.p-disabled):hover {
      background-color: #e9ecef;
    }
    .p-input-filled .p-radiobutton .p-radiobutton-box.p-highlight {
      background: #3B82F6;
    }
    .p-input-filled .p-radiobutton .p-radiobutton-box.p-highlight:not(.p-disabled):hover {
      background-color: #1D4ED8;
    }
    .checkbox-wrapper {
      display: inline-flex;
      align-items: center;
      gap: var(--pcheckbox-gap, 0.5rem);
      cursor: var(--pcheckbox-cursor, pointer);
      margin: 0;
    }
    .checkbox-wrapper:hover .p-checkbox .p-checkbox-box {
      border-color: var(--pcheckbox-box-hover-border-clr, #3B82F6);
    }
    .checkbox-wrapper > p {
      margin: 0;
      cursor: var(--pcheckbox-cursor, pointer);
      color: var(--pcheckbox-label-clr, #6E7C91);
      font-size: var(--pcheckbox-label-fs, 16px);
      font-weight: var(--pcheckbox-label-fw, 400);
      line-height: var(--pcheckbox-label-lh, 1.2);
    }
    .checkbox-wrapper {
      --pcheckbox-gap: 0.5rem;
      --pcheckbox-cursor: pointer;
      --pcheckbox-box-width: 22px;
      --pcheckbox-box-height: 22px;
      --pcheckbox-box-width: 22px;
      --pcheckbox-box-height: 22px;
      --pcheckbox-box-clr: #495057;
      --pcheckbox-box-bg: white;
      --pcheckbox-box-border-clr: #ced4da;
      --pcheckbox-box-border-width: 2px;
      --pcheckbox-box-border-radius: 6px;
      --pcheckbox-box-boxshadow: none;
      --pcheckbox-box-icon-fs: 1rem;
      --pcheckbox-box-icon-width: 22px;
      --pcheckbox-box-icon-height: 22px;
      --pcheckbox-box-icon-clr: #495057;
      --pcheckbox-box-icon-transition-duration: 0.2s;
      --pcheckbox-box-hover-border-clr: #3B82F6;
      --pcheckbox-box-checked-border-clr: #3B82F6;
      --pcheckbox-box-checked-bg: white;
      --pcheckbox-box-checked-icon-clr: #3B82F6;
      --pcheckbox-cursor: pointer;
      --pcheckbox-label-clr: #6E7C91;
      --pcheckbox-label-fs: 16px;
      --pcheckbox-label-fw: 400;
      --pcheckbox-label-lh: 1.2;
    }
    .p-checkbox {
      width: var(--pcheckbox-box-width, 22px);
      height: var(--pcheckbox-box-height, 22px);
    }
    .p-checkbox .p-checkbox-box {
      width: var(--pcheckbox-box-width, 22px);
      height: var(--pcheckbox-box-height, 22px);
      color: var(--pcheckbox-box-clr, #495057);
      background: var(--pcheckbox-box-bg, white);
      border: solid var(--pcheckbox-box-border-clr, #ced4da);
      border-width: var(--pcheckbox-box-border-width, 2px);
      border-radius: var(--pcheckbox-box-border-radius, 6px);
      box-shadow: var(--pcheckbox-box-boxshadow, none);
    }
    .p-checkbox .p-checkbox-box .p-checkbox-icon {
      font-size: var(--pcheckbox-box-icon-fs, 1rem);
      width: var(--pcheckbox-box-icon-width, 22px);
      height: var(--pcheckbox-box-icon-height, 22px);
      color: var(--pcheckbox-box-icon-clr, #495057);
      transition-duration: var(--pcheckbox-box-icon-transition-duration, 0.2s);
    }
    .p-checkbox.p-checkbox-checked .p-checkbox-box {
      border-color: var(--pcheckbox-box-checked-border-clr, #3B82F6);
      background: var(--pcheckbox-box-checked-bg, white);
    }
    .p-checkbox.p-checkbox-checked .p-checkbox-box .p-checkbox-icon {
      color: var(--pcheckbox-box-checked-icon-clr, #3B82F6);
    }
    [data-p-partialchecked=true] .p-checkbox-box {
      border-color: var(--pcheckbox-box-checked-border-clr, #3B82F6);
      background: var(--pcheckbox-box-checked-bg, white);
    }
    [data-p-partialchecked=true] .p-checkbox-box .p-checkbox-icon {
      color: var(--pcheckbox-box-checked-icon-clr, #3B82F6);
    }
    .p-select {
      width: var(--pselect-width, 100%);
      height: var(--pselect-height, auto);
      min-width: var(--pselect-min-width, 150px);
      min-height: var(--pselect-min-height, 40px);
      line-height: var(--pselect-lh, 40px);
      padding-block: var(--pselect-py, 5px);
      padding-inline: var(--pselect-px, 20px);
      border: 1px solid var(--pselect-border-clr, #ced4da);
      border-width: var(--pselect-border-width, 1px);
      border-radius: var(--pselect-border-radius, 6px);
      background: var(--pselect-bg, white);
      color: var(--pselect-clr, #495057);
      font-size: var(--pselect-fs, 1rem);
      font-weight: var(--pselect-fw, 500);
      box-shadow: var(--pselect-boxshadow, none);
      cursor: pointer;
      transition: var(--pselect-transition, background-color 0.2s, color 0.2s, border-color 0.2s, box-shadow 0.2s);
      appearance: none;
    }
    .p-select:not(.p-disabled):hover {
      border-color: var(--pselect-hover-border-clr, #3B82F6);
    }
    .p-select:not(.p-disabled).p-focus {
      outline: 0 none;
      outline-offset: 0;
      box-shadow: var(--pselect-focus-boxshadow, 0 0 0 0.2rem #BFDBFE);
      border-color: var(--pselect-focus-border-clr, #3B82F6);
    }
    .p-select[readonly],
    .p-select.p-disabled {
      cursor: default;
      color: var(--pselect-disabled-clr, lightgray);
      background: var(--pselect-disabled-bg, lightgray);
      border-color: var(--pselect-disabled-border-clr, lightgray);
    }
    .p-select.p-invalid.p-component {
      border-color: var(--pselect-invalid-border-clr, #e24c4c);
    }
    .p-select .p-select-label {
      padding-block: var(--pselect-label-py, 0);
      padding-inline: var(--pselect-label-px, 0);
      min-height: var(--pselect-label-minheight, 18px);
      font-size: var(--pselect-label-fs, 16px);
      font-weight: var(--pselect-label-fw, 400);
      line-height: var(--pselect-label-lh, 40px);
      color: var(--pselect-label-clr, #6c757d);
    }
    .p-select .p-select-label.p-placeholder {
      min-height: var(--pselect-placeholder-minheight, 18px);
      font-size: var(--pselect-placeholder-fs, 16px);
      font-weight: var(--pselect-placeholder-fw, 400);
      color: var(--pselect-placeholder-clr, #6c757d);
    }
    .p-select .p-select-label:focus,
    .p-select .p-select-label:enabled:focus {
      outline: 0 none;
      box-shadow: none;
    }
    .p-select .p-select-dropdown {
      margin-inline-start: var(--pselect-arrow-margin-istart, 8px);
      background: var(--pselect-arrow-bg, transparent);
      color: var(--pselect-arrow-clr, #6c757d);
      width: var(--pselect-arrow-width, 3rem);
      border-radius: var(--pselect-arrow-border-radius, 6px 6px 0 0);
    }
    .p-select .p-select-dropdown > .p-iconwrapper {
      width: var(--pselect-arrow-icon-width, 16px);
    }
    .p-select .p-select-dropdown > .p-dropdown-trigger-icon.pi.pi-spin.pi-spinner {
      width: 20px;
      height: 20px;
      position: relative;
    }
    .p-select .p-select-dropdown > .p-dropdown-trigger-icon.pi.pi-spin.pi-spinner::before {
      content: "";
      position: absolute;
      width: 20px;
      height: 20px;
      background-image: url('data:image/svg+xml;utf8,<svg version="1.1" width="100" height="100" id="L9" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 100 100" enable-background="new 0 0 0 0" xml:space="preserve"><path fill="rgb(181, 188, 196)" d="M73,50c0-12.7-10.3-23-23-23S27,37.3,27,50 M30.9,50c0-10.5,8.5-19.1,19.1-19.1S69.1,39.5,69.1,50"><animateTransform attributeName="transform" attributeType="XML" type="rotate" dur="1s" from="0 50 50" to="360 50 50" repeatCount="indefinite" /></path></svg>');
      background-repeat: no-repeat;
      background-position: center;
      background-size: 40px;
      inset-block: 0;
      margin-block: auto;
      inset-inline-start: 0;
    }
    .p-select {
      --pselect-width: 100%;
      --pselect-height: auto;
      --pselect-min-width: 150px;
      --pselect-min-height: 40px;
      --pselect-lh: 40px;
      --pselect-py: 5px;
      --pselect-px: 20px;
      --pselect-border-clr: #ced4da;
      --pselect-border-width: 1px;
      --pselect-border-radius: 6px;
      --pselect-bg: white;
      --pselect-clr: #495057;
      --pselect-fs: 1rem;
      --pselect-fw: 500;
      --pselect-boxshadow: none;
      --pselect-transition: all 0.2s;
      --pselect-hover-border-clr: #3B82F6;
      --pselect-focus-boxshadow: 0 0 0 0.2rem #BFDBFE;
      --pselect-focus-border-clr: #3B82F6;
      --pselect-disabled-clr: lightgray;
      --pselect-disabled-bg: lightgray;
      --pselect-disabled-border-clr: lightgray;
      --pselect-invalid-border-clr: #e24c4c;
      --pselect-label-py: 0;
      --pselect-label-px: 0;
      --pselect-label-minheight: 18px;
      --pselect-label-fs: 16px;
      --pselect-label-fw: 400;
      --pselect-label-lh: 40px;
      --pselect-label-clr: #6c757d;
      --pselect-placeholder-minheight: 18px;
      --pselect-placeholder-fs: 16px;
      --pselect-placeholder-fw: 400;
      --pselect-placeholder-clr: #6c757d;
      --pselect-arrow-margin-istart: 8px;
      --pselect-arrow-bg: transparent;
      --pselect-arrow-clr: #6c757d;
      --pselect-arrow-width: 3rem;
      --pselect-arrow-border-radius: 6px 6px 0 0;
      --pselect-arrow-icon-width: 16px;
    }
    .p-select-overlay {
      margin-block: var(--pselect-ddl-my, 8px 0);
      margin-inline: var(--pselect-ddl-mx, 0);
      background: var(--pselect-ddl-bg, white);
      color: var(--pselect-ddl-clr, #495057);
      border: 1px solid var(--pselect-ddl-border-clr, transparent);
      border-width: var(--pselect-ddl-border-width, 0);
      border-radius: var(--pselect-ddl-border-radius, 6px);
      box-shadow: var(--pselect-ddl-boxshadow, 0 2px 12px 0 rgba(0, 0, 0, 0.1));
    }
    .p-select-overlay .p-select-list {
      padding-block: var(--pselect-ddl-container-py, 0.75rem);
      padding-inline: var(--pselect-ddl-container-px, 0);
      gap: var(--pselect-ddl-container-gap, 8px);
    }
    .p-select-overlay .p-select-list .p-select-option {
      margin-block: var(--pselect-ddl-item-my, 0 8px);
      margin-inline: var(--pselect-ddl-item-mx, 0);
      padding-block: var(--pselect-ddl-item-py, 0.75rem);
      padding-inline: var(--pselect-ddl-item-px, 1.25rem);
      border: 1px solid var(--pselect-ddl-item-border-clr, transparent);
      border-width: var(--pselect-ddl-item-border-width, 0);
      border-radius: var(--pselect-ddl-item-border-radius, 0);
      color: var(--pselect-ddl-item-clr, #495057);
      background: var(--pselect-ddl-item-bg, transparent);
      transition: box-shadow 0.2s;
      font-size: var(--pselect-ddl-item-fs, 14px);
      font-weight: var(--pselect-ddl-item-fw, 500);
      line-height: var(--pselect-ddl-item-lh, 22px);
    }
    .p-select-overlay .p-select-list .p-select-option:not(.p-select-option-selected):not(.p-disabled).p-focus {
      color: var(--pselect-ddl-item-focus-clr, #495057);
      background: var(--pselect-ddl-item-focus-bg, #dee2e6);
    }
    .p-select-overlay .p-select-list .p-select-option:not(.p-select-option-selected):not(.p-disabled):hover {
      color: var(--pselect-ddl-item-hover-clr, #495057);
      background: var(--pselect-ddl-item-hover-bg, #e9ecef);
    }
    .p-select-overlay .p-select-list .p-select-option.p-select-option-selected {
      color: var(--pselect-ddl-item-selected-clr, #1D4ED8);
      font-size: var(--pselect-ddl-item-selected-fs, 14px);
      font-weight: var(--pselect-ddl-item-selected-fw, 500);
      line-height: var(--pselect-ddl-item-selected-lh, 22px);
      background: var(--pselect-ddl-item-selected-bg, #EFF6FF);
    }
    .p-select-overlay .p-select-list .p-select-option.p-select-option-selected.p-focus {
      background: var(--pselect-ddl-item-selected-focus-bg, rgba(59, 130, 246, 0.24));
      color: var(--pselect-ddl-item-selected-focus-clr, #1D4ED8);
    }
    .p-select-overlay .p-select-list p-selectitem:last-child .p-dropdown-item {
      margin: 0;
    }
    .p-select-overlay {
      --pselect-ddl-my: 8px 0;
      --pselect-ddl-mx: 0;
      --pselect-ddl-bg: white;
      --pselect-ddl-clr: #495057;
      --pselect-ddl-border-clr: transparent;
      --pselect-ddl-border-width: 0;
      --pselect-ddl-border-radius: 6px;
      --pselect-ddl-boxshadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
      --pselect-ddl-container-py: 0.75rem;
      --pselect-ddl-container-px: 0;
      --pselect-ddl-container-gap: 8px;
      --pselect-ddl-item-my: 0 8px;
      --pselect-ddl-item-mx: 0;
      --pselect-ddl-item-py: 0.75rem;
      --pselect-ddl-item-px: 1.25rem;
      --pselect-ddl-item-border-clr: transparent;
      --pselect-ddl-item-border-width: 0;
      --pselect-ddl-item-border-radius: 0;
      --pselect-ddl-item-clr: #495057;
      --pselect-ddl-item-bg: transparent;
      --pselect-ddl-item-fs: 14px;
      --pselect-ddl-item-fw: 500;
      --pselect-ddl-item-lh: 22px;
      --pselect-ddl-item-focus-clr: #495057;
      --pselect-ddl-item-focus-bg: #dee2e6;
      --pselect-ddl-item-hover-clr: #495057;
      --pselect-ddl-item-hover-bg: #e9ecef;
      --pselect-ddl-item-selected-clr: #1D4ED8;
      --pselect-ddl-item-selected-fs: 14px;
      --pselect-ddl-item-selected-fw: 500;
      --pselect-ddl-item-selected-lh: 22px;
      --pselect-ddl-item-selected-bg: #EFF6FF;
      --pselect-ddl-item-selected-focus-bg: rgba(59, 130, 246, 0.24);
      --pselect-ddl-item-selected-focus-clr: #1D4ED8;
    }
    .p-multiselect {
      width: var(--multiselect-width, auto);
      background: var(--multiselect-bg, white);
      border: solid var(--multiselect-border-clr, #ced4da);
      border-width: var(--multiselect-border-width, 1px);
      border-radius: var(--multiselect-border-radius, 6px);
      transition: all 0.2;
      box-shadow: var(--multiselect-shadowbox, none);
    }
    .p-multiselect.p-multiselect-display-chip .p-multiselect-label {
      gap: var(--multiselect-chip-list-gap, 0.5rem);
      flex-wrap: wrap;
    }
    .p-multiselect .p-multiselect-label {
      min-height: var(--multiselect-label-minheight, 46px);
      padding-block: var(--multiselect-label-py, 0.75rem);
      padding-inline: var(--multiselect-label-px, 0.75rem);
      color: var(--multiselect-label-clr, #495057);
      font-size: var(--multiselect-label-fs, 14px);
      font-weight: var(--multiselect-label-fw, 400);
      line-height: var(--multiselect-label-lh, 1.2);
      transition: all 0.2s;
    }
    .p-multiselect .p-multiselect-label.p-placeholder {
      color: var(--multiselect-label-placeholder-clr, #6c757d);
      font-size: var(--multiselect-label-placeholder-fs, 14px);
      font-weight: var(--multiselect-label-placeholder-fw, 400);
      line-height: var(--multiselect-label-placeholder-lh, 1.2);
    }
    .p-multiselect .p-multiselect-label.p-multiselect-chip .p-multiselect-token {
      gap: var(--multiselect-chip-gap, 8px);
      padding-block: var(--multiselect-chip-py, 0.375rem);
      padding-inline: var(--multiselect-chip-px, 0.75rem);
      margin-inline-end: var(--multiselect-chip-margin-ie, 8px);
      background: var(--multiselect-chip-bg, #dee2e6);
      color: var(--multiselect-chip-clr, #495057);
      font-size: var(--multiselect-chip-fs, 12px);
      font-weight: var(--multiselect-chip-fw, 400);
      line-height: var(--multiselect-chip-lh, 1.2);
      border: solid var(--multiselect-chip-border-clr, transparent);
      border-width: var(--multiselect-chip-border-width, 1px);
      border-radius: var(--multiselect-chip-border-radius, 16px);
    }
    .p-multiselect .p-multiselect-label.p-multiselect-chip .p-multiselect-token:last-child {
      margin-inline-end: 0;
    }
    .p-multiselect .p-multiselect-label.p-multiselect-chip .p-multiselect-token .p-icon-wrapper {
      position: relative;
      background: var(--multiselect-chip-icon-bg, #F8FAFC);
      border-radius: var(--multiselect-chip-icon-border-radius, 100%);
      cursor: pointer;
    }
    .p-multiselect .p-multiselect-label.p-multiselect-chip .p-multiselect-token .p-icon-wrapper::before {
      content: "";
      width: var(--multiselect-chip-icon-width, 16px);
      height: var(--multiselect-chip-icon-height, 16px);
      background-image: url('data:image/svg+xml;utf8,<svg width="8" height="8" viewBox="0 0 8 8" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M0.758367 7.99566C0.562236 8.0072 0.369342 7.94124 0.220357 7.81168C-0.0734523 7.51269 -0.0734523 7.02979 0.220357 6.7308L6.65382 0.222481C6.9594 -0.0667934 7.43892 -0.0507128 7.72487 0.258429C7.98344 0.537985 7.99851 0.967669 7.76015 1.26505L1.28879 7.81168C1.14174 7.93937 0.951925 8.00521 0.758367 7.99566Z" fill="var(--multiselect-chip-icon-clr, rgb(206 215 227))"/><path d="M7.1852 7.99586C6.98641 7.99501 6.79591 7.91517 6.65475 7.77356L0.221272 1.26522C-0.0509269 0.943658 -0.01392 0.459724 0.303945 0.184334C0.587648 -0.0614447 1.00605 -0.0614447 1.28973 0.184334L7.76109 6.69265C8.06661 6.982 8.0824 7.46712 7.79638 7.77619C7.785 7.78848 7.77325 7.80037 7.76109 7.81188C7.68269 7.88085 7.59112 7.93276 7.49205 7.96441C7.39298 7.99606 7.28853 8.00677 7.1852 7.99586Z" fill="var(--multiselect-chip-icon-clr, rgb(206 215 227))"/></svg>');
      background-repeat: no-repeat;
      background-position: center;
      inset: 0;
      margin-block: auto;
      cursor: pointer;
    }
    .p-multiselect .p-multiselect-label.p-multiselect-chip .p-multiselect-token .p-icon-wrapper .p-multiselect-token-icon {
      display: none;
    }
    .p-multiselect .p-multiselect-label.p-multiselect-chip .p-multiselect-token .p-multiselect-token-icon {
      color: var(--multiselect-trigger-icon-clr, #CED7E3);
    }
    .p-multiselect .p-multiselect-label.p-multiselect-chip .p-multiselect-token .p-multiselect-token-label {
      max-width: fit-content !important;
    }
    .p-multiselect .p-multiselect-label.p-multiselect-chip.p-inputwrapper-filled .p-multiselect-label {
      padding-block: var(--multiselect-chip-filled-py, 0.375rem);
      padding-inline: var(--multiselect-chip-filled-px, 0.75rem);
    }
    .p-multiselect .p-multiselect-dropdown {
      background: var(--multiselect-trigger-bg, transparent);
      color: var(--multiselect-trigger-clr, #6c757d);
      width: var(--multiselect-trigger-width, 3rem);
      border-start-start-radius: var(--multiselect-trigger-border-radius-ss, 0px);
      border-start-end-radius: var(--multiselect-trigger-border-radius-se, 6px);
      border-end-start-radius: var(--multiselect-trigger-border-radius-es, 0px);
      border-end-end-radius: var(--multiselect-trigger-border-radius-ee, 6px);
    }
    .p-multiselect .p-multiselect-dropdown chevrondownicon {
      width: var(--multiselect-trigger-icon-width, 12px);
    }
    .p-multiselect.p-multiselect-clearable .p-multiselect-label-container {
      padding-inline-end: var(--multiselect-clear-label-wrapper-pinline-end, 1.75rem);
      position: relative;
    }
    .p-multiselect.p-multiselect-clearable .p-multiselect-label-container > .p-icon-wrapper {
      position: absolute;
      inset-block: 0;
      margin-block: auto;
      cursor: pointer;
      inset-inline-end: var(--multiselect-clear-icon-inset-ie, 3rem);
    }
    .p-multiselect.p-multiselect-clearable .p-multiselect-label-container > .p-icon-wrapper .p-multiselect-clear-icon {
      position: relative !important;
      color: var(--multiselect-clear-icon-clr, #6c757d);
      width: var(--multiselect-clear-icon-width, 12px);
    }
    .p-multiselect:not(.p-disabled).p-focus {
      outline: 0 none;
      outline-offset: 0;
      box-shadow: var(--multiselect-focus-boxshadow, 0 0 0 0.2rem #BFDBFE);
      border-color: var(--multiselect-focus-border-clr, #3B82F6);
    }
    .p-multiselect:not(.p-disabled):hover {
      border-color: var(--multiselect-hover-border-clr, #3B82F6);
    }
    .p-multiselect.p-disabled {
      background: #EEF2F6;
      border-color: #CED7E3;
      color: #CED7E3;
    }
    .p-multiselect.p-disabled .p-multiselect-token-label {
      color: #CED7E3 !important;
    }
    .p-multiselect {
      --multiselect-width: auto;
      --multiselect-bg: white;
      --multiselect-border-clr: #ced4da;
      --multiselect-border-width: 1px;
      --multiselect-border-radius: 6px;
      --multiselect-shadowbox: none;
      --multiselect-label-minheight: 46px;
      --multiselect-label-py: 0.75rem;
      --multiselect-label-px: 0.75rem;
      --multiselect-label-clr: #495057;
      --multiselect-label-fs: 14px;
      --multiselect-label-fw: 400;
      --multiselect-label-lh: 1.2;
      --multiselect-label-placeholder-clr: #6c757d;
      --multiselect-label-placeholder-fs: 14px;
      --multiselect-label-placeholder-fw: 400;
      --multiselect-label-placeholder-lh: 1.2;
      --multiselect-chip-list-gap: 0.5rem;
      --multiselect-chip-margin-ie: 8px;
      --multiselect-chip-gap: 8px;
      --multiselect-chip-py: 0.375rem;
      --multiselect-chip-px: 0.75rem;
      --multiselect-chip-bg: #dee2e6;
      --multiselect-chip-clr: #495057;
      --multiselect-chip-fs: 12px;
      --multiselect-chip-fw: 400;
      --multiselect-chip-lh: 1.2;
      --multiselect-chip-border-clr: transparent;
      --multiselect-chip-border-width: 1px;
      --multiselect-chip-border-radius: 16px;
      --multiselect-chip-icon-bg: #F8FAFC;
      --multiselect-chip-icon-clr: rgb(206 215 227);
      --multiselect-chip-icon-border-radius: 100%;
      --multiselect-chip-icon-width: 16px;
      --multiselect-chip-icon-height: 16px;
      --multiselect-chip-filled-py: 0.375rem;
      --multiselect-chip-filled-px: 0.75rem;
      --multiselect-trigger-bg: transparent;
      --multiselect-trigger-clr: #6c757d;
      --multiselect-trigger-width: 3rem;
      --multiselect-trigger-border-radius-ss: 0px;
      --multiselect-trigger-border-radius-se: 6px;
      --multiselect-trigger-border-radius-es: 0px;
      --multiselect-trigger-border-radius-ee: 6px;
      --multiselect-trigger-icon-width: 12px;
      --multiselect-trigger-icon-clr: #CED7E3;
      --multiselect-clear-label-wrapper-pinline-end: 1.75rem;
      --multiselect-clear-icon-width: 12px;
      --multiselect-clear-icon-clr: #6c757d;
      --multiselect-clear-icon-inset-ie: 3rem;
      --multiselect-focus-border-clr: #3B82F6;
      --multiselect-focus-boxshadow: 0 0 0 0.2rem #BFDBFE;
      --multiselect-hover-border-clr: #3B82F6;
      --multiselect-invalid-border-clr: #e24c4c;
    }
    .p-multiselect-overlay {
      margin-block: var(--multiselect-ddl-my, 8px 0);
      background: var(--multiselect-ddl-bg, white);
      color: var(--multiselect-ddl-clr, #495057);
      border: solid var(--multiselect-ddl-border-clr, transparent);
      border-width: var(--multiselect-ddl-border-width, 0px);
      border-radius: var(--multiselect-ddl-border-radius, 6px);
      box-shadow: var(--multiselect-ddl-boxshadow, 0 2px 12px 0 rgba(0, 0, 0, 0.1));
    }
    .p-multiselect-overlay .p-multiselect-list {
      gap: var(--multiselect-ddl-items-container-gap, 0.5rem);
      padding-block: var(--multiselect-ddl-items-container-py, 0.75rem);
      padding-inline: var(--multiselect-ddl-items-container-px, 0);
    }
    .p-multiselect-overlay .p-multiselect-list p-multiselect-item .p-multiselect-option {
      justify-content: space-between;
      gap: var(--multiselect-ddl-item-gap, 0.5rem);
      margin-block: var(--multiselect-ddl-item-my, 0 8px);
      padding-block: var(--multiselect-ddl-item-py, 0.75rem);
      padding-inline: var(--multiselect-ddl-item-px, 1.25rem);
      border: solid var(--multiselect-ddl-item-border-clr, transparent);
      border-width: var(--multiselect-ddl-item-border-width, 0px);
      font-size: var(--multiselect-ddl-item-fs, 14px);
      font-weight: var(--multiselect-ddl-item-fw, 400);
      line-height: var(--multiselect-ddl-item-lh, 1.2);
      color: var(--multiselect-ddl-item-clr, #495057);
      background: var(--multiselect-ddl-item-bg, transparent);
      border-radius: var(--multiselect-ddl-item-border-radius, 0);
      transition: box-shadow 0.2s;
    }
    .p-multiselect-overlay .p-multiselect-list p-multiselect-item .p-multiselect-option.p-multiselect-option-selected {
      color: var(--multiselect-ddl-item-highlight-clr, #1D4ED8);
      background: var(--multiselect-ddl-item-highlight-bg, #EFF6FF);
    }
    .p-multiselect-overlay .p-multiselect-list p-multiselect-item .p-multiselect-option:not(.p-multiselect-option-selected):not(.p-disabled).p-focus {
      color: var(--multiselect-ddl-item-focus-clr, #495057);
      background: var(--multiselect-ddl-item-focus-bg, #dee2e6);
    }
    .p-multiselect-overlay .p-multiselect-list p-multiselect-item .p-multiselect-option:not(.p-multiselect-option-selected):not(.p-disabled):hover {
      color: var(--multiselect-ddl-item-hover-clr, #495057);
      background: var(--multiselect-ddl-item-hover-bg, #e9ecef);
    }
    .p-multiselect-overlay .p-multiselect-list p-multiselect-item .p-multiselect-option > p-checkbox {
      display: var(--multiselect-ddl-item-checkicon-display, inline-flex);
      color: var(--multiselect-ddl-item-checkicon-clr, #1D4ED8);
      order: 2;
    }
    .p-multiselect-overlay .p-multiselect-list p-multiselect-item .p-multiselect-option > p-checkbox .p-checkbox-icon {
      width: var(--multiselect-ddl-item-checkicon-width, 14px);
    }
    .p-multiselect-overlay .p-multiselect-list p-multiselect-item:last-child .p-multiselect-option {
      margin-block: 0;
    }
    .p-multiselect-overlay .p-multiselect-list .p-multiselect-item-group {
      margin: 0;
      padding-block: var(--multiselect-ddl-item-group-py, 0.75rem);
      padding-inline: var(--multiselect-ddl-item-group-px, 1.25rem);
      color: var(--multiselect-ddl-item-group-clr, #343a40);
      background: var(--multiselect-ddl-item-group-bg, white);
      font-size: var(--multiselect-ddl-item-group-fs, 16px);
      font-weight: var(--multiselect-ddl-item-group-fw, 700);
      line-height: var(--multiselect-ddl-item-group-lh, 1.2);
    }
    .p-multiselect-overlay .p-multiselect-list .p-multiselect-empty-message {
      padding-block: var(--multiselect-ddl-item-empty-py, 0.75rem);
      padding-inline: var(--multiselect-ddl-item-empty-px, 1.25rem);
      color: var(--multiselect-ddl-item-empty-clr, #495057);
      background: var(--multiselect-ddl-item-empty-bg, transparent);
    }
    .p-multiselect-overlay {
      --multiselect-ddl-bg: white;
      --multiselect-ddl-clr: #495057;
      --multiselect-ddl-border-clr: transparent;
      --multiselect-ddl-border-width: 0px;
      --multiselect-ddl-border-radius: 6px;
      --multiselect-ddl-boxshadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
      --multiselect-ddl-item-gap: 0.5rem;
      --multiselect-ddl-items-container-py: 0.75rem;
      --multiselect-ddl-items-container-px: 0;
      --multiselect-ddl-items-container-gap: 0.5rem;
      --multiselect-ddl-item-py: 0.75rem;
      --multiselect-ddl-item-px: 1.25rem;
      --multiselect-ddl-item-border-clr: transparent;
      --multiselect-ddl-item-border-width: 0px;
      --multiselect-ddl-item-fs: 14px;
      --multiselect-ddl-item-fw: 400;
      --multiselect-ddl-item-lh: 1.2;
      --multiselect-ddl-item-clr: #495057;
      --multiselect-ddl-item-bg: transparent;
      --multiselect-ddl-item-border-radius: 0;
      --multiselect-ddl-item-highlight-clr: #1D4ED8;
      --multiselect-ddl-item-highlight-bg: #EFF6FF;
      --multiselect-ddl-item-highlight-focus-bg: rgba(59, 130, 246, 0.24);
      --multiselect-ddl-item-focus-clr: #495057;
      --multiselect-ddl-item-focus-bg: #dee2e6;
      --multiselect-ddl-item-hover-clr: #495057;
      --multiselect-ddl-item-hover-bg: #e9ecef;
      --multiselect-ddl-item-checkicon-display: inline-flex;
      --multiselect-ddl-item-checkicon-clr: #1D4ED8;
      --multiselect-ddl-item-checkicon-width: 14px;
      --multiselect-ddl-item-group-py: 0.75rem;
      --multiselect-ddl-item-group-px: 1.25rem;
      --multiselect-ddl-item-group-clr: #343a40;
      --multiselect-ddl-item-group-bg: white;
      --multiselect-ddl-item-group-fs: 16px;
      --multiselect-ddl-item-group-fw: 700;
      --multiselect-ddl-item-group-lh: 1.2;
      --multiselect-ddl-item-empty-py: 0.75rem;
      --multiselect-ddl-item-empty-px: 1.25rem;
      --multiselect-ddl-item-empty-clr: #495057;
      --multiselect-ddl-item-empty-bg: transparent;
    }
    .p-treeselect {
      max-width: 100%;
      width: auto;
      min-width: var(--ptreeselect-minwidth, 250px);
      padding-block: var(--ptreeselect-py, 6px);
      padding-inline: var(--ptreeselect-px, 16px);
      border-width: var(--ptreeselect-border-width, 1px);
      border-style: solid;
      border-color: var(--ptreeselect-border-clr, #cbd5e1);
    }
    .p-treeselect.p-treeselect-open {
      border-color: var(--ptreeselect-opened-border-clr, var(--clr-primary));
    }
    .p-treeselect .p-treeselect-label {
      font-size: var(--ptreeselect-label-fs, 16px);
      font-weight: var(--ptreeselect-label-fw, 400);
      color: var(--ptreeselect-label-clr, #4C515B);
      line-height: var(--ptreeselect-label-lh, 20px);
    }
    .p-treeselect .p-treeselect-dropdown {
      width: var(--ptreeselect-icon-width, auto);
      color: var(--ptreeselect-icon-clr, #6B7280);
    }
    .p-treeselect {
      --ptreeselect-minwidth: 250px;
      --ptreeselect-py: 6px;
      --ptreeselect-px: 16px;
      --ptreeselect-border-width: 1px;
      --ptreeselect-border-clr: #cbd5e1;
      --ptreeselect-opened-border-clr: var(--clr-primary);
      --ptreeselect-label-fs: 16px;
      --ptreeselect-label-fw: 400;
      --ptreeselect-label-clr: #4C515B;
      --ptreeselect-label-lh: 30px;
      --ptreeselect-icon-width: auto;
      --ptreeselect-icon-clr: #6B7280;
      --ptreeselect-ddl-bg: white;
      --ptreeselect-ddl-clr: #4C515B;
      --ptreeselect-ddl-border-clr: transparent;
      --ptreeselect-ddl-border-radius: 0.5rem;
      --ptreeselect-ddl-shadow: none;
    }
    .p-treeselect-overlay {
      background: var(--ptreeselect-ddl-bg, white);
      color: var(--ptreeselect-ddl-clr, #4C515B);
      border: 1px solid var(--ptreeselect-ddl-border-clr, transparent);
      border-radius: var(--ptreeselect-ddl-border-radius, 0.5rem);
      box-shadow: var(--ptreeselect-ddl-shadow, none);
      overflow: hidden;
    }
    .het-form-control:-webkit-autofill,
    .het-form-control:-webkit-autofill:hover,
    .het-form-control:-webkit-autofill:focus,
    input:-webkit-autofill,
    input:-webkit-autofill:hover,
    input:-webkit-autofill:focus,
    textarea:-webkit-autofill,
    textarea:-webkit-autofill:hover,
    textarea:-webkit-autofill:focus,
    select:-webkit-autofill,
    select:-webkit-autofill:hover,
    select:-webkit-autofill:focus {
      transition: background-color 5000s ease-in-out 0s;
      -webkit-text-fill-color: var(--form-control-autofill-clr, #2B374D);
    }
  }
  @layer tables {
    .p-datatable .p-datatable-table {
      width: 100%;
      border-collapse: separate;
      vertical-align: middle;
      background: var(--table-bg, transparent);
      border-spacing: var(--table-border-spacing, 0px) !important;
      border-width: var(--table-border-width, 1px 1px 0 1px);
      border-style: solid;
      border-color: var(--table-border-clr, transparent);
      border-start-start-radius: var(--table-border-ss-radius, 0px);
      border-start-end-radius: var(--table-border-se-radius, 0px);
      border-end-start-radius: var(--table-border-es-radius, 0px);
      border-end-end-radius: var(--table-border-ee-radius, 0px);
      font-weight: var(--table-fw, 400);
      margin-bottom: var(--table-mb, 0px);
    }
    .p-datatable .p-datatable-table .p-datatable-thead > tr > th {
      padding-block: var(--table-thead-th-padding-block, 1rem);
      padding-inline: var(--table-thead-th-padding-inline, 1rem);
      font-size: var(--table-thead-th-fs, 16px);
      font-weight: var(--table-thead-th-fw, 700);
      line-height: var(--table-thead-th-lh, 1.5);
      text-transform: var(--table-thead-th-texttransform, none);
      min-height: var(--table-thead-th-minheight, auto);
      color: var(--table-thead-th-clr, #343a40);
      background: var(--table-thead-th-bg, #f8f9fa);
      border: 1px solid var(--table-thead-th-border-clr, #dee2e6);
      border-block-width: var(--table-thead-th-border-block-width, 0 1px);
      border-inline-width: var(--table-thead-th-border-inline-width, 0);
      text-align: var(--table-thead-th-textalign, start);
      transition: box-shadow 0.2s;
    }
    .p-datatable .p-datatable-table .p-datatable-thead > tr > th:first-child {
      border-start-start-radius: var(--table-border-ss-radius);
    }
    .p-datatable .p-datatable-table .p-datatable-thead > tr > th:last-child {
      border-start-end-radius: var(--table-border-se-radius);
    }
    .p-datatable .p-datatable-table .p-datatable-thead > tr > th.table-action {
      width: 0;
    }
    .p-datatable .p-datatable-table .p-datatable-thead > tr > th.sticky-col {
      position: -webkit-sticky;
      position: sticky;
    }
    .p-datatable .p-datatable-table .p-datatable-thead > tr > th.sticky-col:dir(ltr) {
      right: 0;
    }
    .p-datatable .p-datatable-table .p-datatable-thead > tr > th.sticky-col:dir(rtl) {
      left: 0;
    }
    .p-datatable .p-datatable-table .p-datatable-tbody > tr {
      background: var(--table-tbody-tr-bg, white);
      color: var(--table-tbody-tr-clr, #495057);
      transition: box-shadow 0.2s;
    }
    .p-datatable .p-datatable-table .p-datatable-tbody > tr > td {
      text-align: var(--table-tbody-td-textalign, start);
      padding-block: var(--table-tbody-td-padding-block, 1rem);
      padding-inline: var(--table-tbody-td-padding-inline, 1rem);
      font-size: var(--table-tbody-td-fs, 16px);
      font-weight: var(--table-tbody-td-fw, 400);
      line-height: var(--table-tbody-td-lh, 1.5);
      min-height: var(--table-tbody-td-minheight, auto);
      color: var(--table-tbody-td-clr, #495057);
      background: var(--table-tbody-td-bg, inherit);
      border: 1px solid var(--table-tbody-td-border-clr, #dee2e6);
      border-block-width: var(--table-tbody-td-border-block-width, 0 1px);
      border-inline-width: var(--table-tbody-td-border-inline-width, 0);
    }
    .p-datatable .p-datatable-table .p-datatable-tbody > tr > td .table-action {
      display: inline-flex;
      align-items: center;
      gap: var(--table-tbody-td-action-gap, 8px);
    }
    .p-datatable .p-datatable-table .p-datatable-tbody > tr > td.table-nodata {
      text-align: center;
      height: var(--table-tbody-td-nodata-height, 200px);
      background: var(--table-tbody-td-nodata-bg, transparent);
      border: 1px solid var(--table-tbody-td-borderbottom-clr, transparent);
      border-block-width: var(--table-tbody-td-border-block-width, 0);
      border-inline-width: var(--table-tbody-td-border-inline-width, 0);
    }
    .p-datatable .p-datatable-table .p-datatable-tbody > tr > td.table-nodata .svg-icon {
      margin-block: var(--table-tbody-td-nodata-img-my, 0 20px);
    }
    .p-datatable .p-datatable-table .p-datatable-tbody > tr > td.table-nodata .svg-icon svg {
      width: var(--table-tbody-td-nodata-img-width, 230px);
      height: auto;
    }
    .p-datatable .p-datatable-table .p-datatable-tbody > tr > td.table-nodata p {
      color: var(--table-tbody-td-nodata-clr, #495057);
      font-size: var(--table-tbody-td-nodata-fs, 16px);
      font-weight: var(--table-tbody-td-nodata-fw, 400);
    }
    .p-datatable .p-datatable-table .p-datatable-tbody > tr > td .p-row-toggler,
    .p-datatable .p-datatable-table .p-datatable-tbody > tr > td .p-row-editor-init,
    .p-datatable .p-datatable-table .p-datatable-tbody > tr > td .p-row-editor-save,
    .p-datatable .p-datatable-table .p-datatable-tbody > tr > td .p-row-editor-cancel {
      width: 2rem;
      height: 2rem;
      color: #6c757d;
      border: 0 none;
      background: transparent;
      border-radius: 50%;
      transition:
        background-color 0.2s,
        color 0.2s,
        box-shadow 0.2s;
    }
    .p-datatable .p-datatable-table .p-datatable-tbody > tr > td .p-row-toggler:enabled:hover,
    .p-datatable .p-datatable-table .p-datatable-tbody > tr > td .p-row-editor-init:enabled:hover,
    .p-datatable .p-datatable-table .p-datatable-tbody > tr > td .p-row-editor-save:enabled:hover,
    .p-datatable .p-datatable-table .p-datatable-tbody > tr > td .p-row-editor-cancel:enabled:hover {
      color: #343a40;
      border-color: transparent;
      background: #e9ecef;
    }
    .p-datatable .p-datatable-table .p-datatable-tbody > tr > td .p-row-toggler:focus-visible,
    .p-datatable .p-datatable-table .p-datatable-tbody > tr > td .p-row-editor-init:focus-visible,
    .p-datatable .p-datatable-table .p-datatable-tbody > tr > td .p-row-editor-save:focus-visible,
    .p-datatable .p-datatable-table .p-datatable-tbody > tr > td .p-row-editor-cancel:focus-visible {
      outline: 0 none;
      outline-offset: 0;
      box-shadow: 0 0 0 0.2rem #BFDBFE;
    }
    .p-datatable .p-datatable-table .p-datatable-tbody > tr > td .p-row-editor-save {
      margin-right: 0.5rem;
    }
    .p-datatable .p-datatable-table .p-datatable-tbody > tr:last-child td:first-child {
      border-end-start-radius: var(--table-border-es-radius);
    }
    .p-datatable .p-datatable-table .p-datatable-tbody > tr:last-child td:last-child {
      border-end-end-radius: var(--table-border-ee-radius);
    }
    .p-datatable .p-datatable-table .p-datatable-tbody > tr:focus-visible {
      outline: var(--table-tbody-tr-focus-outline, 0.15rem solid #BFDBFE);
      outline-offset: -0.15rem;
    }
    .p-datatable .p-datatable-table .p-datatable-tbody > tr.p-highlight {
      background: var(--table-tbody-tr-highlight-bg, #EFF6FF);
      color: var(--table-tbody-tr-highlight-clr, #1D4ED8);
    }
    .p-datatable .p-datatable-table .p-datatable-tbody > tr.p-datatable-dragpoint-top > td {
      box-shadow: inset 0 2px 0 0 #EFF6FF;
      box-shadow: inset 0 2px 0 0 #3B82F6;
    }
    .p-datatable .p-datatable-table .p-datatable-tbody > tr.p-datatable-dragpoint-bottom > td {
      box-shadow: inset 0 -2px 0 0 #EFF6FF;
      box-shadow: inset 0 -2px 0 0 #3B82F6;
    }
    .p-datatable .p-datatable-table .p-datatable-tfoot > tr > td {
      text-align: var(--table-tfoot-td-textalign, start);
      padding-block: var(--table-tfoot-td-padding-block, 1rem);
      padding-inline: var(--table-tfoot-td-padding-inline, 1rem);
      font-size: var(--table-tfoot-td-fs, 16px);
      font-weight: var(--table-tfoot-td-fw, 700);
      line-height: var(--table-tfoot-td-lh, 1.5);
      min-height: var(--table-tfoot-td-minheight, auto);
      color: var(--table-tfoot-td-clr, #343a40);
      background: var(--table-tfoot-td-bg, #f8f9fa);
      border: 1px solid var(--table-tfoot-td-border-clr, #dee2e6);
      border-block-width: var(--table-tfoot-td-border-block-width, 0 1px);
      border-inline-width: var(--table-tfoot-td-border-inline-width, 0);
    }
    .p-datatable .p-datatable-header {
      background: var(--table-caption-bg, #f8f9fa);
      color: var(--table-caption-clr, #343a40);
      border: 1px solid var(--table-caption-border-clr, #dee2e6);
      border-block-width: var(--table-caption-border-block-width, 1px);
      border-inline-width: var(--table-caption-border-inline-width, 0px);
      padding-block: var(--table-caption-py, 1rem);
      padding-inline: var(--table-caption-px, 1rem);
      font-size: var(--table-caption-fs, 16px);
      font-weight: var(--table-caption-fw, 700);
    }
    .p-datatable .p-datatable-footer {
      background: var(--table-summary-bg, #f8f9fa);
      color: var(--table-summary-clr, #343a40);
      border: 1px solid var(--table-summary-border-clr, #dee2e6);
      border-block-width: var(--table-summary-border-block-width, 0 1px);
      border-inline-width: var(--table-summary-border-inline-width, 0px);
      padding-block: var(--table-summary-py, 1rem);
      padding-inline: var(--table-summary-px, 1rem);
      font-size: var(--table-summary-fs, 16px);
      font-weight: var(--table-summary-fw, 700);
    }
    .p-datatable .p-sortable-column .p-sortable-column-icon {
      color: var(--table-sort-icon-clr, #343a40);
      margin-inline: var(--table-sort-icon-mx, 0.5rem 0);
    }
    .p-datatable .p-sortable-column .p-sortable-column-badge {
      border-radius: 50%;
      height: 1.143rem;
      min-width: 1.143rem;
      line-height: 1.143rem;
      color: #1D4ED8;
      background: #EFF6FF;
      margin-left: 0.5rem;
    }
    .p-datatable .p-sortable-column:not(.p-highlight):hover {
      background: var(--table-sort-th-hover-bg, #e9ecef) !important;
      color: var(--table-sort-th-hover-clr, #343a40) !important;
    }
    .p-datatable .p-sortable-column:not(.p-highlight):hover .p-sortable-column-icon {
      color: var(--table-sort-icon-hover-clr, #343a40);
    }
    .p-datatable .p-sortable-column.p-highlight {
      background: var(--table-sort-th-highlight-bg, #EFF6FF) !important;
      color: var(--table-sort-th-highlight-clr, #1D4ED8) !important;
    }
    .p-datatable .p-sortable-column.p-highlight .p-sortable-column-icon {
      color: var(--table-sort-icon-highlight-clr, #1D4ED8);
    }
    .p-datatable .p-sortable-column.p-highlight:hover {
      background: var(--table-sort-th-highlight-hover-bg, #EFF6FF) !important;
      color: var(--table-sort-th-highlight-hover-clr, #1D4ED8) !important;
    }
    .p-datatable .p-sortable-column.p-highlight:hover .p-sortable-column-icon {
      color: var(--table-sort-icon-highlight-hover-clr, #1D4ED8);
    }
    .p-datatable .p-sortable-column:focus-visible {
      box-shadow: inset 0 0 0 0.15rem #BFDBFE;
      outline: 0 none;
    }
    .p-datatable.p-datatable-hoverable-rows .p-datatable-tbody > tr:not(.p-highlight):hover {
      background: #e9ecef;
      color: #495057;
    }
    .p-datatable.p-datatable-gridlines .p-datatable-header {
      border-width: 1px 1px 0 1px;
    }
    .p-datatable.p-datatable-gridlines .p-datatable-footer {
      border-width: 0 1px 1px 1px;
    }
    .p-datatable.p-datatable-gridlines .p-paginator-top {
      border-width: 0 1px 0 1px;
    }
    .p-datatable.p-datatable-gridlines .p-paginator-bottom {
      border-width: 0 1px 1px 1px;
    }
    .p-datatable.p-datatable-gridlines .p-datatable-thead > tr > th {
      border-width: 1px 0 1px 1px;
    }
    .p-datatable.p-datatable-gridlines .p-datatable-thead > tr > th:last-child {
      border-width: 1px;
    }
    .p-datatable.p-datatable-gridlines .p-datatable-thead + .p-datatable-tfoot > tr > td {
      border-width: 0 0 1px 1px;
    }
    .p-datatable.p-datatable-gridlines .p-datatable-thead + .p-datatable-tfoot > tr > td:last-child {
      border-width: 0 1px 1px 1px;
    }
    .p-datatable.p-datatable-gridlines .p-datatable-tbody > tr > td {
      border-width: 1px 0 0 1px;
    }
    .p-datatable.p-datatable-gridlines .p-datatable-tbody > tr > td:last-child {
      border-width: 1px 1px 0 1px;
    }
    .p-datatable.p-datatable-gridlines .p-datatable-tbody > tr:last-child > td {
      border-width: 1px 0 1px 1px;
    }
    .p-datatable.p-datatable-gridlines .p-datatable-tbody > tr:last-child > td > td:last-child {
      border-width: 1px;
    }
    .p-datatable.p-datatable-gridlines .p-datatable-tfoot > tr > td {
      border-width: 1px 0 1px 1px;
    }
    .p-datatable.p-datatable-gridlines .p-datatable-tfoot > tr > td:last-child {
      border-width: 1px 1px 1px 1px;
    }
    .p-datatable.p-datatable-gridlines:has(.p-datatable-tbody):has(.p-datatable-thead) .p-datatable-tbody > tr > td {
      border-width: 0 0 1px 1px;
    }
    .p-datatable.p-datatable-gridlines:has(.p-datatable-tbody):has(.p-datatable-thead) .p-datatable-tbody > tr > td:last-child {
      border-width: 0 1px 1px 1px;
    }
    .p-datatable.p-datatable-gridlines:has(.p-datatable-tbody):has(.p-datatable-tfoot) .p-datatable-tbody > tr:last-child > td {
      border-width: 0 0 0 1px;
    }
    .p-datatable.p-datatable-gridlines:has(.p-datatable-tbody):has(.p-datatable-tfoot) .p-datatable-tbody > tr:last-child > td:last-child {
      border-width: 0 1px 0 1px;
    }
    .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even) {
      background: #fcfcfc;
    }
    .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight {
      background: #EFF6FF;
      color: #1D4ED8;
    }
    .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight .p-row-toggler {
      color: #1D4ED8;
    }
    .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight .p-row-toggler:hover {
      color: #1D4ED8;
    }
    .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table .p-datatable-thead,
    .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table .p-datatable-thead {
      background: var(--table-thead-th-bg, #f8f9fa);
    }
    .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table .p-datatable-tfoot,
    .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table .p-datatable-tfoot {
      background: var(--table-tfoot-td-bg, #f8f9fa);
    }
    .p-datatable.p-datatable-sm .p-datatable-header {
      padding-block: var(--table-caption-padding-block-sm, 0.5rem);
      padding-inline: var(--table-caption-padding-inline-sm, 0.5rem);
    }
    .p-datatable.p-datatable-sm .p-datatable-footer {
      padding-block: var(--table-summary-padding-block-sm, 0.5rem);
      padding-inline: var(--table-summary-padding-inline-sm, 0.5rem);
    }
    .p-datatable.p-datatable-sm .p-datatable-thead > tr > th {
      padding-block: var(--table-thead-th-padding-block-sm, 0.5rem);
      padding-inline: var(--table-thead-th-padding-inline-sm, 0.5rem);
    }
    .p-datatable.p-datatable-sm .p-datatable-tbody > tr > td {
      padding-block: var(--table-tbody-td-padding-block-sm, 0.5rem);
      padding-inline: var(--table-tbody-td-padding-inline-sm, 0.5rem);
    }
    .p-datatable.p-datatable-sm .p-datatable-tfoot > tr > td {
      padding-block: var(--table-tfoot-td-padding-block-sm, 0.5rem);
      padding-inline: var(--table-tfoot-td-padding-inline-sm, 0.5rem);
    }
    .p-datatable.p-datatable-lg .p-datatable-header {
      padding-block: var(--table-caption-padding-block-lg, 1.25rem);
      padding-inline: var(--table-caption-padding-inline-lg, 1.25rem);
    }
    .p-datatable.p-datatable-lg .p-datatable-footer {
      padding-block: var(--table-summary-padding-block-lg, 1.25rem);
      padding-inline: var(--table-summary-padding-inline-lg, 1.25rem);
    }
    .p-datatable.p-datatable-lg .p-datatable-thead > tr > th {
      padding-block: var(--table-thead-th-padding-block-lg, 1.25rem);
      padding-inline: var(--table-thead-th-padding-inline-lg, 1.25rem);
    }
    .p-datatable.p-datatable-lg .p-datatable-tbody > tr > td {
      padding-block: var(--table-tbody-td-padding-block-lg, 1.25rem);
      padding-inline: var(--table-tbody-td-padding-inline-lg, 1.25rem);
    }
    .p-datatable.p-datatable-lg .p-datatable-tfoot > tr > td {
      padding-block: var(--table-tfoot-td-padding-block-lg, 1.25rem);
      padding-inline: var(--table-tfoot-td-padding-inline-lg, 1.25rem);
    }
    .p-datatable .p-datatable-loading-icon {
      font-size: 2rem;
    }
    .p-datatable .p-datatable-scrollable-header,
    .p-datatable .p-datatable-scrollable-footer {
      background: #f8f9fa;
    }
    .p-datatable .p-column-resizer-helper {
      background: #3B82F6;
    }
    .p-datatable {
      --table-bg: transparent;
      --table-border-spacing: 0;
      --table-border-width: 1px 1px 0 1px;
      --table-border-clr: transparent;
      --table-border-ss-radius: 0;
      --table-border-se-radius: 0;
      --table-border-es-radius: 0;
      --table-border-ee-radius: 0;
      --table-fw: 400;
      --table-mb: 0;
      --table-thead-th-padding-block: 1rem;
      --table-thead-th-padding-inline: 1rem;
      --table-thead-th-fs: 16px;
      --table-thead-th-fw: 700;
      --table-thead-th-lh: 1.5;
      --table-thead-th-texttransform: none;
      --table-thead-th-minheight: auto;
      --table-thead-th-clr: #343a40;
      --table-thead-th-bg: #f8f9fa;
      --table-thead-th-border-clr: #dee2e6;
      --table-thead-th-border-block-width: 0 1px;
      --table-thead-th-border-inline-width: 0;
      --table-thead-th-textalign: start;
      --table-tbody-tr-bg: white;
      --table-tbody-tr-clr: #495057;
      --table-tbody-td-textalign: start;
      --table-tbody-td-padding-block: 1rem;
      --table-tbody-td-padding-inline: 1rem;
      --table-tbody-td-fs: 16px;
      --table-tbody-td-fw: 400;
      --table-tbody-td-lh: 1.5;
      --table-tbody-td-minheight: auto;
      --table-tbody-td-clr: #495057;
      --table-tbody-td-bg: inherit;
      --table-tbody-td-border-clr: #dee2e6;
      --table-tbody-td-border-block-width: 0 1px;
      --table-tbody-td-border-inline-width: 0;
      --table-tbody-td-action-gap: 8px;
      --table-tbody-td-nodata-height: 200px;
      --table-tbody-td-nodata-bg: transparent;
      --table-tbody-td-nodata-clr: #495057;
      --table-tbody-td-nodata-fs: 16px;
      --table-tbody-td-nodata-fw: 700;
      --table-tbody-td-nodata-img-width: 230px;
      --table-tbody-td-nodata-img-my: 0 20px;
      --table-tbody-tr-focus-outline: 0.15rem solid #BFDBFE;
      --table-tbody-tr-highlight-bg: #EFF6FF;
      --table-tbody-tr-highlight-clr: #1D4ED8;
      --table-tfoot-td-textalign: start;
      --table-tfoot-td-padding-block: 1rem;
      --table-tfoot-td-padding-inline: 1rem;
      --table-tfoot-td-fs: 16px;
      --table-tfoot-td-fw: 700;
      --table-tfoot-td-lh: 1.5;
      --table-tfoot-td-minheight: auto;
      --table-tfoot-td-clr: #343a40;
      --table-tfoot-td-bg: #f8f9fa;
      --table-tfoot-td-border-clr: #dee2e6;
      --table-tfoot-td-border-block-width: 0 1px;
      --table-tfoot-td-border-inline-width: 0;
      --table-caption-bg: #f8f9fa;
      --table-caption-clr: #343a40;
      --table-caption-border-clr: #dee2e6;
      --table-caption-border-block-width: 1px;
      --table-caption-border-inline-width: 0px;
      --table-caption-py: 1rem;
      --table-caption-px: 1rem;
      --table-caption-fs: 16px;
      --table-caption-fw: 700;
      --table-summary-bg: #f8f9fa;
      --table-summary-clr: #343a40;
      --table-summary-border-clr: #dee2e6;
      --table-summary-border-block-width: 0 1px;
      --table-summary-border-inline-width: 0px;
      --table-summary-py: 1rem;
      --table-summary-px: 1rem;
      --table-summary-fs: 16px;
      --table-summary-fw: 700;
      --table-sort-icon-clr: #343a40;
      --table-sort-icon-mx: 0.5rem 0;
      --table-sort-th-hover-bg: #e9ecef;
      --table-sort-th-hover-clr: #343a40;
      --table-sort-icon-hover-clr: #343a40;
      --table-sort-th-highlight-bg: #EFF6FF;
      --table-sort-th-highlight-clr: #1D4ED8;
      --table-sort-icon-highlight-clr: #1D4ED8;
      --table-sort-th-highlight-hover-bg: #EFF6FF;
      --table-sort-th-highlight-hover-clr: #1D4ED8;
      --table-sort-icon-highlight-hover-clr: #1D4ED8;
      --table-caption-padding-block-sm: 0.5rem;
      --table-caption-padding-inline-sm: 0.5rem;
      --table-summary-padding-block-sm: 0.5rem;
      --table-summary-padding-inline-sm: 0.5rem;
      --table-thead-th-padding-block-sm: 0.5rem;
      --table-thead-th-padding-inline-sm: 0.5rem;
      --table-tbody-td-padding-block-sm: 0.5rem;
      --table-tbody-td-padding-inline-sm: 0.5rem;
      --table-tfoot-td-padding-block-sm: 0.5rem;
      --table-tfoot-td-padding-inline-sm: 0.5rem;
      --table-caption-padding-block-lg: 1.25rem;
      --table-caption-padding-inline-lg: 1.25rem;
      --table-summary-padding-block-lg: 1.25rem;
      --table-summary-padding-inline-lg: 1.25rem;
      --table-thead-th-padding-block-lg: 1.25rem;
      --table-thead-th-padding-inline-lg: 1.25rem;
      --table-tbody-td-padding-block-lg: 1.25rem;
      --table-tbody-td-padding-inline-lg: 1.25rem;
      --table-tfoot-td-padding-block-lg: 1.25rem;
      --table-tfoot-td-padding-inline-lg: 1.25rem;
    }
    .p-treetable .p-treetable-thead > tr > th {
      padding-block: var(--tabletree-thead-th-padding-block, 1rem);
      padding-inline: var(--tabletree-thead-th-padding-inline, 1rem);
      font-size: var(--tabletree-thead-th-fs, 16px);
      font-weight: var(--tabletree-thead-th-fw, 700);
      line-height: var(--tabletree-thead-th-lh, 1.5);
      text-transform: var(--tabletree-thead-th-texttransform, none);
      min-height: var(--tabletree-thead-th-minheight, auto);
      color: var(--tabletree-thead-th-clr, #343a40);
      background: var(--tabletree-thead-th-bg, #f8f9fa);
      border: 1px solid var(--tabletree-thead-th-border-clr, #dee2e6);
      border-block-width: var(--tabletree-thead-th-border-block-width, 0 1px);
      border-inline-width: var(--tabletree-thead-th-border-inline-width, 0);
      text-align: var(--tabletree-thead-th-textalign, start);
      transition: box-shadow 0.2s;
    }
    .p-treetable .p-treetable-thead > tr > th:first-child {
      border-start-start-radius: var(--tabletree-border-ss-radius);
    }
    .p-treetable .p-treetable-thead > tr > th:last-child {
      border-start-end-radius: var(--tabletree-border-se-radius);
    }
    .p-treetable .p-treetable-thead > tr > th.table-action {
      width: var(--tabletree-thead-th-action-width, 80px);
    }
    .p-treetable .p-treetable-tbody > tr {
      background: var(--tabletree-tbody-tr-bg, white);
      color: var(--tabletree-tbody-tr-clr, #495057);
      transition: box-shadow 0.2s;
    }
    .p-treetable .p-treetable-tbody > tr > td {
      text-align: var(--tabletree-tbody-td-textalign, start);
      padding-block: var(--tabletree-tbody-td-padding-block, 1rem);
      padding-inline: var(--tabletree-tbody-td-padding-inline, 1rem);
      font-size: var(--tabletree-tbody-td-fs, 16px);
      font-weight: var(--tabletree-tbody-td-fw, 400);
      line-height: var(--tabletree-tbody-td-lh, 1.5);
      min-height: var(--tabletree-tbody-td-minheight, auto);
      color: var(--tabletree-tbody-td-clr, #495057);
      background: var(--tabletree-tbody-td-bg, inherit);
      border: 1px solid var(--tabletree-tbody-td-border-clr, #dee2e6);
      border-block-width: var(--tabletree-tbody-td-border-block-width, 0 1px);
      border-inline-width: var(--tabletree-tbody-td-border-inline-width, 0);
    }
    .p-treetable .p-treetable-tbody > tr > td:has(.table-action) {
      width: var(--tabletree-thead-th-action-width, 80px);
    }
    .p-treetable .p-treetable-tbody > tr > td .table-action {
      display: inline-flex;
      align-items: center;
      gap: var(--tabletree-tbody-td-action-gap, 8px);
    }
    .p-treetable .p-treetable-tbody > tr > td.table-nodata {
      text-align: center;
      height: var(--tabletree-tbody-td-nodata-height, 200px);
      background: var(--tabletree-tbody-td-nodata-bg, transparent);
      color: var(--tabletree-tbody-td-nodata-clr, #495057);
      font-size: var(--tabletree-tbody-td-nodata-fs, 16px);
      font-weight: var(--tabletree-tbody-td-nodata-fw, 400);
      border: 1px solid var(--tabletree-tbody-td-borderbottom-clr, transparent);
      border-block-width: var(--tabletree-tbody-td-border-block-width, 0);
      border-inline-width: var(--tabletree-tbody-td-border-inline-width, 0);
    }
    .p-treetable .p-treetable-tbody > tr > td.table-nodata .svg-icon {
      margin-block: var(--tabletree-tbody-td-nodata-img-my, 0 20px);
    }
    .p-treetable .p-treetable-tbody > tr > td.table-nodata .svg-icon svg {
      width: var(--tabletree-tbody-td-nodata-img-width, 230px);
      height: auto;
    }
    .p-treetable .p-treetable-tbody > tr > td .p-treetable-toggler {
      margin-left: 0 !important;
      margin-right: 0 !important;
      width: var(--tabletree-tbody-td-icon-width, 2rem);
      height: var(--tabletree-tbody-td-icon-height, 2rem);
      color: var(--tabletree-tbody-td-icon-clr, #6c757d);
      background: var(--tabletree-tbody-td-icon-bg, transparent);
      border: solid var(--tabletree-tbody-td-icon-border-clr, transparent);
      border-width: var(--tabletree-tbody-td-icon-border-width, 0);
      border-radius: var(--tabletree-tbody-td-icon-border-radius, 100%);
      margin-block: var(--tabletree-tbody-td-icon-my, 0) !important;
      -webkit-margin-start: var(--tabletree-tbody-td-icon-margin-istart, 0.5rem) !important;
      margin-inline-start: var(--tabletree-tbody-td-icon-margin-istart, 0.5rem) !important;
      -webkit-margin-end: var(--tabletree-tbody-td-icon-margin-iend, 0) !important;
      margin-inline-end: var(--tabletree-tbody-td-icon-margin-iend, 0) !important;
      transition:
        background-color 0.2s,
        color 0.2s,
        box-shadow 0.2s,
        0.2s transform;
      transform: rotate(90deg);
    }
    .p-treetable .p-treetable-tbody > tr > td .p-treetable-toggler:enabled:hover {
      color: var(--tabletree-tbody-td-icon-hover-clr, #343a40);
      background: var(--tabletree-tbody-td-icon-hover-bg, #e9ecef);
      border-color: var(--tabletree-tbody-td-icon-hover-border-clr, transparent);
    }
    .p-treetable .p-treetable-tbody > tr > td .p-treetable-toggler:focus-visible {
      outline: 0 none;
      outline-offset: 0;
      box-shadow: 0 0 0 0.2rem #BFDBFE;
    }
    .p-treetable .p-treetable-tbody > tr > td .p-treetable-toggler .p-icon {
      width: var(--tabletree-tbody-td-icon-svg-width, 12px);
      height: var(--tabletree-tbody-td-icon-svg-height, 12px);
    }
    .p-treetable .p-treetable-tbody > tr > td p-treetablecheckbox .p-checkbox {
      margin-right: 0.5rem;
    }
    .p-treetable .p-treetable-tbody > tr > td p-treetablecheckbox .p-checkbox .p-indeterminate .p-checkbox-icon {
      color: #495057;
    }
    .p-treetable .p-treetable-tbody > tr[aria-expanded=true] > td .p-treetable-toggler {
      transform: rotate(180deg);
    }
    .p-treetable .p-treetable-tbody > tr[aria-level="2"] > td .p-treetable-toggler {
      -webkit-margin-start: var(--tabletree-tbody-lvl2-td-icon-margin-istart, 16px) !important;
      margin-inline-start: var(--tabletree-tbody-lvl2-td-icon-margin-istart, 16px) !important;
    }
    .p-treetable .p-treetable-tbody > tr[aria-level="3"] > td .p-treetable-toggler {
      -webkit-margin-start: var(--tabletree-tbody-lvl3-td-icon-margin-istart, 32px) !important;
      margin-inline-start: var(--tabletree-tbody-lvl3-td-icon-margin-istart, 32px) !important;
    }
    .p-treetable .p-treetable-tbody > tr[aria-level="4"] > td .p-treetable-toggler {
      -webkit-margin-start: var(--tabletree-tbody-lvl4-td-icon-margin-istart, 48px) !important;
      margin-inline-start: var(--tabletree-tbody-lvl4-td-icon-margin-istart, 48px) !important;
    }
    .p-treetable .p-treetable-tbody > tr:focus-visible {
      outline: var(--tabletree-tbody-tr-focus-outline, 0.15rem solid #BFDBFE);
      outline-offset: -0.15rem;
    }
    .p-treetable .p-treetable-tbody > tr:hover {
      background: var(--tabletree-tbody-tr-hover, transparent);
    }
    .p-treetable .p-treetable-tbody > tr.p-highlight {
      background: var(--tabletree-tbody-tr-highlight-bg, #EFF6FF);
      color: var(--tabletree-tbody-tr-highlight-clr, #1D4ED8);
    }
    .p-treetable .p-treetable-tbody > tr.p-highlight .p-treetable-toggler {
      color: #1D4ED8;
    }
    .p-treetable .p-treetable-tbody > tr.p-highlight .p-treetable-toggler:hover {
      color: #1D4ED8;
    }
    .p-treetable .p-treetable-tfoot > tr > td {
      text-align: var(--tabletree-tfoot-td-textalign, start);
      padding-block: var(--tabletree-tfoot-td-padding-block, 1rem);
      padding-inline: var(--tabletree-tfoot-td-padding-inline, 1rem);
      font-size: var(--tabletree-tfoot-td-fs, 16px);
      font-weight: var(--tabletree-tfoot-td-fw, 700);
      line-height: var(--tabletree-tfoot-td-lh, 1.5);
      min-height: var(--tabletree-tfoot-td-minheight, auto);
      color: var(--tabletree-tfoot-td-clr, #343a40);
      background: var(--tabletree-tfoot-td-bg, #f8f9fa);
      border: 1px solid var(--tabletree-tfoot-td-border-clr, #dee2e6);
      border-block-width: var(--tabletree-tfoot-td-border-block-width, 0 1px);
      border-inline-width: var(--tabletree-tfoot-td-border-inline-width, 0);
    }
    .p-treetable .p-treetable-header {
      background: var(--tabletree-caption-bg, #f8f9fa);
      color: var(--tabletree-caption-clr, #343a40);
      border: 1px solid var(--tabletree-caption-border-clr, #dee2e6);
      border-block-width: var(--tabletree-caption-border-block-width, 1px);
      border-inline-width: var(--tabletree-caption-border-inline-width, 0px);
      padding-block: var(--tabletree-caption-py, 1rem);
      padding-inline: var(--tabletree-caption-px, 1rem);
      font-size: var(--tabletree-caption-fs, 16px);
      font-weight: var(--tabletree-caption-fw, 700);
    }
    .p-treetable .p-treetable-footer {
      background: var(--tabletree-summary-bg, #f8f9fa);
      color: var(--tabletree-summary-clr, #343a40);
      border: 1px solid var(--tabletree-summary-border-clr, #dee2e6);
      border-block-width: var(--tabletree-summary-border-block-width, 0 1px);
      border-inline-width: var(--tabletree-summary-border-inline-width, 0px);
      padding-block: var(--tabletree-summary-py, 1rem);
      padding-inline: var(--tabletree-summary-px, 1rem);
      font-size: var(--tabletree-summary-fs, 16px);
      font-weight: var(--tabletree-summary-fw, 700);
    }
    .p-treetable.p-treetable-sm .p-treetable-header {
      padding-block: var(--tabletree-caption-padding-block-sm, 0.875rem);
      padding-inline: var(--tabletree-caption-padding-inline-sm, 0.875rem);
    }
    .p-treetable.p-treetable-sm .p-treetable-footer {
      padding-block: var(--tabletree-summary-padding-block-sm, 0.5rem);
      padding-inline: var(--tabletree-summary-padding-inline-sm, 0.5rem);
    }
    .p-treetable.p-treetable-sm .p-treetable-thead > tr > th {
      padding-block: var(--tabletree-thead-th-padding-block-sm, 0.5rem);
      padding-inline: var(--tabletree-thead-th-padding-inline-sm, 0.5rem);
    }
    .p-treetable.p-treetable-sm .p-treetable-tbody > tr > td {
      padding-block: var(--tabletree-tbody-td-padding-block-sm, 0.5rem);
      padding-inline: var(--tabletree-tbody-td-padding-inline-sm, 0.5rem);
    }
    .p-treetable.p-treetable-sm .p-treetable-tfoot > tr > td {
      padding-block: var(--tabletree-tfoot-td-padding-block-sm, 0.5rem);
      padding-inline: var(--tabletree-tfoot-td-padding-inline-sm, 0.5rem);
    }
    .p-treetable.p-treetable-lg .p-treetable-header {
      padding-block: var(--tabletree-caption-padding-block-lg, 1.25rem);
      padding-inline: var(--tabletree-caption-padding-inline-lg, 1.25rem);
    }
    .p-treetable.p-treetable-lg .p-treetable-footer {
      padding-block: var(--tabletree-summary-padding-block-lg, 1.25rem);
      padding-inline: var(--tabletree-summary-padding-inline-lg, 1.25rem);
    }
    .p-treetable.p-treetable-lg .p-treetable-thead > tr > th {
      padding-block: var(--tabletree-thead-th-padding-block-lg, 1.25rem);
      padding-inline: var(--tabletree-thead-th-padding-inline-lg, 1.25rem);
    }
    .p-treetable.p-treetable-lg .p-treetable-tbody > tr > td {
      padding-block: var(--tabletree-tbody-td-padding-block-lg, 1.25rem);
      padding-inline: var(--tabletree-tbody-td-padding-inline-lg, 1.25rem);
    }
    .p-treetable.p-treetable-lg .p-treetable-tfoot > tr > td {
      padding-block: var(--tabletree-tfoot-td-padding-block-lg, 1.25rem);
      padding-inline: var(--tabletree-tfoot-td-padding-inline-lg, 1.25rem);
    }
    .p-treetable .p-sortable-column {
      outline-color: #BFDBFE;
    }
    .p-treetable .p-sortable-column .p-sortable-column-icon {
      color: #343a40;
      margin-left: 0.5rem;
    }
    .p-treetable .p-sortable-column .p-sortable-column-badge {
      border-radius: 50%;
      height: 1.143rem;
      min-width: 1.143rem;
      line-height: 1.143rem;
      color: #1D4ED8;
      background: #EFF6FF;
      margin-left: 0.5rem;
    }
    .p-treetable .p-sortable-column:not(.p-highlight):hover {
      background: #e9ecef;
      color: #343a40;
    }
    .p-treetable .p-sortable-column:not(.p-highlight):hover .p-sortable-column-icon {
      color: #343a40;
    }
    .p-treetable .p-sortable-column.p-highlight {
      background: #EFF6FF;
      color: #1D4ED8;
    }
    .p-treetable .p-sortable-column.p-highlight .p-sortable-column-icon {
      color: #1D4ED8;
    }
    .p-treetable .p-column-resizer-helper {
      background: #3B82F6;
    }
    .p-treetable .p-treetable-scrollable-header .p-treetable-scrollable-header-box {
      padding: 0 !important;
    }
    .p-treetable .p-treetable-scrollable-header,
    .p-treetable .p-treetable-scrollable-footer {
      background: #f8f9fa;
    }
    .p-treetable .p-treetable-loading-icon {
      font-size: 2rem;
    }
    .p-treetable .p-treetable-loading-icon.p-icon {
      width: 2rem;
      height: 2rem;
    }
    .p-treetable.p-treetable-hoverable-rows .p-treetable-tbody > tr:not(.p-highlight):hover {
      background: #e9ecef;
      color: #495057;
    }
    .p-treetable.p-treetable-hoverable-rows .p-treetable-tbody > tr:not(.p-highlight):hover .p-treetable-toggler {
      color: #495057;
    }
    .p-treetable.p-treetable-gridlines .p-datatable-header {
      border-width: 1px 1px 0 1px;
    }
    .p-treetable.p-treetable-gridlines .p-treetable-footer {
      border-width: 0 1px 1px 1px;
    }
    .p-treetable.p-treetable-gridlines .p-treetable-top {
      border-width: 0 1px 0 1px;
    }
    .p-treetable.p-treetable-gridlines .p-treetable-bottom {
      border-width: 0 1px 1px 1px;
    }
    .p-treetable.p-treetable-gridlines .p-treetable-thead > tr > th {
      border-width: 1px;
    }
    .p-treetable.p-treetable-gridlines .p-treetable-tbody > tr > td {
      border-width: 1px;
    }
    .p-treetable.p-treetable-gridlines .p-treetable-tfoot > tr > td {
      border-width: 1px;
    }
    .p-treetable {
      --tabletree-bg: transparent;
      --tabletree-border-spacing: 0;
      --tabletree-border-width: 1px 1px 0 1px;
      --tabletree-border-clr: transparent;
      --tabletree-border-ss-radius: 0;
      --tabletree-border-se-radius: 0;
      --tabletree-border-es-radius: 0;
      --tabletree-border-ee-radius: 0;
      --tabletree-fw: 400;
      --tabletree-mb: 0;
      --tabletree-thead-th-padding-block: 1rem;
      --tabletree-thead-th-padding-inline: 1rem;
      --tabletree-thead-th-fs: 16px;
      --tabletree-thead-th-fw: 700;
      --tabletree-thead-th-lh: 1.5;
      --tabletree-thead-th-texttransform: none;
      --tabletree-thead-th-minheight: auto;
      --tabletree-thead-th-clr: #343a40;
      --tabletree-thead-th-bg: #f8f9fa;
      --tabletree-thead-th-border-clr: #dee2e6;
      --tabletree-thead-th-border-block-width: 0 1px;
      --tabletree-thead-th-border-inline-width: 0;
      --tabletree-thead-th-textalign: start;
      --tabletree-thead-th-action-width: 80px;
      --tabletree-tbody-tr-bg: white;
      --tabletree-tbody-tr-clr: #495057;
      --tabletree-tbody-td-textalign: start;
      --tabletree-tbody-tr-hover: transparent;
      --tabletree-tbody-td-padding-block: 1rem;
      --tabletree-tbody-td-padding-inline: 1rem;
      --tabletree-tbody-td-fs: 16px;
      --tabletree-tbody-td-fw: 400;
      --tabletree-tbody-td-lh: 1.5;
      --tabletree-tbody-td-minheight: auto;
      --tabletree-tbody-td-clr: #495057;
      --tabletree-tbody-td-bg: inherit;
      --tabletree-tbody-td-border-clr: #dee2e6;
      --tabletree-tbody-td-border-block-width: 0 1px;
      --tabletree-tbody-td-border-inline-width: 0;
      --tabletree-tbody-td-action-gap: 8px;
      --tabletree-tbody-td-nodata-height: 200px;
      --tabletree-tbody-td-nodata-bg: transparent;
      --tabletree-tbody-td-nodata-clr: #495057;
      --tabletree-tbody-td-nodata-fs: 16px;
      --tabletree-tbody-td-nodata-fw: 700;
      --tabletree-tbody-td-nodata-img-width: 230px;
      --tabletree-tbody-td-nodata-img-my: 0 20px;
      --tabletree-tbody-tr-focus-outline: 0.15rem solid #BFDBFE;
      --tabletree-tbody-tr-highlight-bg: #EFF6FF;
      --tabletree-tbody-tr-highlight-clr: #1D4ED8;
      --tabletree-tbody-td-icon-width: 2rem;
      --tabletree-tbody-td-icon-height: 2rem;
      --tabletree-tbody-td-icon-clr: #6c757d;
      --tabletree-tbody-td-icon-bg: transparent;
      --tabletree-tbody-td-icon-border-clr: transparent;
      --tabletree-tbody-td-icon-border-width: 0;
      --tabletree-tbody-td-icon-border-radius: 100%;
      --tabletree-tbody-td-icon-my: 0;
      --tabletree-tbody-td-icon-margin-istart: 0.5rem;
      --tabletree-tbody-td-icon-margin-iend: 0;
      --tabletree-tbody-td-icon-hover-clr: #343a40;
      --tabletree-tbody-td-icon-hover-bg: #e9ecef;
      --tabletree-tbody-td-icon-hover-border-clr: transparent;
      --tabletree-tbody-td-icon-svg-width: 12px;
      --tabletree-tbody-td-icon-svg-height: 12px;
      --tabletree-tbody-lvl2-td-icon-margin-istart: 16px;
      --tabletree-tbody-lvl3-td-icon-margin-istart: 32px;
      --tabletree-tbody-lvl4-td-icon-margin-istart: 48px;
      --tabletree-tfoot-td-textalign: start;
      --tabletree-tfoot-td-padding-block: 1rem;
      --tabletree-tfoot-td-padding-inline: 1rem;
      --tabletree-tfoot-td-fs: 16px;
      --tabletree-tfoot-td-fw: 700;
      --tabletree-tfoot-td-lh: 1.5;
      --tabletree-tfoot-td-minheight: auto;
      --tabletree-tfoot-td-clr: #343a40;
      --tabletree-tfoot-td-bg: #f8f9fa;
      --tabletree-tfoot-td-border-clr: #dee2e6;
      --tabletree-tfoot-td-border-block-width: 0 1px;
      --tabletree-tfoot-td-border-inline-width: 0;
      --tabletree-caption-bg: #f8f9fa;
      --tabletree-caption-clr: #343a40;
      --tabletree-caption-border-clr: #dee2e6;
      --tabletree-caption-border-block-width: 1px;
      --tabletree-caption-border-inline-width: 0px;
      --tabletree-caption-py: 1rem;
      --tabletree-caption-px: 1rem;
      --tabletree-caption-fs: 16px;
      --tabletree-caption-fw: 700;
      --tabletree-summary-bg: #f8f9fa;
      --tabletree-summary-clr: #343a40;
      --tabletree-summary-border-clr: #dee2e6;
      --tabletree-summary-border-block-width: 0 1px;
      --tabletree-summary-border-inline-width: 0px;
      --tabletree-summary-py: 1rem;
      --tabletree-summary-px: 1rem;
      --tabletree-summary-fs: 16px;
      --tabletree-summary-fw: 700;
      --tabletree-caption-padding-block-sm: 0.5rem;
      --tabletree-caption-padding-inline-sm: 0.5rem;
      --tabletree-summary-padding-block-sm: 0.5rem;
      --tabletree-summary-padding-inline-sm: 0.5rem;
      --tabletree-thead-th-padding-block-sm: 0.5rem;
      --tabletree-thead-th-padding-inline-sm: 0.5rem;
      --tabletree-tbody-td-padding-block-sm: 0.5rem;
      --tabletree-tbody-td-padding-inline-sm: 0.5rem;
      --tabletree-tfoot-td-padding-block-sm: 0.5rem;
      --tabletree-tfoot-td-padding-inline-sm: 0.5rem;
      --tabletree-caption-padding-block-lg: 1.25rem;
      --tabletree-caption-padding-inline-lg: 1.25rem;
      --tabletree-summary-padding-block-lg: 1.25rem;
      --tabletree-summary-padding-inline-lg: 1.25rem;
      --tabletree-thead-th-padding-block-lg: 1.25rem;
      --tabletree-thead-th-padding-inline-lg: 1.25rem;
      --tabletree-tbody-td-padding-block-lg: 1.25rem;
      --tabletree-tbody-td-padding-inline-lg: 1.25rem;
      --tabletree-tfoot-td-padding-block-lg: 1.25rem;
      --tabletree-tfoot-td-padding-inline-lg: 1.25rem;
    }
  }
  @layer pagination {
    .p-paginator {
      gap: var(--ppagination-gap, 0.5rem);
      background: var(--ppagination-bg, white);
      color: var(--ppagination-clr, #6c757d);
      border: solid var(--ppagination-border-clr, #e9ecef);
      border-width: var(--ppagination-border-width, 0);
      margin-block: var(--ppagination-my, 24px 0);
      padding-block: var(--ppagination-py, 0.5rem);
      padding-inline: var(--ppagination-px, 1rem);
      border-radius: var(--ppagination-border-radius, 6px);
    }
    .p-paginator .p-paginator-first,
    .p-paginator .p-paginator-prev,
    .p-paginator .p-paginator-next,
    .p-paginator .p-paginator-last {
      background: var(--ppagination-controls-bg, transparent);
      border: solid var(--ppagination-controls-border-clr, transparent);
      border-width: var(--ppagination-controls-border-width, 0);
      color: var(--ppagination-controls-clr, #6c757d);
      min-width: var(--ppagination-controls-minwidth, 3rem);
      height: var(--ppagination-controls-height, 3rem);
      margin-block: var(--ppagination-controls-my, 0.143rem);
      margin-inline: var(--ppagination-controls-mx, 0.143rem);
      border-radius: var(--ppagination-controls-border-radius, 100%);
      transition: all 0.2s;
    }
    [dir=rtl] .p-paginator .p-paginator-first,
    [dir=rtl] .p-paginator .p-paginator-prev,
    [dir=rtl] .p-paginator .p-paginator-next,
    [dir=rtl] .p-paginator .p-paginator-last {
      transform: scaleX(-1);
    }
    .p-paginator .p-paginator-first.p-disabled,
    .p-paginator .p-paginator-prev.p-disabled,
    .p-paginator .p-paginator-next.p-disabled,
    .p-paginator .p-paginator-last.p-disabled {
      opacity: 1;
      background: var(--ppagination-page-disabled-bg, transparent);
      color: var(--ppagination-page-disabled-clr, #CED7E3);
      border-color: var(--ppagination-page-disabled-border-clr, #CED7E3);
    }
    .p-paginator .p-paginator-first:not(.p-disabled):hover,
    .p-paginator .p-paginator-prev:not(.p-disabled):hover,
    .p-paginator .p-paginator-next:not(.p-disabled):hover,
    .p-paginator .p-paginator-last:not(.p-disabled):hover {
      background: var(--ppagination-controls-hover-bg, #e9ecef);
      border-color: var(--ppagination-controls-hover-border-clr, transparent);
      color: var(--ppagination-controls-hover-clr, #343a40);
    }
    .p-paginator p-select {
      order: 2;
    }
    .p-paginator p-select .p-select {
      --pselect-px: 9px;
      --pselect-py: 5px;
      --pselect-min-width: 50px;
      --pselect-min-height: 32px;
      --pselect-border-radius: 8px;
      --pselect-height: 32px;
      --pselect-lh: 22px;
      --pselect-label-lh: 22px;
      --pselect-label-fs: 14px;
      --pselect-label-fw: 500;
    }
    .p-paginator .p-paginator-current {
      order: 2;
      margin-block: var(--ppagination-page-current-my, 0.143rem);
      margin-inline: var(--ppagination-page-current-mx, 0.143rem);
      padding-block: var(--ppagination-page-current-py, 0);
      padding-inline: var(--ppagination-page-current-px, 0.5rem);
      min-width: var(--ppagination-page-current-minwidth, 3rem);
      height: var(--ppagination-page-current-height, 3rem);
      color: var(--ppagination-page-current-clr, #6c757d);
      font-size: var(--ppagination-page-current-fs, 14px);
      font-weight: var(--ppagination-page-current-fw, 400);
      line-height: var(--ppagination-page-current-lh, 1.2);
      background: var(--ppagination-page-current-bg, transparent);
      border: solid var(--ppagination-page-current-border-clr, transparent);
      border-width: var(--ppagination-page-current-border-width, 0);
    }
    .p-paginator .p-paginator-pages {
      gap: var(--ppagination-gap, 0.5rem);
    }
    .p-paginator .p-paginator-pages .p-paginator-page {
      background: var(--ppagination-page-bg, transparent);
      border: solid var(--ppagination-page-border-clr, transparent);
      border-width: var(--ppagination-page-border-width, 0);
      color: var(--ppagination-page-clr, #6c757d);
      font-size: var(--ppagination-page-fs, 14px);
      font-weight: var(--ppagination-page-fw, 400);
      line-height: var(--ppagination-page-lh, 1.2);
      min-width: var(--ppagination-page-minwidth, 3rem);
      height: var(--ppagination-page-height, 3rem);
      margin-block: var(--ppagination-page-my, 0.143rem);
      margin-inline: var(--ppagination-page-mx, 0.143rem);
      border-radius: var(--ppagination-page-border-radius, 100%);
      transition: all 0.2s;
    }
    .p-paginator .p-paginator-pages .p-paginator-page.p-paginator-page-selected {
      background: var(--ppagination-page-highlight-bg, #EFF6FF);
      border-color: var(--ppagination-page-highlight-border-clr, #EFF6FF);
      color: var(--ppagination-page-highlight-clr, #1D4ED8);
    }
    .p-paginator .p-paginator-pages .p-paginator-page:not(.p-paginator-page-selected):hover {
      background: var(--ppagination-page-hover-bg, #e9ecef);
      border-color: var(--ppagination-page-hover-border-clr, transparent);
      color: var(--ppagination-page-hover-clr, #343a40);
    }
    .p-paginator {
      --ppagination-gap: 0.5rem;
      --ppagination-bg: white;
      --ppagination-clr: #6c757d;
      --ppagination-border-clr: #e9ecef;
      --ppagination-border-width: 0;
      --ppagination-my: 24px 0;
      --ppagination-py: 0.5rem;
      --ppagination-px: 1rem;
      --ppagination-border-radius: 6px;
      --ppagination-controls-bg: transparent;
      --ppagination-controls-border-clr: transparent;
      --ppagination-controls-border-width: 0;
      --ppagination-controls-clr: #6c757d;
      --ppagination-controls-minwidth: 3rem;
      --ppagination-controls-height: 3rem;
      --ppagination-controls-my: 0.143rem;
      --ppagination-controls-mx: 0.143rem;
      --ppagination-controls-border-radius: 100%;
      --ppagination-page-disabled-bg: transparent;
      --ppagination-page-disabled-clr: #CED7E3;
      --ppagination-page-disabled-border-clr: #CED7E3;
      --ppagination-controls-hover-bg: #e9ecef;
      --ppagination-controls-hover-border-clr: transparent;
      --ppagination-controls-hover-clr: #343a40;
      --ppagination-page-current-my: 0.143rem;
      --ppagination-page-current-mx: 0.143rem;
      --ppagination-page-current-py: 0;
      --ppagination-page-current-px: 0.5rem;
      --ppagination-page-current-minwidth: 3rem;
      --ppagination-page-current-height: 3rem;
      --ppagination-page-current-clr: #6c757d;
      --ppagination-page-current-fs: 14px;
      --ppagination-page-current-fw: 400;
      --ppagination-page-current-lh: 1.2;
      --ppagination-page-current-bg: transparent;
      --ppagination-page-current-border-clr: transparent;
      --ppagination-page-current-border-width: 0;
      --ppagination-page-bg: transparent;
      --ppagination-page-border-clr: transparent;
      --ppagination-page-border-width: 0;
      --ppagination-page-clr: #6c757d;
      --ppagination-page-fs: 14px;
      --ppagination-page-fw: 400;
      --ppagination-page-lh: 1.2;
      --ppagination-page-minwidth: 3rem;
      --ppagination-page-height: 3rem;
      --ppagination-page-my: 0.143rem;
      --ppagination-page-mx: 0.143rem;
      --ppagination-page-border-radius: 100%;
      --ppagination-page-highlight-bg: #EFF6FF;
      --ppagination-page-highlight-border-clr: #EFF6FF;
      --ppagination-page-highlight-clr: #1D4ED8;
      --ppagination-page-hover-bg: #e9ecef;
      --ppagination-page-hover-border-clr: transparent;
      --ppagination-page-hover-clr: #343a40;
    }
  }
  @layer tablists {
    .p-tabs {
      display: flex;
      flex-direction: column;
    }
    .p-tabs .p-tablist .p-tablist-content {
      flex-grow: 1;
    }
    .p-tabs .p-tablist .p-tablist-viewport .p-tablist-tab-list {
      padding-block: var(--ptablist-nav-py, 0px);
      padding-inline: var(--ptablist-nav-px, 1rem);
      gap: var(--ptablist-nav-gap, 1rem);
      background: var(--ptablist-nav-bg, white);
      border-width: var(--ptablist-nav-border-width, 0 0 2px 0);
      border-style: var(--ptablist-nav-border-style, solid);
      border-color: var(--ptablist-nav-border-clr, #dee2e6);
      border-radius: var(--ptablist-nav-border-radius, 0);
      border-start-start-radius: var(--ptablist-nav-border-radius-ss, 0);
      border-start-end-radius: var(--ptablist-nav-border-radius-se, 0);
      border-end-start-radius: var(--ptablist-nav-border-radius-es, 0);
      border-end-end-radius: var(--ptablist-nav-border-radius-ee, 0);
    }
    .p-tabs .p-tablist .p-tablist-viewport .p-tablist-tab-list .p-tab {
      padding-block: var(--ptablist-nav-link-py, 1rem);
      padding-inline: var(--ptablist-nav-link-px, 1rem);
      gap: var(--ptablist-nav-link-gap, 0);
      margin-block: var(--ptablist-nav-link-my, 0 -2px);
      margin-inline: var(--ptablist-nav-link-mx, 0 0);
      border-width: var(--ptablist-nav-link-border-width, 0 0 2px 0);
      border-style: var(--ptablist-nav-link-border-style, solid);
      border-color: var(--ptablist-nav-link-border-clr, transparent transparent #dee2e6 transparent);
      background: var(--ptablist-nav-link-bg, white);
      color: var(--ptablist-nav-link-clr, #6c757d);
      font-size: var(--ptablist-nav-link-fs, 1rem);
      font-weight: var(--ptablist-nav-link-fw, 700);
      line-height: var(--ptablist-nav-link-lh, 1.5);
      border-start-start-radius: var(--ptablist-nav-link-border-radius-ss, 6px);
      border-start-end-radius: var(--ptablist-nav-link-border-radius-se, 6px);
      border-end-start-radius: var(--ptablist-nav-link-border-radius-es, 0px);
      border-end-end-radius: var(--ptablist-nav-link-border-radius-ee, 0px);
      transition: var(--ptablist-nav-link-transition, background 0.2s, border-color 0.2s, color 0.2, outline-color 0.2, box-shadow 0.2s);
    }
    .p-tabs .p-tablist .p-tablist-viewport .p-tablist-tab-list .p-tab.p-tab-active {
      background: var(--ptablist-nav-link-active-bg, white);
      border-color: var(--ptablist-nav-link-active-border-clr, #3b82f6);
      color: var(--ptablist-nav-link-active-clr, #3b82f6);
    }
    .p-tabs .p-tablist .p-tablist-viewport .p-tablist-tab-list .p-tab:hover {
      background: var(--ptablist-nav-link-hover-bg, white);
      border-color: var(--ptablist-nav-link-hover-border-clr, #3b82f6);
      color: var(--ptablist-nav-link-hover-clr, #3b82f6);
    }
    .p-tabs .p-tablist .p-tablist-viewport .p-tablist-tab-list .p-tab:not(.p-disabled):focus-visible {
      z-index: 1;
      box-shadow: var(--ptablist-nav-link-focus-boxshadow, none);
      outline: var(--ptablist-nav-link-focus-width, 1px) solid var(--ptablist-nav-link-focus-color, #0077D9);
      outline-offset: var(--ptablist-nav-link-focus-offset, -1px);
    }
    .p-tabs .p-tablist .p-tablist-viewport .p-tablist-tab-list .p-tablist-active-bar {
      z-index: 1;
      display: block;
      position: absolute;
      bottom: var(--p-tabs-active-bar-bottom);
      height: var(--p-tabs-active-bar-height);
      background: var(--p-tabs-active-bar-background);
      transition: 250ms cubic-bezier(0.35, 0, 0.25, 1);
    }
    .p-tabs .p-tabpanels {
      outline: 0 none;
      background: var(--ptablist-content-bg, white);
      padding-block: var(--ptablist-content-py, 20px);
      padding-inline: var(--ptablist-content-px, 20px);
      border-width: var(--ptablist-content-border-width, 0px);
      border-style: solid;
      border-color: var(--ptablist-content-border-clr, transparent);
      color: var(--ptablist-content-clr, #495057);
      border-start-start-radius: var(--ptablist-content-border-radius-ss, 0px);
      border-start-end-radius: var(--ptablist-content-border-radius-se, 0px);
      border-end-start-radius: var(--ptablist-content-border-radius-es, 6px);
      border-end-end-radius: var(--ptablist-content-border-radius-ee, 6px);
    }
    .p-tabs {
      --ptablist-nav-py: 0px;
      --ptablist-nav-px: 1rem;
      --ptablist-nav-gap: 1rem;
      --ptablist-nav-bg: #F5FAFF;
      --ptablist-nav-border-width: 1px 1px 0 1px;
      --ptablist-nav-border-style: solid;
      --ptablist-nav-border-clr: #CED7E3;
      --ptablist-nav-border-radius-ss: 0.5rem;
      --ptablist-nav-border-radius-se: 0.5rem;
      --ptablist-nav-border-radius-es: 0;
      --ptablist-nav-border-radius-ee: 0;
      --ptablist-nav-link-py: 0.5rem;
      --ptablist-nav-link-px: 0;
      --ptablist-nav-link-gap: 0;
      --ptablist-nav-link-my: 0;
      --ptablist-nav-link-mx: 0 0;
      --ptablist-nav-link-border-width: 0 0 2px 0;
      --ptablist-nav-link-border-style: solid;
      --ptablist-nav-link-border-clr: transparent;
      --ptablist-nav-link-bg: transparent;
      --ptablist-nav-link-clr: #424B59;
      --ptablist-nav-link-fs: 0.875rem;
      --ptablist-nav-link-fw: 700;
      --ptablist-nav-link-lh: 1.5;
      --ptablist-nav-link-border-radius-ss: 6px;
      --ptablist-nav-link-border-radius-se: 6px;
      --ptablist-nav-link-border-radius-es: 0px;
      --ptablist-nav-link-border-radius-ee: 0px;
      --ptablist-nav-link-transition: all 0.2s;
      --ptablist-nav-link-hover-border-clr: #3b82f6;
      --ptablist-nav-link-hover-bg: transparent;
      --ptablist-nav-link-hover-clr: #3b82f6;
      --ptablist-nav-link-active-bg: transparent;
      --ptablist-nav-link-active-border-clr: #0077D9;
      --ptablist-nav-link-active-clr: #0077D9;
      --ptablist-nav-link-focus-boxshadow: none;
      --ptablist-nav-link-focus-width: 0px;
      --ptablist-nav-link-focus-color: #0077D9;
      --ptablist-nav-link-focus-offset: -1px;
      --ptablist-content-py: 1rem;
      --ptablist-content-px: 1rem;
      --ptablist-content-clr: #424B59;
      --ptablist-content-bg: white;
      --ptablist-content-border-width: 0 1px 1px 1px;
      --ptablist-content-border-clr: #CED7E3;
      --ptablist-content-border-radius-ss: 0px;
      --ptablist-content-border-radius-se: 0px;
      --ptablist-content-border-radius-es: 0.5rem;
      --ptablist-content-border-radius-ee: 0.5rem;
    }
  }
  @layer progressbar {
    .p-progressbar {
      min-width: var(--progressbar-minwidth, 200px);
      height: var(--progressbar-height, 1.5rem);
      background: var(--progressbar-bg, #dee2e6);
      border: solid var(--progressbar-border-clr, transparent);
      border-width: var(--progressbar-border-width, 0);
      border-radius: var(--progressbar-border-radius, 6px);
    }
    .p-progressbar .p-progressbar-value {
      margin-block: var(--progressbar-value-my, 0);
      margin-inline: var(--progressbar-value-mx, 0);
      background: var(--progressbar-value-bg, #3B82F6);
      border: solid var(--progressbar-value-border-clr, transparent);
      border-width: var(--progressbar-value-border-width, 0);
      border-radius: var(--progressbar-value-border-radius, 0);
    }
    .p-progressbar .p-progressbar-label {
      background: var(--progressbar-label-bg, #3B82F6);
      color: var(--progressbar-label-clr, white);
      font-size: var(--progressbar-label-fs, 14px);
      font-weight: var(--progressbar-label-fw, 400);
      line-height: var(--progressbar-label-lh, 1.5rem);
      display: var(--progressbar-label-display, flex) !important;
    }
    .p-progressbar {
      --progressbar-minwidth: 200px;
      --progressbar-height: 1.5rem;
      --progressbar-bg: #dee2e6;
      --progressbar-border-clr: transparent;
      --progressbar-border-width: 0;
      --progressbar-border-radius: 6px;
      --progressbar-value-my: 0;
      --progressbar-value-mx: 0;
      --progressbar-value-bg: #3B82F6;
      --progressbar-value-border-clr: transparent;
      --progressbar-value-border-width: 0;
      --progressbar-value-border-radius: 0;
      --progressbar-label-display: flex;
      --progressbar-label-bg: #3B82F6;
      --progressbar-label-clr: white;
      --progressbar-label-fs: 14px;
      --progressbar-label-fw: 400;
      --progressbar-label-lh: 1.5rem;
    }
  }
  @layer tooltips {
    .p-tooltip .p-tooltip-text {
      background: var(--tooltip-bg, #495057);
      color: var(--tooltip-clr, white);
      padding-block: var(--tooltip-py, 10px);
      padding-inline: var(--tooltip-px, 10px);
      box-shadow: var(--tooltip-boxshadow, 0 2px 12px 0 rgba(0, 0, 0, 0.1));
      border-radius: var(--tooltip-border-radius, 6px);
      font-size: var(--tooltip-fs, 14px);
      font-weight: var(--tooltip-fw, 400);
    }
    .p-tooltip.p-tooltip-right .p-tooltip-arrow {
      border-right-color: var(--tooltip-arrow-border-clr, #495057);
    }
    .p-tooltip.p-tooltip-left .p-tooltip-arrow {
      border-left-color: var(--tooltip-arrow-border-clr, #495057);
    }
    .p-tooltip.p-tooltip-top .p-tooltip-arrow {
      border-top-color: var(--tooltip-arrow-border-clr, #495057);
    }
    .p-tooltip.p-tooltip-bottom .p-tooltip-arrow {
      border-bottom-color: var(--tooltip-arrow-border-clr, #495057);
    }
    .p-tooltip.p-tooltip-left .p-tooltip-arrow,
    .p-tooltip.p-tooltip-right .p-tooltip-arrow {
      top: auto;
      inset-block: 0;
      margin-top: 0;
      margin-block: auto;
    }
    .p-tooltip.p-tooltip-top .p-tooltip-arrow,
    .p-tooltip.p-tooltip-bottom .p-tooltip-arrow {
      left: auto;
      inset-inline: 0;
      margin-left: 0;
      margin-inline: auto;
    }
    .p-tooltip.p-tooltip-left {
      margin-inline-end: -0.25em;
    }
    .p-tooltip.p-tooltip-right {
      margin-inline-end: 0.25em;
    }
    .p-tooltip.p-tooltip-left .p-tooltip-arrow {
      right: auto;
      inset-inline-start: -0.25em;
    }
    .p-tooltip.p-tooltip-right .p-tooltip-arrow {
      left: auto;
      inset-inline-end: -0.25em;
    }
    .p-tooltip.p-tooltip-top {
      margin-top: -0.25em;
    }
    .p-tooltip.p-tooltip-bottom {
      margin-top: 0.25em;
    }
    .p-tooltip.p-tooltip-top .p-tooltip-arrow {
      bottom: -0.25em;
    }
    .p-tooltip.p-tooltip-bottom .p-tooltip-arrow {
      top: -0.25em;
    }
    .p-tooltip {
      --tooltip-bg: #495057;
      --tooltip-clr: white;
      --tooltip-fs: 14px;
      --tooltip-fw: 400;
      --tooltip-py: 10px;
      --tooltip-px: 10px;
      --tooltip-boxshadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
      --tooltip-border-radius: 8px;
      --tooltip-arrow-border-clr: #495057;
    }
  }
  @layer dropdown {
    .p-overlaypanel:before,
    .p-overlaypanel:after {
      content: none;
    }
    .p-overlaypanel {
      background: var(--dropdown-bg, white);
      color: var(--dropdown-clr, #495057);
      border: var(--dropdown-border-width, 0px) solid var(--dropdown-border-clr, transparent);
      border-radius: var(--dropdown-border-radius, 6px);
      box-shadow: var(--dropdown-boxshadow, 0 1px 3px rgba(0, 0, 0, 0.3));
      min-width: var(--dropdown-minwidth, 200px);
      padding-inline: var(--dropdown-px, 10px);
      padding-block: var(--dropdown-py, 10px);
    }
    .p-overlaypanel::before,
    .p-overlaypanel::after {
      content: none !important;
    }
    .p-overlaypanel::before,
    .p-overlaypanel::after {
      border: solid transparent;
      border-color: var(--dropdown-arrow-border-clr, rgba(255, 255, 255, 0));
      border-bottom-color: var(--dropdown-arrow-border-bottom-clr, #f2f2f2);
    }
    .p-overlaypanel::before .p-overlaypanel-flipped,
    .p-overlaypanel::after .p-overlaypanel-flipped {
      border-top-color: var(--dropdown-arrow-border-top-clr, #f2f2f2);
    }
    .p-overlaypanel .p-overlaypanel-content {
      padding-block: var(--dropdown-content-py, 20px);
      padding-inline: var(--dropdown-content-px, 20px);
    }
    .p-overlaypanel .p-overlaypanel-close {
      position: absolute !important;
      top: var(--dropdown-close-top, 0);
      inset-inline-end: var(--dropdown-close-inset-end, 0);
      color: var(--dropdown-close-clr, #2B374D);
      background: var(--dropdown-close-bg, #F5FAFF);
      width: var(--dropdown-close-width, 24px);
      height: var(--dropdown-close-height, 24px);
      border-radius: var(--dropdown-close-border-radius, 100%);
      transition: var(--dropdown-close-transition, background-color 0.2s, color 0.2s, box-shadow 0.2s);
    }
    .p-overlaypanel .p-overlaypanel-close svg {
      width: var(--dropdown-close-icon-width, 10px);
      height: var(--dropdown-close-icon-height, 10px);
    }
    .p-overlaypanel .p-overlaypanel-close:enabled:hover {
      background: var(--dropdown-close-hover-bg, #2563eb);
      color: var(--dropdown-close-active-clr, white);
    }
    .p-overlaypanel {
      --dropdown-minwidth: 200px;
      --dropdown-py: 10px;
      --dropdown-px: 10px;
      --dropdown-bg: white;
      --dropdown-clr: #495057;
      --dropdown-border-width: 0;
      --dropdown-border-clr: transparent;
      --dropdown-border-radius: 8px;
      --dropdown-boxshadow: 0 2px 6px #B0C5E129, 0 4px 10px -40px #B0C5E140;
      --dropdown-content-px: 20px;
      --dropdown-content-py: 20px;
      --dropdown-close-top: 0;
      --dropdown-close-inset-end: 0;
      --dropdown-close-clr: #2B374D;
      --dropdown-close-bg: #F5FAFF;
      --dropdown-close-width: 24px;
      --dropdown-close-height: 24px;
      --dropdown-close-border-radius: 100%;
      --dropdown-close-transition:
        background-color 0.2s,
        color 0.2s,
        box-shadow 0.2s;
      --dropdown-close-icon-width: 10px;
      --dropdown-close-icon-height: 10px;
      --dropdown-arrow-border-clr: rgba(255, 255, 255, 0);
      --dropdown-arrow-border-bottom-clr: #f2f2f2;
      --dropdown-arrow-border-top-clr: #f2f2f2;
    }
  }
  @layer breadcrumbs {
    .p-breadcrumb {
      padding-block: var(--breadcrumbs-py, 1rem);
      padding-inline: var(--breadcrumbs-px, 1rem);
      background: var(--breadcrumbs-bg, white);
      border: var(--breadcrumbs-border-width, 1px) solid var(--breadcrumbs-border-clr, #dee2e6);
      border-radius: var(--breadcrumbs-border-radius, 6px);
    }
    .p-breadcrumb .p-breadcrumb-list {
      gap: var(--breadcrumbs-gap, 0.5rem);
    }
    .p-breadcrumb .p-breadcrumb-list li .p-menuitem-link {
      transition: box-shadow 0.2s;
      border-radius: var(--breadcrumbs-link-border-radius, 6px);
    }
    .p-breadcrumb .p-breadcrumb-list li .p-menuitem-link:focus-visible {
      outline: 0 none;
      outline-offset: 0;
      box-shadow: var(--breadcrumbs-link-focus-boxshadow, 0 0 0 0.2rem #BFDBFE);
    }
    .p-breadcrumb .p-breadcrumb-list li .p-menuitem-link .p-menuitem-text {
      font-size: var(--breadcrumbs-link-fs, 16px);
      font-weight: var(--breadcrumbs-link-fw, 400);
      line-height: var(--breadcrumbs-link-lh, 1.5) !important;
      color: var(--breadcrumbs-link-clr, #495057);
    }
    .p-breadcrumb .p-breadcrumb-list li .p-menuitem-link .p-menuitem-text:hover {
      color: var(--breadcrumbs-link-hover-clr, #495057);
      text-decoration: var(--breadcrumbs-link-hover-textdecoration, none);
    }
    .p-breadcrumb .p-breadcrumb-list li .p-menuitem-link .p-menuitem-icon {
      color: var(--breadcrumbs-link-icon-clr, #6c757d);
    }
    .p-breadcrumb .p-breadcrumb-list li.p-breadcrumb-separator {
      margin: var(--breadcrumbs-separator-margin, 0 0.5rem);
      color: var(--breadcrumbs-separator-clr, #495057);
    }
    .p-breadcrumb .p-breadcrumb-list li.p-breadcrumb-separator svg {
      width: var(--breadcrumbs-icon-width, 16px);
      height: var(--breadcrumbs-icon-height, 16px);
    }
    [dir=rtl] .p-breadcrumb .p-breadcrumb-list li.p-breadcrumb-separator {
      transform: scaleX(-1);
    }
    .p-breadcrumb .p-breadcrumb-list li:last-child .p-menuitem-text {
      color: var(--breadcrumbs-link-lastchild-clr, #495057);
    }
    .p-breadcrumb .p-breadcrumb-list li:last-child .p-menuitem-text:hover {
      color: var(--breadcrumbs-link-lastchild-clr, #495057);
      text-decoration: none;
    }
    .p-breadcrumb .p-breadcrumb-list li:last-child .p-menuitem-icon {
      color: var(--breadcrumbs-link-lastchild-icon-clr, #6c757d);
    }
    .p-breadcrumb {
      --breadcrumbs-py: 1rem;
      --breadcrumbs-px: 1rem;
      --breadcrumbs-bg: white;
      --breadcrumbs-border-width: 1px;
      --breadcrumbs-border-clr: #dee2e6;
      --breadcrumbs-border-radius: 6px;
      --breadcrumbs-gap: 0.5rem;
      --breadcrumbs-link-border-radius: 6px;
      --breadcrumbs-link-focus-boxshadow: 0 0 0 0.2rem #BFDBFE;
      --breadcrumbs-link-fs: 16px;
      --breadcrumbs-link-fw: 400;
      --breadcrumbs-link-lh: 1.5;
      --breadcrumbs-link-clr: #495057;
      --breadcrumbs-link-hover-clr: #495057;
      --breadcrumbs-link-hover-textdecoration: none;
      --breadcrumbs-link-icon-clr: #6c757d;
      --breadcrumbs-icon-margin: 0 0.5rem;
      --breadcrumbs-icon-clr: #495057;
      --breadcrumbs-icon-width: 16px;
      --breadcrumbs-icon-height: 16px;
      --breadcrumbs-link-lastchild-clr: #495057;
      --breadcrumbs-link-lastchild-icon-clr: #6c757d;
      --breadcrumbs-separator-margin: 0 0.5rem;
      --breadcrumbs-separator-clr: #495057;
    }
  }
  @layer panel {
    .p-panel {
      border: solid var(--ppanel-border-clr, #dee2e6);
      border-width: var(--ppanel-border-width, 0);
      border-radius: var(--ppanel-border-radius, 6px);
    }
    .p-panel .p-panel-header {
      border: solid var(--ppanel-header-border-clr, #dee2e6);
      border-width: var(--ppanel-header-border-width, 1px);
      padding-block: var(--ppanel-header-py, 1.25rem);
      padding-inline: var(--ppanel-header-px, 1.25rem);
      color: var(--ppanel-header-clr, #343a40);
      background: var(--ppanel-header-bg, #f8f9fa);
      border-start-start-radius: var(--ppanel-header-border-radius-ss, 6px);
      border-start-end-radius: var(--ppanel-header-border-radius-se, 6px);
      border-end-start-radius: var(--ppanel-header-border-radius-es, 0);
      border-end-end-radius: var(--ppanel-header-border-radius-ee, 0);
    }
    .p-panel .p-panel-header .p-panel-title {
      font-size: var(--ppanel-header-title-fs, 16px);
      font-weight: var(--ppanel-header-title-fw, 500);
      line-height: var(--ppanel-header-title-lh, 1.2);
    }
    .p-panel .p-panel-header .p-panel-header-icon {
      width: var(--ppanel-header-icon-width, 2rem);
      height: var(--ppanel-header-icon-height, 2rem);
      color: var(--ppanel-header-icon-clr, #6c757d);
      background: var(--ppanel-header-icon-bg, transparent);
      border: solid var(--ppanel-header-icon-border-clr, transparent);
      border-width: var(--ppanel-header-icon-border-width, 0);
      border-radius: var(--ppanel-header-icon-border-radius, 50%);
      transition:
        background-color 0.2s,
        color 0.2s,
        box-shadow 0.2s;
    }
    .p-panel .p-panel-header .p-panel-header-icon:enabled:hover {
      color: var(--ppanel-header-icon-hover-clr, #343a40);
      background: var(--ppanel-header-icon-hover-bg, #e9ecef);
      border-color: var(--ppanel-header-icon-hover-border-clr, transparent);
    }
    .p-panel .p-panel-header .p-panel-header-icon:focus-visible {
      outline: 0 none;
      outline-offset: 0;
      box-shadow: var(--ppanel-header-icon-hover-boxshadow, 0 0 0 0.2rem #BFDBFE);
    }
    .p-panel .p-panel-content {
      padding-block: var(--ppanel-content-py, 1.25rem);
      padding-inline: var(--ppanel-content-px, 1.25rem);
      color: var(--ppanel-content-clr, #495057);
      background: var(--ppanel-content-bg, white);
      border: solid var(--ppanel-content-border-clr, #dee2e6);
      border-width: var(--ppanel-content-border-width, 0 1px 1px 1px);
    }
    .p-panel .p-panel-content:last-child {
      border-start-start-radius: var(--ppanel-content-lastchild-border-radius-ss, 0);
      border-start-end-radius: var(--ppanel-content-lastchild-border-radius-se, 0);
      border-end-start-radius: var(--ppanel-content-lastchild-border-radius-es, 6px);
      border-end-end-radius: var(--ppanel-content-lastchild-border-radius-ee, 6px);
    }
    .p-panel.p-panel-toggleable .p-panel-header {
      padding-block: var(--ppanel-toggle-header-py, 0.75rem);
      padding-inline: var(--ppanel-toggle-header-px, 1.25rem);
      cursor: pointer;
    }
    .p-panel.p-panel-toggleable .p-panel-header .p-panel-header-icon:before {
      content: "";
      width: var(--ppanel-toggle-header-customicon-width, 16px);
      height: var(--ppanel-toggle-header-customicon-height, 16px);
      position: absolute;
      inset: 0;
      margin: auto;
      background-image: url('data:image/svg+xml;utf8,<svg width="12" height="6" viewBox="0 0 12 6" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M5.29193 5.71588L1.0462 1.64326C0.952343 1.55396 0.877848 1.44773 0.827011 1.33068C0.776174 1.21363 0.75 1.08809 0.75 0.961285C0.75 0.834485 0.776173 0.708939 0.827011 0.59189C0.877848 0.474841 0.952343 0.368606 1.0462 0.279313C1.23381 0.100415 1.48761 -9.67257e-08 1.75215 -1.31416e-07C2.0167 -1.66107e-07 2.27049 0.100414 2.45811 0.279313L6.00289 3.67957L9.54768 0.279312C9.7353 0.100413 9.98909 -1.21156e-06 10.2536 -1.24625e-06C10.5182 -1.28094e-06 10.772 0.100413 10.9596 0.279312C11.0524 0.369063 11.1258 0.475505 11.1757 0.592533C11.2255 0.70956 11.2507 0.834872 11.25 0.961284C11.2507 1.0877 11.2255 1.21301 11.1757 1.33004C11.1258 1.44706 11.0524 1.5535 10.9596 1.64326L6.71386 5.71588C6.62077 5.80591 6.51002 5.87736 6.38799 5.92613C6.26597 5.97489 6.13509 6 6.0029 6C5.8707 6 5.73982 5.97489 5.6178 5.92613C5.49577 5.87736 5.38502 5.80591 5.29193 5.71588Z" fill="rgb(110 124 145)"/></svg>');
      background-repeat: no-repeat;
      background-position: center;
      background-size: var(--ppanel-toggle-header-customicon-width, 16px) var(--ppanel-toggle-header-customicon-height, 16px);
      transition: all 0.2s ease-in-out;
    }
    .p-panel.p-panel-toggleable .p-panel-header .p-panel-header-icon .p-iconwrapper {
      display: none;
    }
    .p-panel.p-panel-toggleable.p-panel-expanded > .p-panel-header .p-panel-header-icon::before {
      transform: rotate(180deg);
      transition: all 0.2s ease-in-out;
    }
    .p-panel.p-panel-toggleable:not(.p-panel-expanded) > .p-panel-header {
      border-end-start-radius: var(--ppanel-content-lastchild-border-radius-es, 6px);
      border-end-end-radius: var(--ppanel-content-lastchild-border-radius-ee, 6px);
    }
    .p-panel .p-panel-footer {
      padding: 0.75rem 1.25rem;
      border: 1px solid #dee2e6;
      background: #ffffff;
      color: #495057;
      border-bottom-right-radius: 6px;
      border-bottom-left-radius: 6px;
      border-top: 0 none;
    }
    .p-panel .p-panel-icons-end {
      order: 2;
      margin-inline-start: auto;
    }
    .p-panel .p-panel-icons-start {
      order: 0;
      margin-inline-end: 0.5rem;
    }
    .p-panel .p-panel-icons-center {
      order: 2;
      width: 100%;
      text-align: center;
    }
    .p-panel {
      --ppanel-border-clr: #dee2e6;
      --ppanel-border-width: 0;
      --ppanel-border-radius: 6px;
      --ppanel-header-border-clr: #dee2e6;
      --ppanel-header-border-width: 1px;
      --ppanel-header-py: 1.25rem;
      --ppanel-header-px: 1.25rem;
      --ppanel-header-clr: #343a40;
      --ppanel-header-bg:#f8f9fa;
      --ppanel-header-border-radius-ss: 6px;
      --ppanel-header-border-radius-se: 6px;
      --ppanel-header-border-radius-es: 0;
      --ppanel-header-border-radius-ee: 0;
      --ppanel-header-title-fs: 16px;
      --ppanel-header-title-fw:500;
      --ppanel-header-title-lh: 1.2;
      --ppanel-header-icon-width: 2rem;
      --ppanel-header-icon-height: 2rem;
      --ppanel-header-icon-clr: #6c757d;
      --ppanel-header-icon-bg: transparent;
      --ppanel-header-icon-border-clr: transparent;
      --ppanel-header-icon-border-width: 0;
      --ppanel-header-icon-border-radius: 50%;
      --ppanel-header-icon-hover-clr: #343a40;
      --ppanel-header-icon-hover-bg: #e9ecef;
      --ppanel-header-icon-hover-border-clr: transparent;
      --ppanel-header-icon-hover-boxshadow: 0 0 0 0.2rem #BFDBFE;
      --ppanel-content-py: 1.25rem;
      --ppanel-content-px: 1.25rem;
      --ppanel-content-clr: #495057;
      --ppanel-content-bg: white;
      --ppanel-content-border-clr: #dee2e6;
      --ppanel-content-border-width: 0 1px 1px 1px ;
      --ppanel-content-lastchild-border-radius-ss: 0;
      --ppanel-content-lastchild-border-radius-se: 0;
      --ppanel-content-lastchild-border-radius-es: 6px;
      --ppanel-content-lastchild-border-radius-ee: 6px;
      --ppanel-toggle-header-py: 0.75rem;
      --ppanel-toggle-header-px: 1.25rem;
      --ppanel-toggle-header-customicon-width: 16px;
      --ppanel-toggle-header-customicon-height: 16px;
    }
  }
  @layer menuPanel {
    .p-panelmenu {
      --panelMenu-gap: 0;
      --panelMenu-header-content-border-width: 1px;
      --panelMenu-header-content-border-clr: #dee2e6;
      --panelMenu-header-content-clr: #6c757d;
      --panelMenu-header-content-bg: #f8f9fa;
      --panelMenu-header-content-border-radius: 6px;
      --panelMenu-header-content-transition: box-shadow 0.2s;
      --panelMenu-header-content-action-clr: #6c757d;
      --panelMenu-header-content-action-py: 20px;
      --panelMenu-header-content-action-px: 20px;
      --panelMenu-header-content-action-fs: 16px;
      --panelMenu-header-content-action-fw: 700;
      --panelMenu-header-content-action-icon-margin-end: 0.5rem;
      --panelMenu-header-hover-content-border-clr: #dee2e6;
      --panelMenu-header-hover-content-bg: #e9ecef;
      --panelMenu-header-hover-content-clr: #343a40;
      --panelMenu-header-focus-content-boxshadow: inset 0 0 0 0.2rem #BFDBFE;
      --panelMenu-header-highlight-content-bg: #f8f9fa;
      --panelMenu-header-highlight-content-clr: #343a40;
      --panelMenu-header-highlight-content-border-clr: #dee2e6;
      --panelMenu-header-highlight-content-border-radius-ss: 0;
      --panelMenu-header-highlight-content-border-radius-se: 0;
      --panelMenu-header-highlight-content-border-radius-es: 0;
      --panelMenu-header-highlight-content-border-radius-ee: 0;
      --panelMenu-header-highlight-content-my: 0;
      --panelMenu-header-highlight-content-mx: 0;
      --panelMenu-header-highlight-hover-content-border-clr: #dee2e6;
      --panelMenu-header-highlight-hover-content-bg: #e9ecef;
      --panelMenu-header-highlight-hover-content-clr: #343a40;
      --panelMenu-content-py: 4px;
      --panelMenu-content-px: 0px;
      --panelMenu-content-border-width: 0 1px 1px 1px;
      --panelMenu-content-border-clr: #dee2e6;
      --panelMenu-content-bg: white;
      --panelMenu-content-clr: #495057;
      --panelMenu-content-border-radius-ss: 0;
      --panelMenu-content-border-radius-se: 0;
      --panelMenu-content-border-radius-es: 6px;
      --panelMenu-content-border-radius-ee: 6px;
      --panelMenu-content-item-clr: #495057;
      --panelMenu-content-item-transition: box-shadow 0.2s;
      --panelMenu-content-item-border-radius: 0;
      --panelMenu-content-item-link-clr: #495057;
      --panelMenu-content-item-link-py: 12px;
      --panelMenu-content-item-link-px: 20px;
      --panelMenu-content-item-link-text-clr: #495057;
      --panelMenu-content-item-link-icon-clr: #6c757d;
      --panelMenu-content-item-link-icon-my: 8px;
      --panelMenu-content-item-link-icon-mx: 8px;
      --panelMenu-content-item-link-icon-clr: #6c757d;
      --panelMenu-content-item-highlight-clr: #1D4ED8;
      --panelMenu-content-item-highlight-bg: #EFF6FF;
      --panelMenu-content-item-highlight-icon-clr: #1D4ED8;
      --panelMenu-content-item-highlight-focus-bg: rgba(59, 130, 246, 0.24);
      --panelMenu-content-item-focus-clr: #495057;
      --panelMenu-content-item-focus-bg: #dee2e6;
      --panelMenu-content-item-focus-link-icon-clr: #495057;
      --panelMenu-content-item-hover-clr: #495057;
      --panelMenu-content-item-hover-bg: #e9ecef;
      --panelMenu-content-item-hover-link-text-clr: #495057;
      --panelMenu-content-item-hover-link-icon-clr: #6c757d;
      --panelMenu-content-item-separator-border-width: 1px 0 0 0;
      --panelMenu-content-item-separator-border-clr: #dee2e6;
      --panelMenu-content-item-separator-my: 4px;
      --panelMenu-content-item-separator-mx: 0;
      --panelMenu-panel-my: 0 4px;
      --panelMenu-panel-mx: 0 0;
      --panelMenu-content-submenu-py: 0 0;
      --panelMenu-content-submenu-px: 12px 0;
      gap: var(--panelMenu-gap, 0);
    }
    .p-panelmenu .p-panelmenu-header {
      outline: 0 none;
      outline-offset: 0;
    }
    .p-panelmenu .p-panelmenu-header .p-panelmenu-header-content {
      border: var(--panelMenu-header-content-border-width, 1px) solid var(--panelMenu-header-content-border-clr, #dee2e6);
      color: var(--panelMenu-header-content-clr, #6c757d);
      background: var(--panelMenu-header-content-bg, #f8f9fa);
      border-radius: var(--panelMenu-header-content-border-radius, 6px);
      transition: var(--panelMenu-header-content-transition, box-shadow 0.2s);
    }
    .p-panelmenu .p-panelmenu-header .p-panelmenu-header-content .p-panelmenu-header-action {
      color: var(--panelMenu-header-content-action-clr, #6c757d);
      padding-block: var(--panelMenu-header-content-action-py, 20px);
      padding-inline: var(--panelMenu-header-content-action-px, 20px);
      font-size: var(--panelMenu-header-content-action-fs, 16px);
      font-weight: var(--panelMenu-header-content-action-fw, 700);
    }
    .p-panelmenu .p-panelmenu-header .p-panelmenu-header-content .p-panelmenu-header-action .p-submenu-icon,
    .p-panelmenu .p-panelmenu-header .p-panelmenu-header-content .p-panelmenu-header-action .p-menuitem-icon {
      margin-inline-end: var(--panelMenu-header-content-action-icon-margin-end, 0.5rem);
    }
    .p-panelmenu .p-panelmenu-header:not(.p-disabled):focus-visible .p-panelmenu-header-content {
      box-shadow: var(--panelMenu-header-focus-content-boxshadow, inset 0 0 0 0.2rem #BFDBFE);
    }
    .p-panelmenu .p-panelmenu-header:not(.p-disabled)[data-p-highlight=true] .p-panelmenu-header-content,
    .p-panelmenu .p-panelmenu-header:not(.p-disabled).p-highlight .p-panelmenu-header-content {
      background: var(--panelMenu-header-highlight-content-bg, #f8f9fa);
      color: var(--panelMenu-header-highlight-content-clr, #343a40);
      border-color: var(--panelMenu-header-highlight-content-border-clr, #dee2e6);
      border-start-start-radius: var(--panelMenu-header-highlight-content-border-radius-ss, 0);
      border-start-end-radius: var(--panelMenu-header-highlight-content-border-radius-se, 0);
      border-end-start-radius: var(--panelMenu-header-highlight-content-border-radius-es, 0);
      border-end-end-radius: var(--panelMenu-header-highlight-content-border-radius-ee, 0);
      margin-block: var(--panelMenu-header-highlight-content-my, 0);
      margin-inline: var(--panelMenu-header-highlight-content-mx, 0);
    }
    .p-panelmenu .p-panelmenu-header:not(.p-disabled)[data-p-highlight=true]:hover .p-panelmenu-header-content,
    .p-panelmenu .p-panelmenu-header:not(.p-disabled).p-highlight:hover .p-panelmenu-header-content {
      border-color: var(--panelMenu-header-highlight-hover-content-border-clr, #dee2e6);
      background: var(--panelMenu-header-highlight-hover-content-bg, #e9ecef);
      color: var(--panelMenu-header-highlight-hover-content-clr, #343a40);
    }
    .p-panelmenu .p-panelmenu-header:not(.p-disabled):not(.p-highlight):hover .p-panelmenu-header-content {
      border-color: var(--panelMenu-header-hover-content-border-clr, #dee2e6);
      background: var(--panelMenu-header-hover-content-bg, #e9ecef);
      color: var(--panelMenu-header-hover-content-clr, #343a40);
    }
    .p-panelmenu .p-panelmenu-header:not(.p-disabled) .p-panelmenu-header-content:has(> .active) {
      background: var(--panelMenu-header-highlight-content-bg, #f8f9fa);
      color: var(--panelMenu-header-highlight-content-clr, #343a40);
      border-color: var(--panelMenu-header-highlight-content-border-clr, #dee2e6);
      border-start-start-radius: var(--panelMenu-header-highlight-content-border-radius-ss, 0);
      border-start-end-radius: var(--panelMenu-header-highlight-content-border-radius-se, 0);
      border-end-start-radius: var(--panelMenu-header-highlight-content-border-radius-es, 0);
      border-end-end-radius: var(--panelMenu-header-highlight-content-border-radius-ee, 0);
      margin-block: var(--panelMenu-header-highlight-content-my, 0);
      margin-inline: var(--panelMenu-header-highlight-content-mx, 0);
    }
    .p-panelmenu .p-panelmenu-content {
      padding-block: var(--panelMenu-content-py, 4px);
      padding-inline: var(--panelMenu-content-px, 0px);
      border-width: var(--panelMenu-content-border-width, 0 1px 1px 1px);
      border-style: solid;
      border-color: var(--panelMenu-content-border-clr, #dee2e6);
      background: var(--panelMenu-content-bg, white);
      color: var(--panelMenu-content-clr, #495057);
      border-start-start-radius: var(--panelMenu-content-border-radius-ss, 0);
      border-start-end-radius: var(--panelMenu-content-border-radius-se, 0);
      border-end-start-radius: var(--panelMenu-content-border-radius-es, 6px);
      border-end-end-radius: var(--panelMenu-content-border-radius-ee, 6px);
    }
    .p-panelmenu .p-panelmenu-content .p-panelmenu-root-list {
      outline: 0 none;
    }
    .p-panelmenu .p-panelmenu-content .p-menuitem > .p-menuitem-content {
      color: var(--panelMenu-content-item-clr, #495057);
      transition: var(--panelMenu-content-item-transition, box-shadow 0.2s);
      border-radius: var(--panelMenu-content-item-border-radius, 0);
    }
    .p-panelmenu .p-panelmenu-content .p-menuitem > .p-menuitem-content .p-menuitem-link {
      color: var(--panelMenu-content-item-link-clr, #495057);
      padding-block: var(--panelMenu-content-item-link-py, 12px);
      padding-inline: var(--panelMenu-content-item-link-px, 20px);
      -webkit-user-select: none;
      user-select: none;
    }
    .p-panelmenu .p-panelmenu-content .p-menuitem > .p-menuitem-content .p-menuitem-link .p-menuitem-text {
      color: var(--panelMenu-content-item-link-text-clr, #495057);
    }
    .p-panelmenu .p-panelmenu-content .p-menuitem > .p-menuitem-content .p-menuitem-link .p-menuitem-icon {
      color: var(--panelMenu-content-item-link-icon-clr, #6c757d);
      margin-block: var(--panelMenu-content-item-link-icon-my, 8px);
      margin-inline: var(--panelMenu-content-item-link-icon-mx, 8px);
    }
    .p-panelmenu .p-panelmenu-content .p-menuitem > .p-menuitem-content .p-menuitem-link .p-submenu-icon {
      color: var(--panelMenu-content-item-link-icon-clr, #6c757d);
    }
    .p-panelmenu .p-panelmenu-content .p-menuitem.p-highlight > .p-menuitem-content {
      color: var(--panelMenu-content-item-highlight-clr, #1D4ED8);
      background: var(--panelMenu-content-item-highlight-bg, #EFF6FF);
    }
    .p-panelmenu .p-panelmenu-content .p-menuitem.p-highlight > .p-menuitem-content .p-menuitem-link .p-menuitem-text,
    .p-panelmenu .p-panelmenu-content .p-menuitem.p-highlight > .p-menuitem-content .p-menuitem-link .p-menuitem-icon,
    .p-panelmenu .p-panelmenu-content .p-menuitem.p-highlight > .p-menuitem-content .p-menuitem-link .p-submenu-icon {
      color: var(--panelMenu-content-item-highlight-icon-clr, #1D4ED8);
    }
    .p-panelmenu .p-panelmenu-content .p-menuitem.p-highlight.p-focus > .p-menuitem-content {
      background: var(--panelMenu-content-item-highlight-focus-bg, rgba(59, 130, 246, 0.24));
    }
    .p-panelmenu .p-panelmenu-content .p-menuitem:not(.p-highlight):not(.p-disabled).p-focus > .p-menuitem-content {
      color: var(--panelMenu-content-item-focus-clr, #495057);
      background: var(--panelMenu-content-item-focus-bg, #dee2e6);
    }
    .p-panelmenu .p-panelmenu-content .p-menuitem:not(.p-highlight):not(.p-disabled).p-focus > .p-menuitem-content .p-menuitem-link .p-menuitem-text,
    .p-panelmenu .p-panelmenu-content .p-menuitem:not(.p-highlight):not(.p-disabled).p-focus > .p-menuitem-content .p-menuitem-link .p-menuitem-icon,
    .p-panelmenu .p-panelmenu-content .p-menuitem:not(.p-highlight):not(.p-disabled).p-focus > .p-menuitem-content .p-menuitem-link .p-submenu-icon {
      color: var(--panelMenu-content-item-focus-link-icon-clr, #495057);
    }
    .p-panelmenu .p-panelmenu-content .p-menuitem:not(.p-highlight):not(.p-disabled) > .p-menuitem-content:hover {
      color: var(--panelMenu-content-item-hover-clr, #495057);
      background: var(--panelMenu-content-item-hover-bg, #e9ecef);
    }
    .p-panelmenu .p-panelmenu-content .p-menuitem:not(.p-highlight):not(.p-disabled) > .p-menuitem-content:hover .p-menuitem-link .p-menuitem-text {
      color: var(--panelMenu-content-item-hover-link-text-clr, #495057);
    }
    .p-panelmenu .p-panelmenu-content .p-menuitem:not(.p-highlight):not(.p-disabled) > .p-menuitem-content:hover .p-menuitem-link .p-menuitem-icon,
    .p-panelmenu .p-panelmenu-content .p-menuitem:not(.p-highlight):not(.p-disabled) > .p-menuitem-content:hover .p-menuitem-link .p-submenu-icon {
      color: var(--panelMenu-content-item-hover-link-icon-clr, #6c757d);
    }
    .p-panelmenu .p-panelmenu-content .p-menuitem .p-menuitem-content .p-menuitem-link .p-submenu-icon {
      margin-right: 0.5rem;
    }
    .p-panelmenu .p-panelmenu-content .p-menuitem-separator {
      border-width: var(--panelMenu-content-item-separator-border-width, 1px 0 0 0);
      border-style: solid;
      border-color: var(--panelMenu-content-item-separator-border-clr, #dee2e6);
      margin-block: var(--panelMenu-content-item-separator-my, 4px);
      margin-inline: var(--panelMenu-content-item-separator-mx, 0);
    }
    .p-panelmenu .p-panelmenu-content .p-submenu-list:not(.p-panelmenu-root-list) {
      padding-block: var(--panelMenu-content-submenu-py, 0 1rem);
      padding-inline: var(--panelMenu-content-submenu-px, 0 0);
    }
    .p-panelmenu .p-panelmenu-content .p-submenu-list .p-submenu-list {
      padding-block: var(--panelMenu-content-submenu-py, 0 0) !important;
      padding-inline: var(--panelMenu-content-submenu-px, 12px 0) !important;
    }
    .p-panelmenu .p-panelmenu-panel {
      margin-block: var(--panelMenu-panel-my, 0 4px);
      margin-inline: var(--panelMenu-panel-mx, 0 0);
      background: none;
      border: 0;
      overflow: initial;
    }
  }
  @layer menu {
    .p-menu {
      min-width: var(--pmenu-minwidth, 12.5rem);
      margin-block: var(--pmenu-my, 5px 0);
      color: var(--pmenu-color, #334155);
      background: var(--pmenu-background, white);
      border-width: var(--pmenu-border-width, 1px);
      border-style: var(--pmenu-border-style, solid);
      border-color: var(--pmenu-border-clr, transparent);
      border-radius: var(--p-menu-border-radius, 6px);
    }
    .p-menu .p-menu-list {
      flex-direction: var(--pmenu-list-flexDirection, column);
      padding-block: var(--pmenu-list-py, 1rem);
      padding-inline: var(--pmenu-list-px, 1rem);
      gap: var(--pmenu-list-gap, 0.5rem);
    }
    .p-menu .p-menu-list .p-menu-item .p-menu-item-content {
      transition: all 0s;
      padding-block: var(--pmenu-content-py, 0);
      padding-inline: var(--pmenu-content-px, 0.5rem);
      border-radius: var(--pmenu-content-border-radius, 0);
      color: var(--pmenu-content-clr, #334155);
      background: var(--pmenu-content-bg, #334155);
      cursor: pointer;
    }
    .p-menu .p-menu-list .p-menu-item .p-menu-item-content .p-menu-item-link {
      gap: var(--pmenu-link-gap, 0.5rem);
    }
    .p-menu .p-menu-list .p-menu-item .p-menu-item-content .p-menu-item-link > .svg-icon {
      width: var(--pmenu-link-icon-width, auto);
      height: var(--pmenu-link-icon-height, 1rem);
      color: var(--pmenu-link-icon-clr, inherit);
    }
    .p-menu .p-menu-list .p-menu-item:not(.p-disabled) .p-menu-item-content:hover {
      transition: all 0s;
      color: var(--pmenu-content-hover-clr, white);
      background: var(--pmenu-content-hover-bg, var(--clr-primary));
    }
    .p-menu .p-menu-list .p-menu-separator {
      border-top: 1px solid var(--pmenu-separator-border-clr, lightgrey);
      padding-inline: var(--pmenu-separator-px, 0);
    }
    .p-menu {
      --pmenu-minwidth: 12.5rem;
      --pmenu-my: 5px 0;
      --pmenu-color: #334155;
      --pmenu-background: white;
      --pmenu-border-width: 1px;
      --pmenu-border-style: solid;
      --pmenu-border-clr: transparent;
      --pmenu-list-flexDirection: column;
      --pmenu-list-py: 1rem;
      --pmenu-list-px: 1rem;
      --pmenu-list-gap: 0.5rem;
      --pmenu-content-py: 0;
      --pmenu-content-px: 0.5rem;
      --pmenu-content-border-radius: 0;
      --pmenu-content-clr: #334155;
      --pmenu-content-bg: transparent;
      --pmenu-link-gap: 0.5rem;
      --pmenu-link-icon-width: auto;
      --pmenu-link-icon-height: 1rem;
      --pmenu-link-icon-clr: inherit;
      --pmenu-content-hover-clr: white;
      --pmenu-content-hover-bg: var(--clr-primary);
      --pmenu-separator-border-clr: lightgrey;
      --pmenu-separator-px: 0;
    }
  }
  @layer modals {
    .p-dialog {
      border-radius: var(--modal-border-radius, 6px);
      box-shadow: var(--modal-boxshadow, 0 1px 3px rgba(0, 0, 0, 0.3));
      border: var(--modal-border-width, 0px) solid var(--modal-border-clr, transparent);
      background: var(--modal-bg);
    }
    .p-dialog .p-dialog-header {
      border-bottom: var(--modal-header-border-bottom-width, 0) solid var(--modal-header-border-bottom-clr, transparent);
      background: var(--modal-header-bg, var(--modal-bg));
      color: var(--modal-header-clr, #343a40);
      padding-block: var(--modal-header-py, 20px);
      padding-inline: var(--modal-header-px, 20px);
      border-start-start-radius: var(--modal-header-border-radius-ss, var(--modal-border-radius));
      border-start-end-radius: var(--modal-header-border-radius-se, var(--modal-border-radius));
      border-end-start-radius: var(--modal-header-border-radius-es, 0);
      border-end-end-radius: var(--modal-header-border-radius-ee, 0);
    }
    .p-dialog .p-dialog-header .p-dialog-title {
      font-size: var(--modal-header-title-fs, 16px);
      font-weight: var(--modal-header-title-fw, 500);
    }
    .p-dialog .p-dialog-header .p-dialog-header-actions p-button {
      --pbtn-padding-block: 4px;
      --pbtn-padding-inline: 4px;
      --pbtn-minwidth: 20px;
      --pbtn-minheight: 20px;
      --pbtn-bg: #9CA1AA;
      --pbtn-border-radius: 50%;
    }
    .p-dialog .p-dialog-header .p-dialog-header-actions p-button timesicon {
      width: 12px;
      height: 12px;
    }
    .p-dialog .p-dialog-header .p-dialog-header-actions p-button timesicon path {
      fill: white;
    }
    .p-dialog .p-dialog-content {
      padding-block: var(--modal-content-py, 0 2rem);
      padding-inline: var(--modal-content-px, 1.5rem);
      background: var(--modal-content-bg, white);
      color: var(--modal-content-clr, #495057);
    }
    .p-dialog .p-dialog-content:last-of-type {
      border-end-start-radius: var(--modal-content-border-radius-es, var(--modal-border-radius));
      border-end-end-radius: var(--modal-content-border-radius-ee, var(--modal-border-radius));
    }
    .p-dialog .p-dialog-footer {
      border-top: var(--modal-footer-border-width, 0px) solid var(--modal-footer-border-clr, transparent);
      background: var(--modal-footer-bg, white);
      color: var(--modal-footer-clr, #495057);
      padding-block: var(--modal-footer-py, 0 1.5rem);
      padding-inline: var(--modal-footer-px, 1.5rem);
      text-align: var(--modal-footer-text-align, end);
      border-end-start-radius: var(--modal-footer-border-radius-es, var(--modal-border-radius));
      border-end-end-radius: var(--modal-footer-border-radius-ee, var(--modal-border-radius));
      display: flex;
      align-items: center;
      gap: var(--modal-footer-gap, 8px);
      flex-wrap: wrap;
    }
    .p-dialog .p-dialog-footer > * {
      flex: 1;
      --btn-width: 100%;
      min-width: max-content;
    }
    .p-dialog {
      --modal-border-radius: 6px;
      --modal-boxshadow: 0 1px 3px rgba(0, 0, 0, 0.3);
      --modal-border-width: 0;
      --modal-border-clr: transparent;
      --modal-header-border-bottom-width: 0;
      --modal-header-border-bottom-clr: transparent;
      --modal-header-bg: white;
      --modal-header-clr: #343a40;
      --modal-header-py: 20px;
      --modal-header-px: 20px;
      --modal-header-title-fs: 16px;
      --modal-header-title-fw: 500;
      --modal-header-close-width: 32px;
      --modal-header-close-height: 32px;
      --modal-header-close-clr: #6c757d;
      --modal-header-close-border-width: 0;
      --modal-header-close-border-clr: transparent;
      --modal-header-close-bg: transparent;
      --modal-header-close-border-radius: 100%;
      --modal-header-close-transition:
        background-color 0.2s,
        color 0.2s,
        box-shadow 0.2s;
      --modal-header-close-my: 0;
      --modal-header-close-mx: 0 8px;
      --modal-header-close-hover-clr: #343a40;
      --modal-header-close-hover-bg: #e9ecef;
      --modal-header-close-hover-border-clr: transparent;
      --modal-header-close-focus-boxshadow: 0 0 0 0.2rem #BFDBFE;
      --modal-content-py: 0 2rem;
      --modal-content-px: 1.5rem;
      --modal-content-bg: white;
      --modal-content-clr: #495057;
      --modal-footer-bg: white;
      --modal-footer-clr: #495057;
      --modal-footer-py: 0 1.5rem;
      --modal-footer-px: 1.5rem;
      --modal-footer-text-align: end;
      --modal-footer-gap: 8px;
    }
    .p-component-overlay.p-dialog-mask {
      background: var(--modal-overlay-bg, rgba(0, 0, 0, 0.4)) !important;
      transition-duration: 0.2s;
    }
    .p-component-overlay.p-dialog-mask.p-component-overlay-enter {
      animation: p-component-overlay-enter-animation 150ms forwards;
    }
    .p-component-overlay.p-dialog-mask.p-component-overlay-leave {
      animation: p-component-overlay-leave-animation 150ms forwards;
    }
    .p-component-overlay {
      --modal-overlay-bg: rgba(0, 0, 0, 0.4);
    }
    @keyframes p-component-overlay-enter-animation {
      from {
        background-color: transparent;
      }
      to {
        background-color: var(--maskbg);
      }
    }
    @keyframes p-component-overlay-leave-animation {
      from {
        background-color: var(--maskbg);
      }
      to {
        background-color: transparent;
      }
    }
  }
  @layer fileUpload {
    .p-fileupload .p-fileupload-buttonbar {
      background: #f8f9fa;
      padding: 1.25rem;
      border: 1px solid #dee2e6;
      color: #343a40;
      border-bottom: 0 none;
      border-top-right-radius: 6px;
      border-top-left-radius: 6px;
    }
    .p-fileupload .p-fileupload-buttonbar .p-button {
      margin-right: 0.5rem;
    }
    .p-fileupload .p-fileupload-buttonbar .p-button.p-fileupload-choose.p-focus {
      outline: 0 none;
      outline-offset: 0;
      box-shadow: 0 0 0 0.2rem #BFDBFE;
    }
    .p-fileupload .p-fileupload-content.p-fileupload-highlight {
      border-color: 1px dashed #3B82F6;
      border-style: dashed;
      background-color: #EFF6FF;
    }
    .p-fileupload .p-progressbar {
      height: 0.25rem;
    }
    .p-fileupload .p-fileupload-row > div {
      padding: 1rem 1rem;
    }
    .p-fileupload.p-fileupload-advanced .p-message {
      margin-top: 0;
    }
    .p-fileupload .p-fileupload-choose:not(.p-disabled):hover {
      background: #2563eb;
      color: #ffffff;
      border-color: #2563eb;
    }
    .p-fileupload .p-fileupload-choose:not(.p-disabled):active {
      background: #1D4ED8;
      color: #ffffff;
      border-color: #1D4ED8;
    }
  }
  @layer sliderRange {
    .p-slider {
      position: relative;
      background: var(--pslider-track-bg, #F0F1F2);
      border-radius: var(--pslider-border-radius, 0);
    }
    .p-slider .p-slider-range {
      display: block;
      background: var(--pslider-range-bg, #3DAAE1);
      border-radius: var(--pslider-border-radius, 0);
    }
    .p-slider .p-slider-handle {
      cursor: grab;
      touch-action: none;
      display: flex;
      justify-content: center;
      align-items: center;
      height: var(--pslider-handle-height, 20px);
      width: var(--pslider-handle-width, 20px);
      background: var(--pslider-handle-bg, #3DAAE1);
      border-radius: var(--pslider-handle-border-radius, 100%);
      outline-color: transparent;
    }
    .p-slider .p-slider-handle::before {
      content: "";
      width: var(--pslider-handle-content-width, 20px);
      height: var(--pslider-handle-content-height, 20px);
      display: block;
      background: var(--pslider-handle-content-bg, white);
      border-radius: var(--pslider-handle-content-border-radius, 100%);
      box-shadow: var(--pslider-handle-content-shadow, none);
    }
    .p-slider.p-slider-horizontal {
      height: var(--pslider-track-size, 3px);
    }
    .p-slider.p-slider-horizontal .p-slider-range {
      top: 0;
      inset-inline-start: 0;
      height: 100%;
    }
    .p-slider.p-slider-horizontal .p-slider-handle {
      top: 50%;
      margin-top: calc(-1 * var(--pslider-handle-height) / 2);
      margin-inline-start: calc(-1 * var(--pslider-handle-width) / 2);
    }
    .p-slider {
      --pslider-track-bg: #F0F1F2;
      --pslider-range-bg: #3DAAE1;
      --pslider-border-radius: 0;
      --pslider-handle-height: 20px;
      --pslider-handle-width: 20px;
      --pslider-handle-bg: #3DAAE1;
      --pslider-handle-border-radius: 100%;
      --pslider-handle-content-width: 20px;
      --pslider-handle-content-height: 20px;
      --pslider-handle-content-bg: #3DAAE1;
      --pslider-handle-content-border-radius: 100%;
      --pslider-handle-content-shadow: none;
      --pslider-track-size: 3px;
    }
  }
  @layer toast {
    .p-toast {
      opacity: var(--toast-opacity, 0.9);
    }
    .p-toast .p-toast-message {
      margin-block: var(--toast-msg-wrapper-my, 0 1rem);
      margin-inline: var(--toast-msg-wrapper-mx, 0);
      color: var(--toast-msg-wrapper-clr, inherit);
      background: var(--toast-msg-wrapper-bg, inherit);
      border: solid var(--toast-msg-wrapper-border-clr, transparent);
      border-width: var(--toast-msg-wrapper-border-width, 0);
      border-radius: var(--toast-msg-wrapper-border-radius, 6px);
      box-shadow: var(--toast-msg-wrapper-boxshadow, 0 2px 12px 0 rgba(0, 0, 0, 0.1));
    }
    .p-toast .p-toast-message .p-toast-message-content {
      padding-block: var(--toast-msg-content-py, 1rem);
      padding-inline: var(--toast-msg-content-px, 1rem);
      border: solid var(--toast-msg-content-border-clr, transparent);
      border-width: var(--toast-msg-content-border-width, 0 0 0 6px);
      border-radius: var(--toast-msg-content-border-radius, 6px);
    }
    .p-toast .p-toast-message .p-toast-message-content .p-toast-message-content:not(:has(.p-toast-summary)) {
      align-items: center;
    }
    .p-toast .p-toast-message .p-toast-message-content .p-toast-message-content:not(:has(.p-toast-summary)) .p-toast-detail {
      margin-block: 0;
    }
    .p-toast .p-toast-message .p-toast-message-content .p-toast-message-content:not(:has(.p-toast-detail)) {
      align-items: center;
    }
    .p-toast .p-toast-message .p-toast-message-content .p-toast-summary:empty,
    .p-toast .p-toast-message .p-toast-message-content .p-toast-detail:empty {
      display: none;
    }
    .p-toast .p-toast-message .p-toast-message-content .p-toast-summary:empty + .p-toast-detail {
      margin-block: 0;
    }
    .p-toast .p-toast-message .p-toast-message-content .p-toast-message-text {
      margin-block: var(--toast-msg-content-text-my, 0);
      margin-inline: var(--toast-msg-content-text-mx, 0 1rem);
    }
    .p-toast .p-toast-message .p-toast-message-content .p-toast-message-text .p-toast-summary {
      font-size: var(--toast-msg-content-text-summary-fs, 14px);
      font-weight: var(--toast-msg-content-text-summary-fw, 500);
      line-height: var(--toast-msg-content-text-summary-lh, 1.2);
    }
    .p-toast .p-toast-message .p-toast-message-content .p-toast-message-text .p-toast-detail {
      margin-block: var(--toast-msg-content-text-detail-my, 0.5rem 0);
      margin-inline: var(--toast-msg-content-text-detail-mx, 0);
      font-size: var(--toast-msg-content-text-detail-fs, 14px);
      font-weight: var(--toast-msg-content-text-detail-fw, 400);
      line-height: var(--toast-msg-content-text-detail-lh, 1.2);
    }
    .p-toast .p-toast-message .p-toast-message-content .p-toast-message-icon {
      display: flex;
      align-items: center;
      justify-content: center;
      color: var(--toast-msg-content-icon-clr, inherit);
    }
    .p-toast .p-toast-message .p-toast-message-content .p-toast-message-icon .p-icon {
      width: var(--toast-msg-content-icon-width, 20px);
      height: var(--toast-msg-content-icon-height, 20px);
    }
    .p-toast .p-toast-message .p-toast-icon-close {
      width: var(--toast-msg-content-close-width, 2rem);
      height: var(--toast-msg-content-close-height, 2rem);
      border: solid var(--toast-msg-content-close-border-clr, transparent);
      border-width: var(--toast-msg-content-close-border-width, 0);
      border-radius: var(--toast-msg-content-close-border-radius, 100%);
      color: var(--toast-msg-content-close-clr, gray);
      background: var(--toast-msg-content-close-bg, transparent);
      transition:
        background-color 0.2s,
        color 0.2s,
        box-shadow 0.2s;
    }
    .p-toast .p-toast-message .p-toast-icon-close:hover {
      background: var(--toast-msg-content-close-hover-bg, rgba(255, 255, 255, 0.3));
    }
    .p-toast .p-toast-message .p-toast-icon-close:focus-visible {
      outline: 0 none;
      outline-offset: 0;
      box-shadow: var(--toast-msg-content-close-focus-boxshadow, 0 0 0 0.2rem #BFDBFE);
    }
    .p-toast .p-toast-message.p-toast-message-info {
      --toast-msg-wrapper-clr: #696cff;
      --toast-msg-wrapper-bg: #e9e9ff;
      --toast-msg-wrapper-border-clr: #696cff;
      --toast-msg-wrapper-border-width: 0 0 0 6px;
      --toast-msg-content-close-clr: #696cff;
      --toast-msg-content-icon-clr: #696cff;
    }
    .p-toast .p-toast-message.p-toast-message-success {
      --toast-msg-wrapper-clr: #1ea97c;
      --toast-msg-wrapper-bg: #e4f8f0;
      --toast-msg-wrapper-border-clr: #1ea97c;
      --toast-msg-wrapper-border-width: 0 0 0 6px;
      --toast-msg-content-close-clr: #1ea97c;
      --toast-msg-content-icon-clr: #1ea97c;
    }
    .p-toast .p-toast-message.p-toast-message-warn {
      --toast-msg-wrapper-clr: #cc8925;
      --toast-msg-wrapper-bg: #fff2e2;
      --toast-msg-wrapper-border-clr: #cc8925;
      --toast-msg-wrapper-border-width: 0 0 0 6px;
      --toast-msg-content-close-clr: #cc8925;
      --toast-msg-content-icon-clr: #cc8925;
    }
    .p-toast .p-toast-message.p-toast-message-error {
      --toast-msg-wrapper-clr: #ff5757;
      --toast-msg-wrapper-bg: #ffe7e6;
      --toast-msg-wrapper-border-clr: #ff5757;
      --toast-msg-wrapper-border-width: 0 0 0 6px;
      --toast-msg-content-close-clr: #ff5757;
      --toast-msg-content-icon-clr: #ff5757;
    }
    .p-toast {
      --toast-opacity: 0.9;
      --toast-msg-wrapper-my: 0 1rem;
      --toast-msg-wrapper-mx: 0;
      --toast-msg-wrapper-boxshadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
      --toast-msg-wrapper-border-radius: 6px;
      --toast-msg-wrapper-clr: inherit;
      --toast-msg-wrapper-bg: inherit;
      --toast-msg-wrapper-border-clr: transparent;
      --toast-msg-wrapper-border-width: 0;
      --toast-msg-content-py: 1rem;
      --toast-msg-content-px: 1rem;
      --toast-msg-content-border-clr: transparent;
      --toast-msg-content-border-width: 0 0 0 6px;
      --toast-msg-content-border-radius: 6px;
      --toast-msg-content-text-my: 0;
      --toast-msg-content-text-mx: 0 1rem;
      --toast-msg-content-text-summary-fs: 14px;
      --toast-msg-content-text-summary-fw: 500;
      --toast-msg-content-text-summary-lh: 1.2;
      --toast-msg-content-text-detail-my: 0.5rem 0;
      --toast-msg-content-text-detail-mx: 0;
      --toast-msg-content-text-detail-fs: 14px;
      --toast-msg-content-text-detail-fw: 400;
      --toast-msg-content-text-detail-lh: 1.2;
      --toast-msg-content-icon-width: 20px;
      --toast-msg-content-icon-height: 20px;
      --toast-msg-content-close-width: 2rem;
      --toast-msg-content-close-height: 2rem;
      --toast-msg-content-close-clr: inherit;
      --toast-msg-content-close-bg: transparent;
      --toast-msg-content-close-border-clr: transparent;
      --toast-msg-content-close-border-width: 0;
      --toast-msg-content-close-border-radius: 100%;
      --toast-msg-content-close-hover-bg: rgba(255, 255, 255, 0.3);
      --toast-msg-content-close-focus-boxshadow: 0 0 0 0.2rem #BFDBFE;
    }
  }
  @layer editor {
    p-editor .p-editor-container {
      margin-block: var(--editor-my, 0 24px);
      margin-inline: var(--editor-mx, 0);
    }
    p-editor .p-editor-container .p-editor-toolbar {
      background: var(--editor-toolbar-bg, #f8f9fa);
      border-start-start-radius: var(--editor-border-radius-ss, 6px);
      border-start-end-radius: var(--editor-border-radius-se, 6px);
    }
    p-editor .p-editor-container .p-editor-toolbar.ql-snow {
      border: 1px solid var(--editor-border-clr, #dee2e6);
    }
    p-editor .p-editor-container .p-editor-toolbar.ql-snow .ql-stroke {
      stroke: #6c757d;
    }
    p-editor .p-editor-container .p-editor-toolbar.ql-snow .ql-fill {
      fill: #6c757d;
    }
    p-editor .p-editor-container .p-editor-toolbar.ql-snow .ql-picker .ql-picker-label {
      border: 0 none;
      color: #6c757d;
    }
    [dir=rtl] p-editor .p-editor-container .p-editor-toolbar.ql-snow .ql-picker .ql-picker-label {
      text-align: end;
    }
    p-editor .p-editor-container .p-editor-toolbar.ql-snow .ql-picker .ql-picker-label:hover {
      color: #495057;
    }
    p-editor .p-editor-container .p-editor-toolbar.ql-snow .ql-picker .ql-picker-label:hover .ql-stroke {
      stroke: #495057;
    }
    p-editor .p-editor-container .p-editor-toolbar.ql-snow .ql-picker .ql-picker-label:hover .ql-fill {
      fill: #495057;
    }
    p-editor .p-editor-container .p-editor-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-label {
      color: #495057;
    }
    p-editor .p-editor-container .p-editor-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-stroke {
      stroke: #495057;
    }
    p-editor .p-editor-container .p-editor-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-fill {
      fill: #495057;
    }
    p-editor .p-editor-container .p-editor-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options {
      background: #ffffff;
      border: 0 none;
      box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
      border-radius: 6px;
      padding: 0.75rem 0;
    }
    p-editor .p-editor-container .p-editor-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options .ql-picker-item {
      color: #495057;
    }
    p-editor .p-editor-container .p-editor-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options .ql-picker-item:hover {
      color: #495057;
      background: #e9ecef;
    }
    p-editor .p-editor-container .p-editor-toolbar.ql-snow .ql-picker.ql-expanded:not(.ql-icon-picker) .ql-picker-item {
      padding: 0.75rem 1.25rem;
    }
    p-editor .p-editor-container .p-editor-content {
      height: var(--editor-height, 320px);
      border-end-start-radius: var(--editor-border-radius-es, 6px);
      border-end-end-radius: var(--editor-border-radius-ee, 6px);
    }
    p-editor .p-editor-container .p-editor-content .ql-snow {
      border: 1px solid var(--editor-border-clr, #dee2e6);
    }
    p-editor .p-editor-container .p-editor-content .ql-editor {
      background: var(--editor-body-bg, white);
      color: var(--editor-body-clr, #495057);
      border-end-start-radius: var(--editor-border-radius-es, 6px);
      border-end-end-radius: var(--editor-border-radius-ee, 6px);
      text-align: start;
    }
    p-editor .p-editor-container .p-editor-content .ql-editor.ql-blank::before {
      color: var(--editor-placeholder-clr, #B5BCC4);
      font-size: var(--editor-placeholder-fs, 12.62px);
      font-weight: var(--editor-placeholder-fw, 400);
      font-style: normal;
      pointer-events: none;
      position: absolute;
      left: unset;
      right: unset;
      inset-inline-start: 15px;
    }
    p-editor .p-editor-container .p-editor-content .ql-editor strong {
      font-weight: bold;
    }
    p-editor .p-editor-container .p-editor-content .ql-editor em {
      font-style: italic;
    }
    p-editor .p-editor-container .p-editor-content .ql-editor ol {
      padding: 0;
    }
    p-editor .p-editor-container .p-editor-content .ql-editor ol li {
      padding: 0;
      padding-inline-start: 1.5em;
    }
    p-editor .p-editor-container .p-editor-content .ql-editor ol li > .ql-ui:before {
      margin: 0;
      margin-inline-start: -1em;
      margin-inline-end: 0.3em;
      text-align: start;
    }
    p-editor .p-editor-container .p-editor-content .ql-editor ol li[data-list=bullet] > .ql-ui:before {
      width: 5px;
      height: 5px;
      border-radius: 100%;
      background: currentColor;
      margin-block-start: 0.6em;
    }
    p-editor .p-editor-container .p-editor-content .ql-editor .ql-align-center {
      text-align: center;
    }
    p-editor .p-editor-container .p-editor-content .ql-editor .ql-align-right {
      text-align: right;
      direction: rtl;
    }
    p-editor .p-editor-container .p-editor-content .ql-editor .ql-align-justify {
      text-align: justify;
    }
    p-editor .p-editor-container .p-editor-content .ql-editor .ql-direction-ltr {
      direction: ltr;
    }
    p-editor .p-editor-container .p-editor-content .ql-editor .ql-direction-rtl {
      direction: rtl;
    }
    p-editor .p-editor-container .p-editor-content.ql-disabled .ql-editor {
      background: var(--editor-readonly-body-bg, #EEF2F6);
    }
    p-editor .p-editor-container .ql-snow.ql-toolbar button:hover,
    p-editor .p-editor-container .ql-snow.ql-toolbar button:focus {
      color: #495057;
    }
    p-editor .p-editor-container .ql-snow.ql-toolbar button:hover .ql-stroke,
    p-editor .p-editor-container .ql-snow.ql-toolbar button:focus .ql-stroke {
      stroke: #495057;
    }
    p-editor .p-editor-container .ql-snow.ql-toolbar button:hover .ql-fill,
    p-editor .p-editor-container .ql-snow.ql-toolbar button:focus .ql-fill {
      fill: #495057;
    }
    p-editor .p-editor-container .ql-snow.ql-toolbar button.ql-active,
    p-editor .p-editor-container .ql-snow.ql-toolbar .ql-picker-label.ql-active,
    p-editor .p-editor-container .ql-snow.ql-toolbar .ql-picker-item.ql-selected {
      color: #3B82F6;
    }
    p-editor .p-editor-container .ql-snow.ql-toolbar button.ql-active .ql-stroke,
    p-editor .p-editor-container .ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke,
    p-editor .p-editor-container .ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke {
      stroke: #3B82F6;
    }
    p-editor .p-editor-container .ql-snow.ql-toolbar button.ql-active .ql-fill,
    p-editor .p-editor-container .ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-fill,
    p-editor .p-editor-container .ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-fill {
      fill: #3B82F6;
    }
    p-editor .p-editor-container .ql-snow.ql-toolbar button.ql-active .ql-picker-label,
    p-editor .p-editor-container .ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-picker-label,
    p-editor .p-editor-container .ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-picker-label {
      color: #3B82F6;
    }
    p-editor {
      --editor-my: 0 24px;
      --editor-mx: 0;
      --editor-height: 320px;
      --editor-toolbar-bg: #f8f9fa;
      --editor-border-radius-ss: 6px;
      --editor-border-radius-se: 6px;
      --editor-border-radius-es: 6px;
      --editor-border-radius-ee: 6px;
      --editor-border-clr: #dee2e6;
      --editor-body-bg: white;
      --editor-readonly-body-bg: #EEF2F6;
      --editor-body-clr: #495057;
      --editor-placeholder-clr: #B5BCC4;
      --editor-placeholder-fs: 12.62px;
      --editor-placeholder-fw: 400;
    }
  }
  @layer stepper {
    .p-stepper .p-stepper-nav {
      position: relative;
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-block: var(--stepper-nav-my, 0);
      margin-inline: var(--stepper-nav-mx, 0);
      padding-block: var(--stepper-nav-py, 0);
      padding-inline: var(--stepper-nav-px, 0);
      list-style-type: none;
      overflow-x: auto;
      border: solid var(--stepper-nav-border-clr, transparent);
      border-width: var(--stepper-nav-border-width, 0);
      border-radius: var(--stepper-nav-border-radius, 0);
    }
    .p-stepper .p-stepper-nav .p-stepper-header {
      position: relative;
      display: flex;
      flex: 1 1 auto;
      align-items: center;
      padding-block: var(--stepper-header-py, 0.5rem);
      padding-inline: var(--stepper-header-px, 0.5rem);
    }
    .p-stepper .p-stepper-nav .p-stepper-header:last-of-type {
      flex: initial;
    }
    .p-stepper .p-stepper-nav .p-stepper-header.p-highlight .p-stepper-action {
      cursor: default;
    }
    .p-stepper .p-stepper-nav .p-stepper-header.p-highlight .p-stepper-action .p-stepper-number {
      background: var(--stepper-header-active-number-bg, #EFF6FF);
      color: var(--stepper-header-active-number-clr, #1D4ED8);
    }
    .p-stepper .p-stepper-nav .p-stepper-header.p-highlight .p-stepper-action .p-stepper-title {
      color: var(--stepper-header-active-title-clr, #4b5563);
    }
    .p-stepper .p-stepper-nav .p-stepper-header:not(.p-disabled):focus-visible {
      outline: 0 none;
      outline-offset: 0;
      box-shadow: var(--stepper-header-focus-boxshadow, 0 0 0 0.2rem #BFDBFE);
    }
    .p-stepper .p-stepper-nav .p-stepper-header:has(~ .p-highlight) .p-stepper-separator {
      background-color: var(--stepper-header-active-separator-bg, #3B82F6);
    }
    .p-stepper .p-stepper-nav .p-stepper-header .p-stepper-action {
      display: var(--stepper-header-action-display, inline-flex);
      align-items: center;
      flex-direction: var(--stepper-header-action-flexdirection, row);
      background: var(--stepper-header-action-bg, white);
      border: solid var(--stepper-header-action-border-clr, transparent);
      border-width: var(--stepper-header-action-border-width, 1px);
      border-radius: var(--stepper-header-action-border-radius, 6px);
      text-decoration: none;
      cursor: pointer;
      transition: box-shadow 0.2s;
      outline-color: transparent;
    }
    .p-stepper .p-stepper-nav .p-stepper-header .p-stepper-action .p-stepper-number {
      display: flex;
      align-items: center;
      justify-content: center;
      color: var(--stepper-header-number-clr, #4b5563);
      background: var(--stepper-header-number-bg, white);
      border: solid var(--stepper-header-number-border-clr, #f3f4f6);
      border-width: var(--stepper-header-number-border-width, 2px);
      border-radius: var(--stepper-header-number-border-radius, 50%);
      width: var(--stepper-header-number-width, auto);
      min-width: var(--stepper-header-number-minwidth, 2rem);
      height: var(--stepper-header-number-height, 2rem);
      font-size: var(--stepper-header-number-fs, 1.143rem);
      font-weight: var(--stepper-header-number-fw, 400);
      line-height: var(--stepper-header-number-lh, 2rem);
      transition:
        background-color 0.2s,
        color 0.2s,
        box-shadow 0.2s;
    }
    .p-stepper .p-stepper-nav .p-stepper-header .p-stepper-action .p-stepper-title {
      display: block;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      max-width: var(--stepper-header-title-maxwidth, 100%);
      margin-block: var(--stepper-header-title-my, 0);
      margin-inline: var(--stepper-header-title-mx, 0.5rem 0);
      color: var(--stepper-header-title-clr, #6b7280);
      font-size: var(--stepper-header-title-fs, 700);
      font-weight: var(--stepper-header-title-fw, 700);
      line-height: var(--stepper-header-title-lh, 1.5);
      transition:
        background-color 0.2s,
        color 0.2s,
        box-shadow 0.2s;
    }
    .p-stepper .p-stepper-nav .p-stepper-header .p-stepper-action:not(.p-disabled):focus-visible {
      outline: 0 none;
      outline-offset: 0;
      box-shadow: var(--stepper-header-action-focus-boxshadow, 0 0 0 0.2rem #BFDBFE);
    }
    .p-stepper .p-stepper-nav .p-stepper-header .p-stepper-action:focus-visible {
      outline: 0 none;
      outline-offset: 0;
      box-shadow: var(--stepper-header-action-focus-boxshadow, 0 0 0 0.2rem #BFDBFE);
    }
    .p-stepper .p-stepper-separator {
      flex: 1 1 0;
      width: var(--stepper-header-separator-width, 100%);
      height: var(--stepper-header-separator-height, 2px);
      margin-block: var(--stepper-header-separator-my, 0);
      margin-inline: var(--stepper-header-separator-mx, 1rem 0);
      background-color: var(--stepper-header-separator-bg, #e5e7eb);
      transition: box-shadow 0.2s;
    }
    .p-stepper .p-stepper-panels {
      padding-block: var(--stepper-content-py, 1.25rem);
      padding-inline: var(--stepper-content-px, 1.25rem);
      background: var(--stepper-content-bg, white);
      color: var(--stepper-content-clr, #4b5563);
    }
    .p-stepper.p-stepper-readonly .p-stepper-header {
      cursor: auto;
    }
    .p-stepper.p-stepper-vertical {
      display: flex;
      flex-direction: column;
    }
    .p-stepper.p-stepper-vertical .p-stepper-nav {
      flex-direction: column;
    }
    .p-stepper.p-stepper-vertical .p-stepper-toggleable-content {
      display: flex;
      flex: 1 1 auto;
      background: var(--stepper-vertically-content-toggleable-bg, white);
      color: var(--stepper-vertically-content-toggleable-clr, #4b5563);
    }
    .p-stepper.p-stepper-vertical .p-stepper-panel {
      display: flex;
      flex-direction: column;
      flex: initial;
    }
    .p-stepper.p-stepper-vertical .p-stepper-panel.p-stepper-panel-active {
      flex: 1 1 auto;
    }
    .p-stepper.p-stepper-vertical .p-stepper-panel:has(~ .p-stepper-panel-active) .p-stepper-separator {
      background-color: #3B82F6;
    }
    .p-stepper.p-stepper-vertical .p-stepper-panel:last-of-type .p-stepper-content {
      padding-left: 3rem;
    }
    .p-stepper.p-stepper-vertical .p-stepper-panel .p-stepper-header {
      flex: initial;
    }
    .p-stepper.p-stepper-vertical .p-stepper-panel .p-stepper-content {
      width: 100%;
      padding-left: 1rem;
    }
    .p-stepper.p-stepper-vertical .p-stepper-panel .p-stepper-separator {
      flex: 0 0 auto;
      width: 2px;
      height: auto;
      margin-inline-start: calc(1.75rem + 2px);
    }
    .p-stepper {
      --stepper-nav-my: 0;
      --stepper-nav-mx: 0;
      --stepper-nav-py: 0;
      --stepper-nav-px: 0;
      --stepper-nav-border-clr: transparent;
      --stepper-nav-border-width: 0;
      --stepper-nav-border-radius: 0;
      --stepper-header-py: 0.5rem;
      --stepper-header-px: 0.5rem;
      --stepper-header-active-number-bg: #EFF6FF;
      --stepper-header-active-number-clr: #1D4ED8;
      --stepper-header-active-title-clr: #4b5563;
      --stepper-header-focus-boxshadow: 0 0 0 0.2rem #BFDBFE;
      --stepper-header-active-separator-bg: #3B82F6;
      --stepper-header-action-display: inline-flex;
      --stepper-header-action-flexdirection: row;
      --stepper-header-action-bg: white;
      --stepper-header-action-border-clr: transparent;
      --stepper-header-action-border-width: 1px;
      --stepper-header-action-border-radius: 6px;
      --stepper-header-number-clr: #4b5563;
      --stepper-header-number-bg: white;
      --stepper-header-number-border-clr: #f3f4f6;
      --stepper-header-number-border-width: 2px;
      --stepper-header-number-border-radius: 50%;
      --stepper-header-number-minwidth: 2rem;
      --stepper-header-number-width: auto;
      --stepper-header-number-height: 2rem;
      --stepper-header-number-fs: 1.143rem;
      --stepper-header-number-fw: 400;
      --stepper-header-number-lh: 2rem;
      --stepper-header-title-maxwidth: 100%;
      --stepper-header-title-my: 0;
      --stepper-header-title-mx: 0.5rem 0;
      --stepper-header-title-clr: #6b7280;
      --stepper-header-title-fs: 700;
      --stepper-header-title-fw: 700;
      --stepper-header-title-lh: 1.5;
      --stepper-header-action-focus-boxshadow: 0 0 0 0.2rem #BFDBFE;
      --stepper-header-separator-width: 100%;
      --stepper-header-separator-height: 2px;
      --stepper-header-separator-my: 0;
      --stepper-header-separator-mx: 1rem 0;
      --stepper-header-separator-bg: #e5e7eb;
      --stepper-content-py: 1.25rem;
      --stepper-content-px: 1.25rem;
      --stepper-content-bg: white;
      --stepper-content-clr: #4b5563;
    }
  }
}
@layer themes {
  @layer fonts, components, layout, modules, custom, general;
  @layer fonts {
    @font-face {
      font-family: "BahijSansArabic";
      src: url("./media/Bahij_TheSansArabic-Light.ttf");
      src: url("./media/Bahij_TheSansArabic-Light.ttf") format("truetype");
      font-weight: 300;
      font-style: normal;
      font-display: swap;
    }
    @font-face {
      font-family: "BahijSansArabic";
      src: url("./media/Bahij_TheSansArabic-SemiLight.ttf");
      src: url("./media/Bahij_TheSansArabic-SemiLight.ttf") format("truetype");
      font-weight: normal;
      font-style: normal;
      font-display: swap;
    }
    @font-face {
      font-family: "BahijSansArabic";
      src: url("./media/Bahij_TheSansArabic-SemiBold.ttf");
      src: url("./media/Bahij_TheSansArabic-SemiBold.ttf") format("truetype");
      font-weight: 500;
      font-style: normal;
      font-display: swap;
    }
    @font-face {
      font-family: "BahijSansArabic";
      src: url("./media/Bahij_TheSansArabic-Bold.ttf");
      src: url("./media/Bahij_TheSansArabic-Bold.ttf") format("truetype");
      font-weight: 700;
      font-style: normal;
      font-display: swap;
    }
    @font-face {
      font-family: "BahijSansArabic";
      src: url("./media/Bahij_TheSansArabic-ExtraBold.ttf");
      src: url("./media/Bahij_TheSansArabic-ExtraBold.ttf") format("truetype");
      font-weight: 800;
      font-style: normal;
      font-display: swap;
    }
    @font-face {
      font-family: "BahijSansArabic";
      src: url("./media/Bahij_TheSansArabic-Black.ttf");
      src: url("./media/Bahij_TheSansArabic-Black.ttf") format("truetype");
      font-weight: 900;
      font-style: normal;
      font-display: swap;
    }
    body {
      --body-ff-ar: "BahijSansArabic";
      --body-ff-en: "BahijSansArabic";
    }
  }
  @layer components {
    .het-btn {
      --pbtn-padding-block: 4px;
      --pbtn-padding-inline: 1rem;
      --pbtn-margin-block: 0px;
      --pbtn-margin-inline: 0px;
      --pbtn-align: center;
      --pbtn-justify-content: center;
      --pbtn-gap: 0.5rem;
      --pbtn-width: auto;
      --pbtn-minwidth: auto;
      --pbtn-height: auto;
      --pbtn-minheight: 2.75rem;
      --pbtn-fs: 1rem;
      --pbtn-fw: 400;
      --pbtn-lineheight: 22px;
      --pbtn-text-decoration: none;
      --pbtn-clr: white;
      --pbtn-bg: var(--clr-primary);
      --pbtn-border-radius: 6px;
      --pbtn-border-width: 1px;
      --pbtn-border-style: solid;
      --pbtn-border-clr: transparent;
      --pbtn-opacity: 1;
      --pbtn-boxshadow: none;
      --pbtn-outline: 0;
      --pbtn-link-hover-clr: var(--clr-primary);
      --pbtn-disabled-bg: #D1D3D8;
      --pbtn-disabled-clr: #898E99;
      --pbtn-disabled-border-clr: transparent;
      --pbtn-disabled-opacity: 0.5;
    }
    .het-btn.btn-fw-bold {
      --pbtn-fw: 700;
    }
    .het-btn.w-100 {
      --pbtn-width: 100%;
    }
    .het-btn.btn-primary {
      --pbtn-clr: var(--clr-white);
      --pbtn-bg: var(--clr-primary);
      --pbtn-border-clr: var(--clr-primary);
    }
    .het-btn.btn-light-primary {
      --pbtn-clr: var(--clr-primary);
      --pbtn-bg: var(--clr-light-primary);
      --pbtn-border-clr: var(--clr-light-primary);
    }
    .het-btn.btn-dark-primary {
      --pbtn-clr: var(--clr-white);
      --pbtn-bg: var(--clr-dark-primary);
      --pbtn-border-clr: var(--clr-dark-primary);
    }
    .het-btn.btn-secondary {
      --pbtn-clr: var(--clr-white);
      --pbtn-bg: var(--clr-secondary);
      --pbtn-border-clr: var(--clr-secondary);
    }
    .het-btn.btn-secondary .p-button-outlined {
      --pbtn-clr: #2D3036;
    }
    .het-btn.btn-darker-grey {
      --pbtn-clr: var(--clr-white);
      --pbtn-bg: #4C515B;
      --pbtn-border-clr: #4C515B;
    }
    .het-btn.btn-darker-grey .p-button-outlined {
      --pbtn-clr: #2D3036;
    }
    .het-btn.btn-success {
      --pbtn-clr: var(--clr-white);
      --pbtn-bg: var(--clr-success);
      --pbtn-border-clr: var(--clr-success);
    }
    .het-btn.btn-warning {
      --pbtn-clr: var(--clr-white);
      --pbtn-bg: var(--clr-warning);
      --pbtn-border-clr: var(--clr-warning);
    }
    .het-btn.btn-danger {
      --pbtn-clr: var(--clr-white);
      --pbtn-bg: var(--clr-danger);
      --pbtn-border-clr: var(--clr-danger);
    }
    .het-btn.btn-light-danger {
      --pbtn-clr: var(--clr-danger);
      --pbtn-bg: var(--clr-light-danger);
      --pbtn-border-clr: var(--clr-light-danger);
    }
    .het-btn.btn-light-danger-2 {
      --pbtn-clr: var(--clr-danger);
      --pbtn-bg: #EF44444D;
      --pbtn-border-clr: transparent;
    }
    .het-btn.btn-back {
      --pbtn-bg: #F7F7F8;
      --pbtn-clr: #2D3036;
      --pbtn-border-clr: #F7F7F8;
    }
    .het-btn.btn-back .svg-icon {
      transform: rotate(180deg);
    }
    [dir=ltr] .het-btn.btn-back .svg-icon {
      transform: rotate(0deg);
    }
    .het-btn.btn-filter {
      --pbtn-bg: transparent;
      --pbtn-clr: #0EA5E9;
      --pbtn-border-clr: #5EC3F0;
    }
    .het-btn.btn-filter.active {
      --pbtn-bg: #ECF7FC;
      --pbtn-clr: #3DAAE1;
      --pbtn-border-clr: transparent;
    }
    .het-btn.btn-language,
    .het-btn.btn-notification {
      --pbtn-fs: 14px;
      --pbtn-fw: 700;
      --pbtn-lineheight: 17px;
      --pbtn-padding-inline: 12px;
      --pbtn-clr: #6B7280;
      --pbtn-bg: #F7F7F8;
      --pbtn-minheight: 48px;
    }
    .het-btn.btn-notification {
      --pbtn-minwidth: 48px;
    }
    .het-btn.btn-notification.new-notification .svg-icon {
      position: relative;
    }
    .het-btn.btn-notification.new-notification .svg-icon::after {
      content: "";
      position: absolute;
      top: 1px;
      inset-inline-start: 1px;
      width: 8px;
      height: 8px;
      background: var(--clr-danger);
      border-radius: 100%;
      border: 2px solid white;
    }
    .het-tag {
      --ptag-py: 0.4375rem;
      --ptag-px: 0.75rem;
      --ptag-bg: var(--clr-primary);
      --ptag-clr: white;
      --ptag-fs: 0.75rem;
      --ptag-fw: 400;
      --ptag-lh: 1.125rem;
      --ptag-border-radius: 0.5rem;
      --ptag-rounded-border-radius: 40vw;
      --ptag-gap: 0;
      min-width: max-content;
    }
    .het-tag.p-tag-primary {
      --ptag-bg: #C3E5F6;
      --ptag-clr: var(--clr-primary);
    }
    .het-tag.p-tag-dark-primary {
      --ptag-bg: #BCC0D599;
      --ptag-clr: #263579;
    }
    .het-tag.p-tag-light-dark-primary {
      --ptag-bg: #E9EBF2;
      --ptag-clr: #23306E;
    }
    .het-tag.p-tag-secondary {
      --ptag-bg: #F0F1F2;
      --ptag-clr: #3B3F46;
    }
    .het-tag.p-tag-success {
      --ptag-bg: var(--clr-light-success);
      --ptag-clr: var(--clr-success);
    }
    .het-tag.p-tag-successSolid {
      --ptag-bg: var(--clr-success);
      --ptag-clr: white;
    }
    .het-tag.p-tag-info {
      --ptag-bg: var(--clr-light-primary);
      --ptag-clr: var(--clr-info);
    }
    .het-tag.p-tag-warning {
      --ptag-bg: #FEF0C7;
      --ptag-clr: #DC6803;
    }
    .het-tag.p-tag-danger {
      --ptag-bg: #FEE4E2;
      --ptag-clr: #F04438;
    }
    .het-tag.p-tag-grey {
      --ptag-bg: #3B3F4629;
      --ptag-clr: #2D3036;
    }
    .het-tag.tag-sm {
      --ptag-py: 3px;
      --ptag-px: 8px;
    }
    .het-card {
      --pcard-padding: 25px;
      --pcard-mb: 24px;
      --pcard-bg: white;
      --pcard-border-clr: #E9EBF2;
      --pcard-border-radius: 6px;
      --pcard-header-padding: 0;
      --pcard-header-borderbottom-widh: 0px;
      --pcard-header-borderbottom-clr: transparent;
      --pcard-header-gap: 8px;
      --pcard-header-mobile-gap: 8px;
      --pcard-header-title-gap: 4px;
      --pcard-header-title-clr: #101633;
      --pcard-header-title-fs: 1rem;
      --pcard-header-title-fw: 700;
      --pcard-header-title-linheight: 19px;
      --pcard-header-toolbar-gap: 16px;
      --pcard-body-padding-block: 32px 0px;
      --pcard-footer-gap: 8px;
      --pcard-footer-action-gap: 16px;
      --pcard-footer-padding-block: 8px 0;
      --pcard-footer-bordertop-clr: transparent;
      --pcard-header-subtitle-marginblock: 0;
      --pcard-header-subtitle-margininline: 0;
      --pcard-header-subtitle-clr: #4C515B;
      --pcard-header-subtitle-fs: 1rem;
      --pcard-header-subtitle-fw: 400;
      --pcard-header-subtitle-linheight: 19px;
    }
    .het-card.body-p-0 {
      --pcard-body-padding-block: 0;
    }
    .het-card.card-p-0 {
      --pcard-padding: 0;
    }
    .het-card.body-pt-16 {
      --pcard-body-padding-block: 16px 0;
    }
    .het-card.footer-mt-32 {
      --pcard-footer-margin-block: 32px 0;
    }
    .het-card-toggle {
      --ppanel-header-border-clr: #CED7E3;
      --ppanel-header-border-width: 0;
      --ppanel-header-py: 24px;
      --ppanel-header-px: 24px;
      --ppanel-header-clr: #4C515B;
      --ppanel-header-bg: white;
      --ppanel-header-border-radius-ss: 8px;
      --ppanel-header-border-radius-se: 8px;
      --ppanel-header-border-radius-es: 0;
      --ppanel-header-border-radius-ee: 0;
      --ppanel-header-title-fs: 16px;
      --ppanel-header-title-fw: 500;
      --ppanel-header-title-lh: 22.4px;
      --ppanel-header-icon-width: 24px;
      --ppanel-header-icon-height: 24px;
      --ppanel-header-icon-clr: #6E7C91;
      --ppanel-header-icon-bg: transparent;
      --ppanel-header-icon-border-clr: transparent;
      --ppanel-header-icon-border-width: 0;
      --ppanel-header-icon-border-radius: 8px;
      --ppanel-header-icon-hover-clr: #6E7C91;
      --ppanel-header-icon-hover-bg: transparent;
      --ppanel-header-icon-hover-border-clr: transparent;
      --ppanel-header-icon-hover-boxshadow: 0 0 0 0.2rem #BFDBFE;
      --ppanel-content-py: 16px;
      --ppanel-content-px: 24px;
      --ppanel-content-clr: #424B59;
      --ppanel-content-bg: white;
      --ppanel-content-border-clr: #CED7E3;
      --ppanel-content-border-width: 1px 0 0 0;
      --ppanel-content-lastchild-border-radius-ss: 0;
      --ppanel-content-lastchild-border-radius-se: 0;
      --ppanel-content-lastchild-border-radius-es: 8px;
      --ppanel-content-lastchild-border-radius-ee: 8px;
      --ppanel-toggle-header-py: 24px;
      --ppanel-toggle-header-px: 24px;
      --ppanel-toggle-header-customicon-width: 16px;
      --ppanel-toggle-header-customicon-height: 16px;
      --ppanel-header-border-clr: #F7F7F8;
      --ppanel-header-border-width: 0 0 1px 0;
      --ppanel-header-title-fs: 18px;
      --ppanel-toggle-header-py: 0;
      --ppanel-toggle-header-px: 0;
      --ppanel-content-border-width: 0;
      --ppanel-content-lastchild-border-radius-es: 0;
      --ppanel-content-lastchild-border-radius-ee: 0;
      --ppanel-content-py: 20px 0;
      --ppanel-content-px: 0;
    }
    .het-card-error {
      --pcard-padding: 48px;
      --pcard-border-radius: 1rem;
      --pcard-body-padding-block: 0;
      --pcard-mb: 0;
      text-align: center;
      min-width: 660px;
    }
    @media screen and (max-width: 767.98px) {
      .het-card-error {
        min-width: calc(100% - 50px);
        margin-inline: auto;
      }
    }
    .het-card-error .logo-wrapper h2 {
      font-weight: 400;
      font-size: 12.32px;
      line-height: 15px;
      color: #2D3036;
      margin-bottom: 64px;
      margin-top: 6px;
    }
    .het-card-error .error-content-wrapper > *:not(:last-child) {
      margin-bottom: 48px;
    }
    .het-card-error .error-content-wrapper > .svg-icon {
      color: var(--clr-danger);
    }
    .het-card-error .error-content-wrapper .error-content h3 {
      font-weight: 500;
      font-size: 20px;
      line-height: 24px;
      color: #2D3036;
      margin-bottom: 12px;
    }
    .het-card-error .error-content-wrapper .error-content p {
      font-weight: 400;
      font-size: 16px;
      line-height: 1;
      color: #6B7280;
    }
    .het-card-error .error-content-wrapper .het-btn {
      --pbtn-gap: 15px;
      --pbtn-minwidth: 270px;
    }
    .het-card-error.error-404 {
      --pcard-padding: 90px 120px;
    }
    .het-card-error.error-404 .error-content-wrapper > *:not(:last-child) {
      margin-bottom: 58px;
    }
    .het-card-error.error-404 .error-content-wrapper .error-content h3 {
      font-weight: 800;
      font-size: 18px;
      line-height: 29px;
      color: #3B3F46;
      margin-bottom: 4px;
    }
    .het-card-error.error-404 .error-content-wrapper .error-content p {
      font-weight: 400;
      font-size: 16px;
      line-height: 29px;
      color: #6B7280;
    }
    .het-card-error.error-permission {
      --pcard-padding: 90px 70px;
    }
    .het-card-error.error-permission .error-content-wrapper > *:not(:last-child) {
      margin-bottom: 58px;
    }
    .het-card-error.error-permission .error-content-wrapper .svg-icon svg {
      width: 105px;
      height: auto;
    }
    .het-card-error.error-permission .error-content-wrapper p {
      max-width: 48ch;
      margin-inline: auto;
    }
    .het-chip {
      --chip-gap: 8px;
      --chip-py: 3px;
      --chip-px: 6px 8px;
      --chip-clr: #4C515B;
      --chip-bg: #F0F1F2;
      --chip-border-width: 1px;
      --chip-border-clr: transparent;
      --chip-border-radius: 40vw;
      --chip-fs: 14px;
      --chip-fw: 400;
      --chip-lh: 17px;
      --chip-text-my: 0;
      --chip-text-mx: 0;
      --chip-icon-py: 5px;
      --chip-icon-px: 5px;
      --chip-icon-my: 0;
      --chip-icon-mx: 0;
      --chip-icon-width: 16px;
      --chip-icon-height: 16px;
      --chip-icon-clr: #898E99;
      --chip-icon-bg: #D1D3D8;
      --chip-icon-border-width: 1px;
      --chip-icon-border-clr: transparent;
      --chip-icon-border-radius: 100%;
      --chip-icon-hover-clr: #495057;
      --chip-icon-hover-bg: #e2e7ed;
      --chip-icon-hover-border-clr: transparent;
      --chip-icon-hover-border-radius: 6px;
      --chip-icon-focus-boxshadow: 0 0 0 0.2rem #BFDBFE;
    }
    .het-form-control {
      --form-control-width: 100%;
      --form-control-height: auto;
      --form-control-minwidth: 150px;
      --form-control-minheight: 44px;
      --form-control-lh: 17px;
      --form-control-py: 5px;
      --form-control-px: 12px;
      --form-control-border-width: 1px;
      --form-control-border-clr: #D1D3D8;
      --form-control-border-radius: 6px;
      --form-control-bg: white;
      --form-control-clr: #4C515B;
      --form-control-fs: 14px;
      --form-control-fw: 400;
      --form-control-boxshadow: none;
      --form-control-transition:
        background-color 0.2s,
        color 0.2s,
        border-color 0.2s,
        box-shadow 0.2s;
      --form-control-hover-border-clr: var(--clr-primary);
      --form-control-focus-boxshadow: none;
      --form-control-focus-border-clr: var(--clr-primary);
      --form-control-invalid-border-clr: var(--clr-danger);
      --form-control-placeholder-minheight: 17px;
      --form-control-placeholder-fs: 14px;
      --form-control-placeholder-fw: 400;
      --form-control-placeholder-clr: #6B7280;
      --form-control-disabled-clr: #4C515B;
      --form-control-disabled-bg: #F0F1F2;
      --form-control-disabled-border-clr: #BBBEC5;
      --form-control-autofill-boxshadow: none;
      --form-control-autofill-bg: white;
      --form-control-autofill-clr: #4C515B;
    }
    .het-form-control::-webkit-outer-spin-button,
    .het-form-control::-webkit-inner-spin-button {
      -webkit-appearance: none;
      margin: 0;
    }
    .het-form-control[type=number] {
      appearance: textfield;
      -moz-appearance: textfield;
    }
    @media screen and (min-width: 992px) {
      .het-form-control.input-years {
        --form-control-min-width: auto;
      }
    }
    @media screen and (max-width: 550.98px) {
      .het-form-control.w-auto-input-sm {
        --form-control-min-width: 100px;
      }
    }
    textarea.het-form-control {
      --form-control-py: 12px;
      --form-control-placeholder-clr: #9CA1AA;
    }
    p-password {
      --ppassword-icon-insetend: 1rem;
      --ppassword-icon-width: 1rem;
      --ppassword-icon-height: 1rem;
      --ppassword-icon-color: #898E99;
    }
    .riyal-icon.p-iconfield > .svg-icon {
      padding-inline-start: 15px;
      height: auto;
      max-height: 30px;
      border-inline-start: 1px solid #D1D3D8;
      inset-inline-start: auto;
    }
    .het-form-error {
      --palert-my: 0.5rem 0;
      --palert-py: 0;
      --palert-px: 0;
      --palert-bg: transparent;
      --palert-border-width: 0;
      --palert-content-clr: var(--clr-danger);
      --palert-content-fs: 0.75rem;
      --palert-content-lh: 0.875rem;
    }
    .het-form-error.error-mt-0 .p-message-content {
      margin-top: 0;
    }
    .het-switch {
      --pswitch-width: 33px;
      --pswitch-height: 20px;
      --pswitch-slider-bg: #CED7E3;
      --pswitch-slider-transition: all 0.2;
      --pswitch-slider-border-radius: 40vw;
      --pswitch-circle-bg: white;
      --pswitch-circle-width: calc(var(--pswitch-height) - 8px);
      --pswitch-circle-height: calc(var(--pswitch-height) - 8px);
      --pswitch-circle-border-radius: 100%;
      --pswitch-circle-left: 4px;
      --pswitch-slider-checked-bg: var(--clr-primary);
      --pswitch-circle-checked-bg: white;
      --pswitch-slider-checked-hover-bg: var(--clr-primary);
      --pswitch-slider-focus-boxshadow: none;
      --pswitch-slider-hover-bg: #b6bfc8;
      --pswitch-focus-border-clr: var(--clr-primary);
      position: relative;
    }
    .switch-wrapper {
      display: flex;
      align-items: center;
      gap: 8px;
    }
    .switch-wrapper.switch-filter {
      padding: 10px 16px;
      margin: 0;
      border: 1px solid #CED7E3;
      border-radius: 8px;
      cursor: pointer;
    }
    .switch-wrapper.switch-filter .switch-label {
      width: max-content;
    }
    .switch-wrapper .switch-label {
      font-size: 14px;
      font-weight: 400;
      line-height: 17px;
      color: #6B7280;
    }
    .switch-wrapper:has(.p-toggleswitch.p-toggleswitch-checked) .switch-label {
      color: #101633;
    }
    .switch-wrapper.switch-block {
      align-items: flex-start;
      padding: 16px;
      border: 1px solid #F0F1F2;
      border-radius: 8px;
      gap: 16px;
    }
    .switch-wrapper.switch-block .switch-content-wrapper {
      display: flex;
      align-items: flex-start;
      flex-direction: column;
    }
    .switch-wrapper.switch-block .switch-content-wrapper .switch-title,
    .switch-wrapper.switch-block .switch-content-wrapper .switch-label {
      font-size: 16px;
      font-weight: 400;
      line-height: 20px;
      color: #6B7280;
    }
    .switch-wrapper.switch-block .switch-content-wrapper .switch-title {
      font-weight: 500;
      color: #3B3F46;
      margin-bottom: 12px;
    }
    .het-radio {
      --radio-wrapper-gap: 8px;
      --radio-width: 20px;
      --radio-height: 20px;
      --radio-clr: #4C515B;
      --radio-bg: white;
      --radio-border-clr: #898E99;
      --radio-border-width: 2px;
      --radio-border-radius: 50%;
      --radio-boxshadow: none;
      --radio-active-border-clr: var(--clr-primary);
      --radio-active-bg: white;
      --radio-active-hover-border-clr: var(--clr-primary);
      --radio-active-hover-bg: white;
      --radio-active-hover-clr: var(--clr-primary);
      --radio-icon-width: 12px;
      --radio-icon-height: 12px;
      --radio-icon-bg: #F5FAFF;
      --radio-active-icon-bg: var(--clr-primary);
      --radio-invalid-border-clr: var(--clr-danger);
      --radio-label-my: 0;
      --radio-label-mx: 0;
      --radio-label-py: 0;
      --radio-label-px: 0;
      --radio-label-clr: #4C515B;
      --radio-label-fs: 16px;
      --radio-label-fw: 400;
      --radio-label-lh: 20px;
    }
    .radio-wrapper {
      display: inline-flex;
      align-items: flex-start;
      gap: 8px;
      background: white;
      padding: 12px 16px;
      border: 1px solid #CED7E3;
      border-radius: 8px;
      cursor: pointer;
    }
    .radio-wrapper .radio-label {
      color: #4C515B;
      font-size: 16px;
      font-weight: 400;
      line-height: 22px;
      margin: 0;
      cursor: pointer;
      width: max-content;
    }
    .radio-wrapper .radio-label > span {
      display: flex;
      align-items: center;
      font-weight: 400;
      font-size: 14px;
      line-height: 20px;
      color: #898E99;
      margin-top: 4px;
    }
    .radio-wrapper:has(.p-radiobutton-checked),
    .radio-wrapper:hover {
      border: 1px solid var(--clr-primary);
      background: #ECF7FC;
    }
    .radio-wrapper:has(.p-radiobutton-checked) .het-radio:not(.p-disabled):not(.p-highlight) .p-radiobutton-box,
    .radio-wrapper:hover .het-radio:not(.p-disabled):not(.p-highlight) .p-radiobutton-box {
      border-color: var(--radio-active-border-clr, #3B82F6);
    }
    .radio-wrapper:has(.p-radiobutton-checked) .het-radio:not(.p-disabled):not(.p-highlight) .p-radiobutton-box .p-radiobutton-icon,
    .radio-wrapper:hover .het-radio:not(.p-disabled):not(.p-highlight) .p-radiobutton-box .p-radiobutton-icon {
      background-color: var(--radio-active-icon-bg, #3B82F6);
      transform: unset;
      visibility: unset;
    }
    .radio-wrapper + .radio-wrapper {
      margin-inline-start: 8px;
    }
    .het-checkbox-wrapper {
      --pcheckbox-gap: 0.5rem;
      --pcheckbox-box-width: 20px;
      --pcheckbox-box-height: 20px;
      --pcheckbox-box-clr: #495057;
      --pcheckbox-box-bg: white;
      --pcheckbox-box-border-clr: #ced4da;
      --pcheckbox-box-border-width: 1px;
      --pcheckbox-box-border-radius: 4px;
      --pcheckbox-box-boxshadow: none;
      --pcheckbox-box-icon-width: 14px;
      --pcheckbox-box-icon-height: 13px;
      --pcheckbox-box-icon-clr: #495057;
      --pcheckbox-box-icon-transition-duration: 0.2s;
      --pcheckbox-box-hover-border-clr: #263579;
      --pcheckbox-box-checked-border-clr: #263579;
      --pcheckbox-box-checked-bg: #263579;
      --pcheckbox-box-checked-icon-clr: white;
      --pcheckbox-cursor: pointer;
      --pcheckbox-label-clr: #6E7C91;
      --pcheckbox-label-fs: 16px;
      --pcheckbox-label-fw: 400;
      --pcheckbox-label-lh: 1.2;
    }
    p-datepicker {
      --calendar-width: 100%;
      --calendar-input-padding-ie: 40px;
      --calendar-icon-width: 16px;
      --calendar-icon-height: 16px;
      --calendar-icon-inset-ie: 12px;
      --calendar-icon-width: 16px;
      --calendar-icon-height: 16px;
      --calendar-input-clear-padding-ie: 60px;
      --calendar-clear-icon-inset-ie: 35px;
      --calendar-clear-icon-width: 16px;
      --calendar-clear-icon-height: 16px;
      --calendar-clear-icon-clr: #6E7C91;
    }
    p-datepicker .p-datepicker-timeonly .svg-icon {
      position: absolute;
      inset-inline-end: 10px;
      inset-block: 0;
      margin-block: auto;
    }
    p-datepicker .p-datepicker-timeonly .svg-icon svg {
      width: 16px;
      height: auto;
      color: var(--clr-secondary);
    }
    p-datepicker .p-datepicker:has(input.het-form-control[readonly]) {
      pointer-events: none;
    }
    p-datepicker .p-datepicker-input-icon-container {
      top: 0;
      inset-block: 0;
      margin-block: auto;
      height: auto;
      max-height: 20px;
    }
    p-datepicker .p-datepicker-clear-icon {
      position: absolute;
      inset-block: 0;
      margin-block: auto;
    }
    p-datepicker .p-datepicker-clear-icon svg {
      width: 13px;
    }
    .het-calendar-ddl {
      direction: ltr;
      --calendar-ddl-py: 0.5rem;
      --calendar-ddl-px: 0.5rem;
      --calendar-ddl-bg: white;
      --calendar-ddl-clr: #495057;
      --calendar-ddl-border-clr: #ced4da;
      --calendar-ddl-border-width: 1px;
      --calendar-ddl-border-radius: 6px;
      --calendar-ddl-header-py: 0.5rem;
      --calendar-ddl-header-px: 0.5rem;
      --calendar-ddl-header-clr: #495057;
      --calendar-ddl-header-bg: white;
      --calendar-ddl-header-fw: 600;
      --calendar-ddl-header-my: 0;
      --calendar-ddl-header-mx: 0;
      --calendar-ddl-header-border-clr: #dee2e6;
      --calendar-ddl-header-border-width: 0 0 1px 0;
      --calendar-ddl-header-border-radius-ss: 6px;
      --calendar-ddl-header-border-radius-se: 6px;
      --calendar-ddl-header-border-radius-es: 0px;
      --calendar-ddl-header-border-radius-ee: 0px;
      --calendar-ddl-header-prevNextBtn-width: 2rem;
      --calendar-ddl-header-prevNextBtn-height: 2rem;
      --calendar-ddl-header-prevNextBtn-clr: #6c757d;
      --calendar-ddl-header-prevNextBtn-bg: transparent;
      --calendar-ddl-header-prevNextBtn-border-clr: transparent;
      --calendar-ddl-header-prevNextBtn-border-width: 0;
      --calendar-ddl-header-prevNextBtn-border-radius: 50%;
      --calendar-ddl-header-prevNextBtn-hover-clr: #343a40;
      --calendar-ddl-header-prevNextBtn-hover-bg: #e9ecef;
      --calendar-ddl-header-prevNextBtn-hover-border-clr: transparent;
      --calendar-ddl-header-title-lh: 2rem;
      --calendar-ddl-header-title-py: 0.5rem;
      --calendar-ddl-header-title-px: 0.5rem;
      --calendar-ddl-header-title-clr: #495057;
      --calendar-ddl-header-title-fs: 16px;
      --calendar-ddl-header-title-fw: 600;
      --calendar-ddl-header-title-hover-clr: #3B82F6;
      --calendar-ddl-header-title-yearMonth-gap: 0.5rem;
      --calendar-ddl-table-fs: 1rem;
      --calendar-ddl-table-my: 0.5rem;
      --calendar-ddl-table-mx: 0;
      --calendar-ddl-table-th-py: 0.5rem;
      --calendar-ddl-table-th-px: 0.5rem;
      --calendar-ddl-table-th-width: 2.5rem;
      --calendar-ddl-table-th-height: 2.5rem;
      --calendar-ddl-table-th-clr: #495057;
      --calendar-ddl-table-th-fs: 1rem;
      --calendar-ddl-table-th-fw: 600;
      --calendar-ddl-table-th-lh: inherit;
      --calendar-ddl-table-th-bg: transparent;
      --calendar-ddl-table-td-py: 0.5rem;
      --calendar-ddl-table-td-px: 0.5rem;
      --calendar-ddl-table-td-bg: transparent;
      --calendar-ddl-table-td-width: 2.5rem;
      --calendar-ddl-table-td-height: 2.5rem;
      --calendar-ddl-table-td-fs: 1rem;
      --calendar-ddl-table-td-fw: 600;
      --calendar-ddl-table-td-lh: inherit;
      --calendar-ddl-table-td-clr: #495057;
      --calendar-ddl-table-td-bg: transparent;
      --calendar-ddl-table-td-border-clr: transparent;
      --calendar-ddl-table-td-border-width: 1px;
      --calendar-ddl-table-td-border-radius: 50%;
      --calendar-ddl-table-td-highlight-clr: #1D4ED8;
      --calendar-ddl-table-td-highlight-bg: #EFF6FF;
      --calendar-ddl-table-today-clr: #495057;
      --calendar-ddl-table-today-bg: #ced4da;
      --calendar-ddl-table-today-border-clr: transparent;
      --calendar-ddl-table-today-highlight-clr: #1D4ED8;
      --calendar-ddl-table-today-highlight-bg: #EFF6FF;
      --calendar-ddl-table-selected-clr: white;
      --calendar-ddl-table-selected-bg: var(--clr-primary);
      --calendar-ddl-table-selected-border-clr: transparent;
      --calendar-ddl-table-selected-range-bg: var(--clr-light-primary);
      --calendar-ddl-table-selected-range-clr: #6E7C91;
    }
    .het-calendar-ddl .p-datepicker-prev-button:dir(rtl) {
      transform: rotate(0deg);
    }
    .het-calendar-ddl .p-datepicker-next-button:dir(rtl) {
      transform: rotate(0deg);
    }
    .het-calendar-ddl.range-calender {
      --calendar-ddl-px: 0;
    }
    .het-calendar-ddl.range-calender .p-datepicker-today span {
      border-color: var(--clr-primary);
      background-color: transparent;
      color: var(--clr-primary);
    }
    .het-calendar-ddl.range-calender tr td {
      --calendar-ddl-table-td-py: 4px;
      --calendar-ddl-table-td-px: 4px;
      min-width: auto;
      width: auto;
      padding: 0;
      border: solid white;
      border-width: 4px 0;
    }
    .het-calendar-ddl.range-calender tr td:has(.p-highlight) {
      position: relative;
      background: #E6F3EC;
    }
    .het-calendar-ddl.range-calender tr td .p-highlight {
      background: transparent;
      color: #1D192B;
    }
    .het-calendar-ddl.range-calender tr td::before {
      position: absolute;
      height: 100%;
      background: #E6F3EC;
      inset-inline: 50%;
      margin-inline: auto;
      width: 50%;
    }
    .het-calendar-ddl.range-calender tr td::after {
      position: absolute;
      height: 100%;
      background: #E6F3EC;
      inset-inline: 0;
      width: 50%;
      top: 0;
      z-index: -1;
    }
    .het-calendar-ddl.range-calender tr td:not(:has(.p-highlight)) + td:has(.p-highlight) {
      border-start-start-radius: 40px;
      border-end-start-radius: 40px;
      background: transparent;
    }
    .het-calendar-ddl.range-calender tr td:not(:has(.p-highlight)) + td:has(.p-highlight)::before {
      content: "";
    }
    .het-calendar-ddl.range-calender tr td:not(:has(.p-highlight)) + td:has(.p-highlight) .p-highlight {
      background: var(--clr-primary);
      color: white;
    }
    .het-calendar-ddl.range-calender tr td:not(:has(.p-highlight)) + td:has(.p-highlight):not(:has(+ td .p-highlight))::before,
    .het-calendar-ddl.range-calender tr td:not(:has(.p-highlight)) + td:has(.p-highlight):not(:has(+ td .p-highlight))::after {
      content: none;
    }
    .het-calendar-ddl.range-calender tr td:not(:has(+ td .p-highlight)):has(.p-highlight) {
      border-start-end-radius: 40px;
      border-end-end-radius: 40px;
      background: transparent;
    }
    .het-calendar-ddl.range-calender tr td:not(:has(+ td .p-highlight)):has(.p-highlight)::after {
      content: "";
    }
    .het-calendar-ddl.range-calender tr td:not(:has(+ td .p-highlight)):has(.p-highlight) .p-highlight {
      background: var(--clr-primary);
      color: white;
    }
    .het-calendar-ddl.range-calender tr:not(:has(td:last-child .p-highlight)) + tr td:first-child:has(.p-highlight) {
      border-start-start-radius: 40px;
      border-end-start-radius: 40px;
      background: transparent;
    }
    .het-calendar-ddl.range-calender tr:not(:has(td:last-child .p-highlight)) + tr td:first-child:has(.p-highlight)::before {
      content: "";
    }
    .het-calendar-ddl.range-calender tr:not(:has(td:last-child .p-highlight)) + tr td:first-child:has(.p-highlight) .p-highlight {
      background: var(--clr-primary);
      color: white;
    }
    .het-calendar-ddl.range-calender tr:not(:has(td:last-child .p-highlight)) + tr td:not(:has(+ td .p-highlight)):first-child:has(.p-highlight)::before,
    .het-calendar-ddl.range-calender tr:not(:has(td:last-child .p-highlight)) + tr td:not(:has(+ td .p-highlight)):first-child:has(.p-highlight)::after {
      content: none;
    }
    .het-calendar-ddl.range-calender tr:has(+ tr td:first-child .p-highlight) td:last-child:has(.p-highlight)::before {
      content: "";
    }
    .het-calendar-ddl.range-calender tr:has(td:nth-last-child(2) .p-highlight):has(+ tr td:first-child .p-highlight) td:last-child .p-highlight {
      background: transparent;
      color: inherit;
    }
    .p-inputgroup .het-form-control:first-child {
      --form-control-min-width: 194px;
    }
    [dir=rtl] .p-inputgroup .het-form-control:first-child {
      --form-control-border-radius: 0 6px 6px 0;
    }
    [dir=ltr] .p-inputgroup .het-form-control:first-child {
      --form-control-border-radius: 6px 0 0 6px;
    }
    .p-inputgroup .het-form-control:first-child.het-form-control-sm {
      --form-control-min-height: 44px;
    }
    .p-inputgroup .het-form-control:first-child.het-form-control-xs {
      --form-control-min-height: 40px;
    }
    .p-inputgroup .het-form-control:first-child + .het-btn {
      --pbtn-padding-inline: 10px;
      --pbtn-padding-block: var(--pbtn-padding-inline);
      --pbtn-fs: 14px;
      --pbtn-fw: 500;
    }
    [dir=ltr] .p-inputgroup .het-form-control:first-child + .het-btn {
      --pbtn-border-radius: 0 6px 6px 0;
    }
    [dir=rtl] .p-inputgroup .het-form-control:first-child + .het-btn {
      --pbtn-border-radius: 6px 0 0 6px;
    }
    .p-inputgroup .het-form-control:first-child + .het-btn.btn-sm {
      --pbtn-height: 44px;
    }
    [dir=ltr] .p-inputgroup .het-form-control:first-child + .het-btn.btn-sm > .p-button {
      --pbtn-border-radius: 0 6px 6px 0;
    }
    [dir=rtl] .p-inputgroup .het-form-control:first-child + .het-btn.btn-sm > .p-button {
      --pbtn-border-radius: 6px 0 0 6px;
    }
    body:has(> .input-ddl) .p-inputgroup .het-form-control:first-child + .het-btn.input-ddl-btn[aria-expanded=true] .svg-icon {
      transform: rotate(180deg);
      transition: all 0.2s ease-in-out;
    }
    .p-inputgroup .het-form-control:first-child + .het-btn.input-ddl-btn .svg-icon {
      transition: all 0.2s ease-in-out;
    }
    .p-inputgroup.mobile-form > input.het-form-control {
      direction: ltr;
      --form-control-border-width: 1px 1px 1px 0;
      --form-control-border-radius: 0 6px 6px 0;
    }
    [dir=ltr] .p-inputgroup.mobile-form > input.het-form-control {
      --form-control-border-radius: 0 6px 6px 0;
      order: 2;
    }
    .p-inputgroup.mobile-form > input.het-form-control:focus + .het-select,
    .p-inputgroup.mobile-form > input.het-form-control:hover + .het-select {
      --pselect-border-clr: var(--clr-primary);
    }
    .p-inputgroup.mobile-form .het-select {
      direction: ltr;
      max-width: 110px;
      --pselect-min-width: 110px;
      --pselect-px: 16px 0;
      --pselect-border-radius: 6px 0 0 6px;
    }
    [dir=rtl] .p-inputgroup.mobile-form .het-select {
      --pselect-border-width: 1px 0 1px 1px;
    }
    [dir=ltr] .p-inputgroup.mobile-form .het-select {
      --pselect-border-width: 1px 0 1px 1px;
      order: 1;
    }
    .p-inputgroup.mobile-form:has(> .het-select.p-focus) > input {
      --form-control-border-clr: var(--clr-primary) ;
    }
    .het-select {
      --pselect-width: 100%;
      --pselect-height: auto;
      --pselect-min-width: 150px;
      --pselect-min-height: 44px;
      --pselect-lh: 30px;
      --pselect-py: 5px;
      --pselect-px: 16px;
      --pselect-border-clr: #ced4da;
      --pselect-border-width: 1px;
      --pselect-border-radius: 8px;
      --pselect-bg: white;
      --pselect-clr: #495057;
      --pselect-fs: 14px;
      --pselect-fw: 400;
      --pselect-boxshadow: none;
      --pselect-transition: all 0.2s;
      --pselect-hover-border-clr: var(--clr-primary);
      --pselect-focus-boxshadow: none;
      --pselect-focus-border-clr: var(--clr-primary);
      --pselect-disabled-clr: #CED7E3;
      --pselect-disabled-bg: #FCFCFD;
      --pselect-disabled-border-clr: #CED7E3;
      --pselect-invalid-border-clr: var(--clr-danger);
      --pselect-label-py: 0;
      --pselect-label-px: 0;
      --pselect-label-minheight: 18px;
      --pselect-label-fs: 14px;
      --pselect-label-fw: 400;
      --pselect-label-lh: 30px;
      --pselect-label-clr: #6c757d;
      --pselect-placeholder-minheight: 18px;
      --pselect-placeholder-fs: 14px;
      --pselect-placeholder-fw: 400;
      --pselect-placeholder-clr: #6c757d;
      --pselect-arrow-margin-istart: 8px;
      --pselect-arrow-bg: transparent;
      --pselect-arrow-clr: #6c757d;
      --pselect-arrow-width: 20px;
      --pselect-arrow-border-radius: 0;
      --pselect-arrow-icon-width: 12px;
    }
    [ng-reflect-readonly=true] > .het-select {
      --pselect-focus-boxshadow: none;
      --pselect-clr: #CED7E3;
      --pselect-bg: #FCFCFD;
      --pselect-border-clr: #CED7E3;
      cursor: default;
      pointer-events: none;
      opacity: 0.6;
    }
    .het-select .p-select-clear-icon {
      position: absolute;
      inset-block: 0;
      margin-block: auto;
    }
    .het-select .p-select-clear-icon svg {
      width: 13px;
    }
    .het-select-ddl {
      --pselect-ddl-my: 8px 0;
      --pselect-ddl-mx: 0;
      --pselect-ddl-bg: white;
      --pselect-ddl-clr: #5C5B5E;
      --pselect-ddl-border-clr: transparent;
      --pselect-ddl-border-width: 0;
      --pselect-ddl-border-radius: 6px;
      --pselect-ddl-boxshadow: 0px 10px 10px -5px #0000000A, 0px 20px 25px -5px #0000001A;
      --pselect-ddl-container-py: 8px;
      --pselect-ddl-container-px: 8px;
      --pselect-ddl-container-gap: 8px;
      --pselect-ddl-item-my: 0;
      --pselect-ddl-item-mx: 0;
      --pselect-ddl-item-py: 11px;
      --pselect-ddl-item-px: 12px;
      --pselect-ddl-item-border-clr: transparent;
      --pselect-ddl-item-border-width: 0;
      --pselect-ddl-item-border-radius: 4px;
      --pselect-ddl-item-clr: #5C5B5E;
      --pselect-ddl-item-bg: transparent;
      --pselect-ddl-item-fs: 14px;
      --pselect-ddl-item-fw: 400;
      --pselect-ddl-item-lh: 22px;
      --pselect-ddl-item-focus-clr: #5C5B5E;
      --pselect-ddl-item-focus-bg: #dee2e6;
      --pselect-ddl-item-hover-clr: #5C5B5E;
      --pselect-ddl-item-hover-bg: #e9ecef;
      --pselect-ddl-item-selected-clr: #5C5B5E;
      --pselect-ddl-item-selected-fs: 14px;
      --pselect-ddl-item-selected-fw: 400;
      --pselect-ddl-item-selected-lh: 22px;
      --pselect-ddl-item-selected-bg: #e9ecef;
      --pselect-ddl-item-selected-focus-bg: lightgray;
      --pselect-ddl-item-selected-focus-clr: #5C5B5E;
    }
    .het-multiselect {
      --multiselect-width: 100%;
      --multiselect-bg: white;
      --multiselect-border-clr: #ced4da;
      --multiselect-border-width: 1px;
      --multiselect-border-radius: 8px;
      --multiselect-shadowbox: none;
      --multiselect-label-minheight: 42px;
      --multiselect-label-py: 6px;
      --multiselect-label-px: 16px;
      --multiselect-label-clr: #424B59;
      --multiselect-label-fs: 14px;
      --multiselect-label-fw: 400;
      --multiselect-label-lh: 17px;
      --multiselect-label-placeholder-clr: #6c757d;
      --multiselect-label-placeholder-fs: 14px;
      --multiselect-label-placeholder-fw: 400;
      --multiselect-label-placeholder-lh: 29px;
      --multiselect-chip-list-gap: 0.5rem;
      --multiselect-chip-margin-ie: 8px;
      --multiselect-chip-gap: 8px;
      --multiselect-chip-py: 5px;
      --multiselect-chip-px: 12px;
      --multiselect-chip-bg: white;
      --multiselect-chip-clr: #424B59;
      --multiselect-chip-fs: 12px;
      --multiselect-chip-fw: 500;
      --multiselect-chip-lh: 18px;
      --multiselect-chip-border-clr: #CED7E3;
      --multiselect-chip-border-width: 1px;
      --multiselect-chip-border-radius: 8px;
      --multiselect-chip-icon-bg: #F8FAFC;
      --multiselect-chip-icon-clr: rgb(206 215 227);
      --multiselect-chip-icon-border-radius: 100%;
      --multiselect-chip-icon-width: 16px;
      --multiselect-chip-icon-height: 16px;
      --multiselect-trigger-bg: transparent;
      --multiselect-trigger-clr: #6E7C91;
      --multiselect-trigger-width: 40px;
      --multiselect-trigger-border-radius-ss: 0px;
      --multiselect-trigger-border-radius-se: 8px;
      --multiselect-trigger-border-radius-es: 0px;
      --multiselect-trigger-border-radius-ee: 8px;
      --multiselect-trigger-icon-width: 12px;
      --multiselect-trigger-icon-clr: #CED7E3;
      --multiselect-clear-label-wrapper-pinline-end: 25px;
      --multiselect-clear-icon-width: 12px;
      --multiselect-clear-icon-clr: #6E7C91;
      --multiselect-clear-icon-inset-ie: 55px;
      --multiselect-focus-border-clr: #1495FF;
      --multiselect-focus-boxshadow: 0 0 0 2px #E0F1FF;
      --multiselect-hover-border-clr: var(--clr-primary);
      --multiselect-invalid-border-clr: var(--clr-danger);
    }
    .het-multiselect .p-chip.p-multiselect-chip {
      --chip-gap: 8px;
      --chip-py: 3px;
      --chip-px: 6px 8px;
      --chip-clr: #4C515B;
      --chip-bg: #F0F1F2;
      --chip-border-width: 1px;
      --chip-border-clr: transparent;
      --chip-border-radius: 40vw;
      --chip-fs: 14px;
      --chip-fw: 400;
      --chip-lh: 17px;
      --chip-text-my: 0;
      --chip-text-mx: 0;
      --chip-icon-py: 0;
      --chip-icon-px: 0;
      --chip-icon-my: 0;
      --chip-icon-mx: 0;
      --chip-icon-width: 16px;
      --chip-icon-height: 16px;
      --chip-icon-clr: #898E99;
      --chip-icon-bg: #e2e7ed;
      --chip-icon-border-width: 1px;
      --chip-icon-border-clr: transparent;
      --chip-icon-border-radius: 100%;
      --chip-icon-hover-clr: #495057;
      --chip-icon-hover-bg: #e2e7ed;
      --chip-icon-hover-border-clr: transparent;
      --chip-icon-hover-border-radius: 6px;
      --chip-icon-focus-boxshadow: 0 0 0 0.2rem #BFDBFE;
    }
    .het-multiselect.multi-no-overflow {
      height: auto;
    }
    .het-multiselect.multi-no-overflow .p-multiselect-label {
      overflow: auto;
      text-overflow: unset;
      white-space: normal;
    }
    .het-multiselect.multi-no-overflow .p-multiselect-label .p-multiselect-token {
      margin-block: 1px;
    }
    .het-multiselect-ddl {
      --multiselect-ddl-my: 8px 0;
      --multiselect-ddl-bg: white;
      --multiselect-ddl-clr: #4C515B;
      --multiselect-ddl-border-clr: transparent;
      --multiselect-ddl-border-width: 0px;
      --multiselect-ddl-border-radius: 6px;
      --multiselect-ddl-boxshadow: 0px 10px 10px -5px #0000000A, 0px 20px 25px -5px #0000001A;
      --multiselect-ddl-item-gap: 0.5rem;
      --multiselect-ddl-items-container-py: 8px;
      --multiselect-ddl-items-container-px: 8px;
      --multiselect-ddl-item-my: 0;
      --multiselect-ddl-item-py: 11px;
      --multiselect-ddl-item-px: 12px;
      --multiselect-ddl-item-border-clr: transparent;
      --multiselect-ddl-item-border-width: 1px;
      --multiselect-ddl-item-fs: 14px;
      --multiselect-ddl-item-fw: 400;
      --multiselect-ddl-item-lh: 22px;
      --multiselect-ddl-item-clr: #4C515B;
      --multiselect-ddl-item-bg: transparent;
      --multiselect-ddl-item-border-radius: 4px;
      --multiselect-ddl-item-selected-clr: #495057;
      --multiselect-ddl-item-selected-bg: #e9ecef;
      --multiselect-ddl-item-highlight-clr: #5C5B5E;
      --multiselect-ddl-item-highlight-bg: #e9ecef;
      --multiselect-ddl-item-highlight-focus-bg: #e9ecef;
      --multiselect-ddl-item-focus-clr: #5C5B5E;
      --multiselect-ddl-item-focus-bg: #e9ecef;
      --multiselect-ddl-item-hover-clr: #5C5B5E;
      --multiselect-ddl-item-hover-bg: #e9ecef;
      --multiselect-ddl-item-checkicon-clr: var(--clr-dark-primary);
      --multiselect-ddl-item-checkicon-width: 12px;
      --multiselect-ddl-item-empty-py: 11px;
      --multiselect-ddl-item-empty-px: 12px;
      --multiselect-ddl-item-empty-clr: #5C5B5E;
      --multiselect-ddl-item-empty-bg: transparent;
      --pcheckbox-box-bg: transparent;
      --pcheckbox-box-border-clr: transparent;
      --pcheckbox-box-hover-border-clr: transparent;
      --pcheckbox-box-checked-border-clr: transparent;
      --pcheckbox-box-checked-bg: transparent;
      --pcheckbox-box-checked-icon-clr: var(--clr-dark-primary);
    }
    .het-ddl {
      --pmenu-minwidth: 224px;
      --pmenu-my: 8px 0;
      --pmenu-color: #4C515B;
      --pmenu-background: white;
      --pmenu-border-width: 1px;
      --pmenu-border-style: solid;
      --pmenu-border-clr: transparent;
      --pmenu-list-flexDirection: column;
      --pmenu-list-py: 1rem;
      --pmenu-list-px: 1rem;
      --pmenu-list-gap: 10px;
      --pmenu-content-transtionDuration: 0;
      --pmenu-content-py: 0.5rem;
      --pmenu-content-px: 12px;
      --pmenu-content-border-radius: 6px;
      --pmenu-content-clr: #4C515B;
      --pmenu-content-bg: transparent;
      --pmenu-link-gap: 0.5rem;
      --pmenu-link-icon-width: auto;
      --pmenu-link-icon-height: 1rem;
      --pmenu-link-icon-clr: inherit;
      --pmenu-content-hover-clr: #4C515B;
      --pmenu-content-hover-bg: #E9EBF280;
      --pmenu-separator-border-clr: #F0F1F2;
      --pmenu-separator-px: 0;
    }
    .het-ddl .p-menu-submenu-label {
      display: none;
    }
    .het-treeselect {
      --ptreeselect-minwidth: 100%;
      --ptreeselect-py: 6px;
      --ptreeselect-px: 16px;
      --ptreeselect-border-width: 1px;
      --ptreeselect-border-clr: #cbd5e1;
      --ptreeselect-opened-border-clr: var(--clr-primary);
      --ptreeselect-label-fs: 16px;
      --ptreeselect-label-fw: 400;
      --ptreeselect-label-clr: #4C515B;
      --ptreeselect-label-lh: 30px;
      --ptreeselect-icon-width: auto;
      --ptreeselect-icon-clr: #6B7280;
      --ptreeselect-ddl-bg: white;
      --ptreeselect-ddl-clr: #4C515B;
      --ptreeselect-ddl-border-clr: transparent;
      --ptreeselect-ddl-border-radius: 0.5rem;
      --ptreeselect-ddl-shadow: 0px 10px 10px -5px rgba(0, 0, 0, 0.0392156863), 0px 20px 25px -5px rgba(0, 0, 0, 0.1019607843);
    }
    .het-treeselect .p-tree-root-children {
      padding: 24px;
      box-shadow: 0px 10px 10px -5px rgba(0, 0, 0, 0.0392156863), 0px 20px 25px -5px rgba(0, 0, 0, 0.1019607843);
      gap: 24px;
    }
    .het-treeselect .p-tree-root-children p-tree-node[ng-reflect-last-child=false] .p-tree-node:not(.p-tree-node-leaf) {
      margin-bottom: 24px;
    }
    .het-treeselect .p-tree-root-children .p-tree-node .p-tree-node-toggle-button {
      width: 20px;
      height: 20px;
    }
    .het-treeselect .p-tree-root-children .p-tree-node .p-tree-node-toggle-button .p-iconwrapper {
      width: 12px;
      height: 12px;
    }
    [dir=rtl] .het-treeselect .p-tree-root-children .p-tree-node:not([aria-expanded=true]) .p-tree-node-toggle-button .p-iconwrapper {
      rotate: 180deg;
    }
    .het-treeselect .p-tree-root-children .p-tree-node .p-tree-node-label {
      font-size: 14px;
      font-weight: 400;
      line-height: 24px;
      color: #4C515B;
    }
    .het-treeselect .p-tree-root-children .p-tree-node.p-tree-node-leaf {
      padding-inline-start: 16px;
      position: relative;
    }
    .het-treeselect .p-tree-root-children .p-tree-node.p-tree-node-leaf:has(.p-tree-node-content.p-tree-node-selectable:not(.p-tree-node-selected):hover):before {
      background-color: var(--clr-primary);
    }
    .het-treeselect .p-tree-root-children .p-tree-node.p-tree-node-leaf .p-tree-node-content.p-tree-node-selectable:not(.p-tree-node-selected):hover {
      background: transparent;
    }
    .het-treeselect .p-tree-root-children .p-tree-node.p-tree-node-leaf .p-tree-node-content.p-tree-node-selectable:not(.p-tree-node-selected):hover .p-tree-node-label {
      color: var(--clr-primary);
    }
    .het-treeselect .p-tree-root-children .p-tree-node.p-tree-node-leaf::before {
      content: "";
      position: absolute;
      inset-block: 0;
      margin-block: auto;
      inset-inline-start: 30px;
      width: 6px;
      height: 6px;
      border-radius: 100%;
      background: #D1D3D8;
    }
    .het-treeselect .p-tree-root-children .p-tree-node > .p-tree-node-children {
      margin-top: 24px;
      gap: 16px;
    }
    .het-treeselect .p-tree-root-children .p-tree-node .p-tree-node-content.p-tree-node-selected {
      background: var(--clr-light-primary);
      color: var(--clr-primary);
    }
    .het-treeselect .p-tree-node-content.p-tree-node-selectable:not(.p-tree-node-selected):hover {
      background: transparent;
    }
    .het-modal {
      --modal-border-radius: 12px;
      --modal-boxshadow: none;
      --modal-border-width: 0;
      --modal-border-clr: transparent;
      --modal-header-border-bottom-width: 0;
      --modal-header-border-bottom-clr: transparent;
      --modal-header-bg: white;
      --modal-header-clr: #2D3036;
      --modal-header-py: 24px 16px;
      --modal-header-px: 24px;
      --modal-header-title-fs: 20px;
      --modal-header-title-fw: 700;
      --modal-header-close-width: 24px;
      --modal-header-close-height: 24px;
      --modal-header-close-clr: #2B374D;
      --modal-header-close-border-width: 0;
      --modal-header-close-border-clr: transparent;
      --modal-header-close-bg: #F5FAFF;
      --modal-header-close-border-radius: 100%;
      --modal-header-close-transition:
        background-color 0.2s,
        color 0.2s,
        box-shadow 0.2s;
      --modal-header-close-my: 0;
      --modal-header-close-mx: 0 8px;
      --modal-header-close-hover-clr: #343a40;
      --modal-header-close-hover-bg: #e9ecef;
      --modal-header-close-hover-border-clr: transparent;
      --modal-header-close-focus-boxshadow: 0 0 0 0.2rem #BFDBFE;
      --modal-content-py: 0;
      --modal-content-px: 24px;
      --modal-content-bg: white;
      --modal-content-clr: #6E7C91;
      --modal-footer-bg: white;
      --modal-footer-clr: #495057;
      --modal-footer-py: 16px 24px;
      --modal-footer-px: 24px;
      --modal-footer-text-align: center;
      --modal-footer-gap: 16px;
    }
    .het-modal.modal-reason {
      --modal-border-radius: 8px;
      --modal-boxshadow: 0px 10px 10px -5px #0000000A, 0px 20px 25px -5px #0000001A;
      --modal-header-py: 16px;
      --modal-header-px: 16px;
      --modal-content-py: 0 16px;
      --modal-content-px: 16px;
    }
    .het-modal.modal-reason .p-dialog-header .p-dialog-header-actions p-button {
      --pbtn-padding-block: 4px;
      --pbtn-padding-inline: 4px;
      --pbtn-minwidth: 20px;
      --pbtn-minheight: 20px;
      --pbtn-clr: #9CA1AA;
      --pbtn-bg: transparent;
      --pbtn-border-width: 1px;
      --pbtn-border-clr: #9CA1AA;
      --pbtn-border-radius: 50%;
    }
    .het-modal.modal-reason .p-dialog-header .p-dialog-header-actions p-button timesicon path {
      fill: var(--pbtn-clr);
    }
    .het-modal .nafaz-otp-wrapper {
      display: grid;
      place-content: center;
      text-align: center;
      gap: 24px;
      margin-bottom: 24px;
    }
    .het-modal .nafaz-otp-wrapper > p {
      font-weight: 400;
      font-size: 14px;
      line-height: 20px;
      color: #4C515B;
    }
    .het-modal .nafaz-otp-wrapper > .nafaz-number {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 48px;
      height: 48px;
      background: #F7F7F8;
      border-radius: 100%;
      margin-inline: auto;
      font-weight: 500;
      font-size: 18px;
      line-height: 20px;
      color: #4C515B;
    }
    .het-modal .p-dialog-subtitle {
      font-weight: 400;
      font-size: 16px;
      line-height: 24px;
    }
    .het-modal.modal-md {
      width: 456px;
    }
    .het-modal.modal-lg {
      width: 781px;
    }
    @media screen and (max-width: 768px) {
      .het-modal.modal-lg {
        width: 90%;
      }
    }
    .het-modal .form-group {
      margin-bottom: 16px;
    }
    .het-modal .p-dialog-footer > * {
      flex: 1;
      --pbtn-width: 100%;
      min-width: max-content;
    }
    .het-modal .p-dialog-footer > app-button {
      display: flex;
    }
    .het-modal .p-dialog-footer > app-button > * {
      flex: 1;
      --pbtn-width: 100%;
      min-width: max-content;
    }
    .het-modal.no-close-btn .p-dialog-header .p-dialog-header-actions {
      opacity: 0;
      pointer-events: none;
    }
    .het-modal.modal-done {
      text-align: center;
    }
    .het-modal.modal-done .content-icon {
      display: flex;
      align-items: center;
      justify-content: center;
      margin-bottom: 25px;
    }
    .het-modal.modal-done .content-icon svg {
      height: 100px;
      width: auto;
      color: #0077D9;
    }
    .het-modal.modal-done .content-wrapper h3 {
      font-size: 29px;
      font-weight: 700;
      color: #424B59;
      line-height: 42px;
      margin-bottom: 10px;
    }
    .het-modal.modal-done .content-wrapper p {
      font-size: 18px;
      font-weight: 700;
      line-height: 25px;
      color: #6E7C91;
      margin-bottom: 50px;
    }
    .het-modal.modal-confirm {
      --modal-header-py: 32px 0;
      --modal-content-px: 32px;
      --modal-footer-px: 32px;
      --modal-footer-py: 32px;
      --modal-footer-gap: 16px;
    }
    .het-modal.modal-confirm .p-dialog-header .p-dialog-header-actions {
      display: none;
    }
    .het-modal.modal-confirm .confirm-icon-wrapper {
      width: 66px;
      height: 66px;
      border-radius: 100%;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      margin-bottom: 19px;
    }
    .het-modal.modal-confirm .confirm-icon-wrapper .svg-icon svg {
      width: auto;
      height: 30px;
    }
    .het-modal.modal-confirm .p-dialog-content {
      text-align: center;
      overflow-y: initial;
    }
    .het-modal.modal-confirm .p-dialog-content h3 {
      font-weight: 700;
      font-size: 20px;
      line-height: 24px;
      color: #2D3036;
      margin-bottom: 12px;
    }
    .het-modal.modal-confirm .p-dialog-content p {
      font-weight: 400;
      font-size: 16px;
      line-height: 22px;
      color: #6B7280;
    }
    .het-modal.modal-confirm .p-dialog-content p:not(:last-child) {
      margin-bottom: 8px;
    }
    .het-modal.modal-confirm .het-btn:enabled:focus,
    .het-modal.modal-confirm .het-btn > .p-button:enabled:focus {
      opacity: 1;
    }
    .het-modal.modal-confirm.confirm-danger .confirm-icon-wrapper {
      background: rgba(240, 68, 56, 0.3019607843);
      color: #F04438;
    }
    .het-modal.modal-confirm.confirm-danger .confirm-content {
      color: #F04438;
    }
    .het-modal.modal-confirm.confirm-danger .confirm-btn {
      --pbtn-bg: #FEE4E2;
      --pbtn-clr: #F04438;
    }
    .het-modal.modal-confirm.confirm-success .confirm-icon-wrapper {
      background: rgba(16, 185, 129, 0.3019607843);
      color: var(--clr-success);
    }
    .het-modal.modal-confirm.confirm-success .confirm-content {
      color: var(--clr-success);
    }
    .het-modal.modal-confirm.confirm-success .confirm-btn {
      --pbtn-bg: #10b9814d;
      --pbtn-clr: var(--clr-success);
    }
    .het-modal.modal-confirm.confirm-warning .p-dialog-header > .svg-icon {
      color: #FFF7E6;
    }
    .het-modal.modal-confirm.confirm-warning .confirm-icon-wrapper {
      background: #FFFCF5;
      color: #FDB022;
    }
    .het-modal.modal-confirm.confirm-warning .confirm-content {
      color: #FDB022;
    }
    .het-modal.modal-confirm.confirm-warning .confirm-btn {
      --pbtn-clr: var(--clr-primary);
      --pbtn-bg: var(--clr-light-primary);
    }
    .het-modal.modal-confirm.confirm-info .p-dialog-header > .svg-icon {
      color: #E5F3FF;
    }
    .het-modal.modal-confirm.confirm-info .confirm-icon-wrapper {
      background: #F5FAFF;
      color: #1495FF;
    }
    .het-modal.modal-confirm.confirm-info .confirm-content {
      color: #1495FF;
    }
    .het-modal.modal-confirm.confirm-info .confirm-btn {
      --pbtn-bg: #E0F1FF;
      --pbtn-clr: var(--clr-primary);
    }
    .het-modal.modal-confirm.confirm-gray .p-dialog-header > .svg-icon {
      color: #F0F2F4;
    }
    .het-modal.modal-confirm.confirm-gray .confirm-icon-wrapper {
      background: #F8FAFC;
      color: #6E7C91;
    }
    .het-modal.modal-confirm.confirm-gray .confirm-content {
      color: #6E7C91;
    }
    .het-modal.modal-confirm.confirm-gray .confirm-btn {
      --pbtn-bg: #6E7C91;
      --pbtn-clr: white;
    }
    .het-modal.modal-confirm.confirm-grey .p-dialog-header > .svg-icon {
      color: #616874;
    }
    .het-modal.modal-confirm.confirm-grey .confirm-icon-wrapper {
      background: rgba(97, 104, 116, 0.3019607843);
      color: #616874;
    }
    .het-modal.modal-confirm.confirm-grey .confirm-content {
      color: #6E7C91;
    }
    .het-modal.modal-confirm.confirm-grey .confirm-btn {
      --pbtn-bg: #4C515B;
      --pbtn-clr: white;
    }
    .het-modal.modal-confirm.confirm-countdown {
      --modal-content-px: 16px;
    }
    .het-modal.modal-confirm.confirm-countdown .confirm-icon-wrapper {
      width: 48px;
      height: 48px;
      margin-bottom: 24px;
    }
    .het-modal.modal-confirm.confirm-countdown .confirm-icon-wrapper .svg-icon svg {
      width: 48px;
      height: 48px;
      color: #616874;
    }
    .het-modal.modal-confirm.confirm-countdown .p-dialog-content h3 {
      margin-bottom: 16px;
    }
    .het-modal.modal-confirm.confirm-countdown .p-dialog-content > p {
      font-size: 18px;
      font-weight: 400;
      color: #6B7280;
    }
    .het-modal.modal-confirm.confirm-countdown .p-dialog-content > p:not(.confirm-countdown) {
      margin-bottom: 32px;
    }
    .het-modal.modal-confirm.confirm-countdown .p-dialog-content .confirm-countdown {
      font-weight: 700;
      font-size: 24px;
      line-height: 1.2;
      color: var(--clr-danger);
    }
    .het-modal.modal-view {
      --modal-header-py: 24px 0;
    }
    .het-modal.modal-view .p-dialog-content {
      margin-top: -16px;
    }
    .het-modal.modal-subheader {
      --modal-header-py: 24px 2px;
    }
    .het-modal.modal-subheader .modal-subheader {
      margin-bottom: 10px;
      font-size: 14px;
      font-weight: 500;
      line-height: 19px;
      color: #4C515B;
    }
    .p-dialog-mask.p-component-overlay {
      --modal-overlay-bg: rgba(0, 0, 0, 0.4);
    }
    .p-overlaypanel {
      --dropdown-minwidth: 200px;
      --dropdown-py: 10px;
      --dropdown-px: 10px;
      --dropdown-bg: white;
      --dropdown-clr: #495057;
      --dropdown-border-width: 0;
      --dropdown-border-clr: transparent;
      --dropdown-border-radius: 8px;
      --dropdown-boxshadow: 0 2px 6px #B0C5E129, 0 4px 10px -40px #B0C5E140;
      --dropdown-content-px: 0px;
      --dropdown-content-py: 0px;
      --dropdown-close-top: 10px;
      --dropdown-close-inset-end: 10px;
      --dropdown-close-clr: #2B374D;
      --dropdown-close-bg: #F5FAFF;
      --dropdown-close-width: 24px;
      --dropdown-close-height: 24px;
      --dropdown-close-border-radius: 100%;
      --dropdown-close-transition:
        background-color 0.2s,
        color 0.2s,
        box-shadow 0.2s;
      --dropdown-close-icon-width: 10px;
      --dropdown-close-icon-height: 10px;
      --dropdown-arrow-border-clr: rgba(255, 255, 255, 0);
      --dropdown-arrow-border-bottom-clr: #f2f2f2;
      --dropdown-arrow-border-top-clr: #f2f2f2;
    }
    .p-overlaypanel.notification-ddl {
      --dropdown-py: 0px;
      --dropdown-px: 0px;
    }
    .p-overlaypanel.notification-ddl .notification-top {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
      flex-wrap: wrap;
      padding: 16px 24px;
      border-bottom: 1px solid #F8FAFC;
    }
    .p-overlaypanel.notification-ddl .notification-top h3 {
      font-size: 0.8875rem;
      font-weight: 500;
      color: #6E7C91;
      line-height: 21.33px;
    }
    .p-overlaypanel.notification-ddl .notification-list {
      margin-inline-end: 16px;
      margin-bottom: 16px;
    }
    .p-overlaypanel.notification-ddl .notification-list.scroll {
      --scroll-min-height: 250px;
      --scroll-padding-istart: 16px;
    }
    .p-overlaypanel.notification-ddl .notification-list li {
      padding-inline: 16px;
      padding-block: 16px 20px;
      display: flex;
      align-items: center;
      gap: 12px;
    }
    .p-overlaypanel.notification-ddl .notification-list li:not(:last-child) {
      border-bottom: 1px solid #F8FAFC;
    }
    .p-overlaypanel.notification-ddl .notification-list li.unread {
      position: relative;
    }
    .p-overlaypanel.notification-ddl .notification-list li.unread::before {
      content: "";
      position: absolute;
      width: 8px;
      height: 8px;
      background: var(--clr-primary);
      border-radius: 100%;
      inset-inline-end: 0;
      top: 16px;
    }
    .p-overlaypanel.notification-ddl .notification-list li.unread .list-content h4 {
      color: #424B59;
    }
    .p-overlaypanel.notification-ddl .notification-list li .list-icon {
      width: 48px;
      height: 48px;
      border-radius: 100%;
      display: flex;
      align-items: center;
      justify-content: center;
    }
    .p-overlaypanel.notification-ddl .notification-list li .list-icon svg {
      width: 20px;
      height: 20px;
    }
    .p-overlaypanel.notification-ddl .notification-list li .list-icon.list-primary {
      background: #F5FAFF;
      color: var(--clr-primary);
    }
    .p-overlaypanel.notification-ddl .notification-list li .list-icon.list-warning {
      background: #FFFCF5;
      color: var(--clr-warning);
    }
    .p-overlaypanel.notification-ddl .notification-list li .list-content {
      max-width: 300px;
    }
    .p-overlaypanel.notification-ddl .notification-list li .list-content h4 {
      font-size: 0.78875rem;
      font-weight: 500;
      line-height: 17.8px;
      color: #B5BCC4;
      margin-bottom: 4px;
    }
    .p-overlaypanel.notification-ddl .notification-list li .list-content p {
      font-size: 0.78875rem;
      font-weight: 400;
      line-height: 17.8px;
      color: #B5BCC4;
    }
    .p-overlaypanel.notification-ddl .notification-all {
      display: flex;
      align-items: center;
      justify-content: center;
      padding-bottom: 16px;
    }
    .p-overlaypanel.notification-ddl .het-btn {
      --pbtn-fs: 14.22px;
    }
    .p-overlaypanel.user-ddl {
      padding: 16px 0;
      max-width: 200px;
    }
    .p-overlaypanel.user-ddl .het-btn {
      width: 100%;
    }
    .p-overlaypanel.user-ddl .het-btn:hover .p-button {
      --pbtn-opacity: 1;
    }
    .p-overlaypanel.user-ddl .het-btn .p-button {
      --pbtn-clr: #6E7C91;
      --pbtn-padding-inline: 24px;
      --pbtn-align: start;
      --pbtn-justify-content: start;
      --pbtn-width: 100%;
      --pbtn-margin-block: 0 16px;
      --pbtn-fs: 12.62px;
    }
    .p-overlaypanel.user-ddl .het-btn .p-button:hover {
      --pbtn-opacity: 1;
      --pbtn-clr: var(--clr-primary);
    }
    .p-overlaypanel.user-ddl .het-btn.btn-logout .p-button {
      border-top: 1px solid #F8FAFC;
      --pbtn-padding-block: 16px 0;
      --pbtn-border-radius: 0;
    }
    .p-overlaypanel.input-ddl {
      --dropdown-py: 8px 4px;
      --dropdown-px: 0px;
      --dropdown-minwidth: 67px;
      --dropdown-clr: #6E7C91;
      margin-top: 4px;
    }
    .p-overlaypanel.input-ddl.content-lesson-ddl {
      max-width: 150px;
    }
    .p-overlaypanel.input-ddl.content-lesson-ddl .het-btn .p-button {
      --pbtn-align: start;
      --pbtn-justify-content: flex-start;
    }
    .p-overlaypanel.input-ddl.content-lesson-ddl .het-btn .p-button .svg-icon {
      margin-top: 5px;
    }
    .p-overlaypanel.input-ddl .het-btn {
      width: 100%;
    }
    .p-overlaypanel.input-ddl .het-btn:hover .p-button {
      --pbtn-opacity: 1;
    }
    .p-overlaypanel.input-ddl .het-btn .p-button {
      --pbtn-clr: #6E7C91;
      --pbtn-padding-inline: 8px;
      --pbtn-padding-block: 8px;
      --pbtn-align: center;
      --pbtn-justify-content: center;
      --pbtn-width: 100%;
      --pbtn-margin-block: 0 4px;
      --pbtn-fs: 12.62px;
      --pbtn-border-radius: center;
    }
    .p-overlaypanel.input-ddl .het-btn .p-button:hover {
      --pbtn-opacity: 1;
      --pbtn-clr: var(--clr-primary);
      --pbtn-bg: rgba(110, 124, 145, 0.10);
    }
    .p-overlaypanel.input-ddl .het-btn .p-button .svg-icon {
      transition: all 0.2s ease-in-out;
    }
    .p-overlaypanel.table-ddl {
      --dropdown-py: 16px;
      --dropdown-px: 12px;
      --dropdown-minwidth: 170px;
      --dropdown-clr: #6E7C91;
    }
    .p-overlaypanel.table-ddl .het-btn .p-button {
      --pbtn-fs: 12.62px;
      --pbtn-lineheight: 17.8px;
      --pbtn-clr: #6E7C91;
      --pbtn-border-radius: 0;
    }
    .p-overlaypanel.table-ddl .het-btn .p-button:hover {
      --pbtn-clr: var(--clr-primary);
    }
    .p-overlaypanel.table-ddl .het-btn .p-button .svg-icon svg {
      width: 15px;
    }
    .p-overlaypanel.table-ddl .list-action {
      display: flex;
      align-items: start;
      flex-direction: column;
      gap: 16px;
    }
    .p-overlaypanel.table-ddl .list-footer {
      padding-top: 16px;
      border-top: 1px solid #F8FAFC;
      margin-top: 16px;
    }
    .het-img-wrapper {
      --avatar-bg: #dee2e6;
      --avatar-border-radius: 100%;
      --avatar-lg-width: 44px;
      --avatar-lg-height: 44px;
      --avatar-lg-fs: 1.5rem;
      --avatar-lg-icon-fs: 1.5rem;
      --avatar-xl-width: 96px;
      --avatar-xl-height: 96px;
      --avatar-xl-fs: 2rem;
      --avatar-xl-icon-fs: 2rem;
      --avatar-group-border-width: 2px;
      --avatar-group-border-style: solid;
      --avatar-group-border-clr: white;
    }
    .het-table-wrapper {
      --table-bg: transparent;
      --table-border-spacing: 0;
      --table-border-width: 1px 1px 0 1px;
      --table-border-clr: transparent;
      --table-border-ss-radius: 0;
      --table-border-se-radius: 0;
      --table-border-es-radius: 0;
      --table-border-ee-radius: 0;
      --table-fw: 400;
      --table-mb: 0;
      --table-thead-th-padding-block: 20px;
      --table-thead-th-padding-inline: 24px 16px;
      --table-thead-th-fs: 14px;
      --table-thead-th-fw: 500;
      --table-thead-th-lh: 16px;
      --table-thead-th-texttransform: none;
      --table-thead-th-minheight: auto;
      --table-thead-th-clr: #101633;
      --table-thead-th-bg: #F8FAFC;
      --table-thead-th-border-clr: #E2E8F0;
      --table-thead-th-border-block-width: 0 1px;
      --table-thead-th-border-inline-width: 0;
      --table-thead-th-textalign: start;
      --table-tbody-tr-bg: white;
      --table-tbody-tr-clr: #101633;
      --table-tbody-td-textalign: start;
      --table-tbody-td-padding-block: 22px;
      --table-tbody-td-padding-inline: 24px;
      --table-tbody-td-fs: 14px;
      --table-tbody-td-fw: 400;
      --table-tbody-td-lh: 17px;
      --table-tbody-td-minheight: auto;
      --table-tbody-td-clr: #101633;
      --table-tbody-td-bg: inherit;
      --table-tbody-td-border-clr: #E9EBF2;
      --table-tbody-td-border-block-width: 0 1px;
      --table-tbody-td-border-inline-width: 0;
      --table-tbody-td-action-gap: 12px;
      --table-tbody-td-nodata-height: 350px;
      --table-tbody-td-nodata-bg: white;
      --table-tbody-td-nodata-clr: #6B7280;
      --table-tbody-td-nodata-fs: 16px;
      --table-tbody-td-nodata-fw: 400;
      --table-tbody-td-nodata-img-width: 100px;
      --table-tbody-td-nodata-img-my: 0 16px;
      --table-tbody-tr-focus-outline: 0.15rem solid #BFDBFE;
      --table-tbody-tr-highlight-bg: #EFF6FF;
      --table-tbody-tr-highlight-clr: var(--clr-primary);
      --table-tfoot-td-fs: 14px;
      --table-tfoot-td-fw: 700;
      --table-tfoot-td-lh: 1.4;
      --table-tfoot-td-minheight: auto;
      --table-tfoot-td-clr: #6E7C91;
      --table-tfoot-td-bg: transparent;
      --table-tfoot-td-border-clr: #CED7E3;
      --table-tfoot-td-border-block-width: 1px 0;
      --table-tfoot-td-border-inline-width: 0;
      --table-sort-icon-clr: #6E7C91;
      --table-sort-icon-mx: 10px 0;
      --table-sort-th-hover-bg: #E0F1FF;
      --table-sort-th-hover-clr: var(--clr-primary);
      --table-sort-icon-hover-clr: var(--clr-primary);
      --table-sort-th-highlight-bg: #E0F1FF;
      --table-sort-th-highlight-clr: var(--clr-primary);
      --table-sort-icon-highlight-clr: var(--clr-primary);
      --table-sort-th-highlight-hover-bg: #E0F1FF;
      --table-sort-th-highlight-hover-clr: var(--clr-primary);
      --table-sort-icon-highlight-hover-clr: var(--clr-primary);
    }
    .het-table-wrapper.table-draggable .p-datatable-thead > tr > th:first-child {
      width: 110px;
    }
    .het-table-wrapper.table-draggable .p-datatable-tbody > tr {
      cursor: grab;
    }
    .het-table-wrapper.table-salary-total .p-datatable-tbody tr:nth-last-child(2) td {
      border-width: 0 0 2px 0;
      border-color: #D1D3D8;
    }
    .het-table-wrapper.table-salary-total .p-datatable-tbody tr:last-child td {
      border-bottom: 0;
    }
    .het-table-wrapper.table-salary-total .p-datatable-tbody tr:last-child td:first-child {
      font-size: 16px;
      font-weight: 500;
    }
    .het-table-wrapper.table-modal {
      --table-tbody-td-padding-block: 8px;
      --table-mb: 24px;
    }
    .het-table-wrapper .p-datatable-table .p-datatable-thead > tr > th:not(.table-action) {
      min-width: 150px;
    }
    .het-table-menu {
      margin-inline-end: -10px;
      margin-top: 8px;
      min-width: 140px;
      padding-inline: 16px;
      padding-block: 16px;
      box-shadow: 0px 10px 10px -5px rgba(0, 0, 0, 0.0392156863), 0px 20px 25px -5px rgba(0, 0, 0, 0.1019607843);
      border: 0;
    }
    .het-table-menu::before {
      content: none;
    }
    .het-table-menu .table-menu-list li:not(:last-child) {
      margin-bottom: 12px;
    }
    .het-table-menu .table-menu-list li a {
      display: flex;
      align-items: center;
      gap: 8px;
      font-size: 16px;
      font-weight: 400;
      line-height: 24px;
      color: #3B3F46;
    }
    .het-table-menu .table-menu-list li a:hover {
      color: var(--clr-primary);
    }
    .het-pagination {
      --ppagination-gap: 0.5rem;
      --ppagination-bg: white;
      --ppagination-clr: #9CA1AA;
      --ppagination-border-clr: transparent;
      --ppagination-border-width: 0;
      --ppagination-my: 24px 0;
      --ppagination-py: 0.5rem;
      --ppagination-px: 1rem;
      --ppagination-border-radius: 0;
      --ppagination-controls-bg: var(--clr-primary);
      --ppagination-controls-border-clr: var(--clr-primary);
      --ppagination-controls-border-width: 1px;
      --ppagination-controls-clr: white;
      --ppagination-controls-minwidth: 32px;
      --ppagination-controls-height: 32px;
      --ppagination-controls-my: 0;
      --ppagination-controls-mx: 0;
      --ppagination-controls-border-radius: 4px;
      --ppagination-controls-hover-bg: var(--clr-primary);
      --ppagination-controls-hover-border-clr: var(--clr-primary);
      --ppagination-controls-hover-clr: white;
      --ppagination-page-disabled-bg: #F0F1F2;
      --ppagination-page-disabled-clr: #9CA1AA;
      --ppagination-page-disabled-border-clr: #F0F1F2;
      --ppagination-page-current-my: 0;
      --ppagination-page-current-mx: auto 16px;
      --ppagination-page-current-py: 0;
      --ppagination-page-current-px: 0;
      --ppagination-page-current-minwidth: 3rem;
      --ppagination-page-current-height: 32px;
      --ppagination-page-current-clr: #6E7C91;
      --ppagination-page-current-fs: 14px;
      --ppagination-page-current-fw: 400;
      --ppagination-page-current-lh: 1.2;
      --ppagination-page-current-bg: transparent;
      --ppagination-page-current-border-clr: transparent;
      --ppagination-page-current-border-width: 0;
      --ppagination-page-bg: transparent;
      --ppagination-page-border-clr: #D1D3D8;
      --ppagination-page-border-width: 1px;
      --ppagination-page-clr: #9CA1AA;
      --ppagination-page-fs: 14px;
      --ppagination-page-fw: 400;
      --ppagination-page-lh: 1.2;
      --ppagination-page-minwidth: 32px;
      --ppagination-page-height: 32px;
      --ppagination-page-my: 0;
      --ppagination-page-mx: 2px;
      --ppagination-page-border-radius: 4px;
      --ppagination-page-highlight-bg: var(--clr-primary);
      --ppagination-page-highlight-border-clr: var(--clr-primary);
      --ppagination-page-highlight-clr: white;
      --ppagination-page-hover-bg: var(--clr-primary);
      --ppagination-page-hover-border-clr: var(--clr-primary);
      --ppagination-page-hover-clr: white;
    }
    .het-pagination .p-select {
      --pselect-width: auto;
      --pselect-min-width: 50px;
      --pselect-arrow-width: 14px;
      --pselect-min-height: 32px;
      --pselect-label-lh: 21px;
      --pselect-px: 12px;
      --pselect-arrow-icon-width: 12px;
      --pselect-arrow-margin-istart: 8px;
      --pselect-focus-boxshadow: none;
      --pselect-hover-border-clr: var(--clr-primary);
      --pselect-focus-border-clr: var(--clr-primary);
    }
    .het-pagination .p-select-overlay {
      text-align: center;
      --pselect-ddl-my: 8px;
      --pselect-ddl-mx: 0;
      --pselect-ddl-bg: white;
      --pselect-ddl-clr: #5C5B5E;
      --pselect-ddl-border-clr: transparent;
      --pselect-ddl-border-width: 1px;
      --pselect-ddl-border-radius: 8px;
      --pselect-ddl-boxshadow: 0 2px 6px rgba(176, 197, 225, 0.16), 0 24px 72px -8px rgba(176, 197, 225, 0.16);
      --pselect-ddl-container-py: 8px;
      --pselect-ddl-container-px: 8px;
      --pselect-ddl-item-my: 0 8px;
      --pselect-ddl-item-mx: 0;
      --pselect-ddl-item-py: 11px;
      --pselect-ddl-item-px: 12px;
      --pselect-ddl-item-border-clr: transparent;
      --pselect-ddl-item-border-width: 0;
      --pselect-ddl-item-border-radius: 4px;
      --pselect-ddl-item-clr: #5C5B5E;
      --pselect-ddl-item-fs: 14.22px;
      --pselect-ddl-item-fw: 500;
      --pselect-ddl-item-lh: 21.33px;
      --pselect-ddl-item-bg: transparent;
      --pselect-ddl-item-selected-clr: #424B59;
      --pselect-ddl-item-selected-fs: 14.22px;
      --pselect-ddl-item-selected-fw: 500;
      --pselect-ddl-item-selected-lh: 21.33px;
      --pselect-ddl-item-selected-bg: #F5FAFF;
      --pselect-ddl-item-selected-focus-bg: #F5FAFF;
      --pselect-ddl-item-focus-clr: #424B59;
      --pselect-ddl-item-focus-bg: transparent;
      --pselect-ddl-item-hover-clr: #424B59;
      --pselect-ddl-item-hover-bg: transparent;
      --pselect-ddl-item-empty-py: 11px;
      --pselect-ddl-item-empty-px: 12px;
      --pselect-ddl-item-empty-clr: #424B59;
      --pselect-ddl-item-empty-bg: transparent;
    }
    .het-pagination .p-paginator-current {
      opacity: 0;
      z-index: -1;
    }
    .het-tree-wrapper .p-tree-root-children {
      gap: 22px;
    }
    .het-tree-wrapper .p-tree-root-children .p-tree-node:not([aria-expanded=true]) .p-tree-node-toggle-button {
      rotate: 90deg;
    }
    .het-tree-wrapper .p-tree-root-children .p-tree-node[aria-expanded=true] .p-tree-node-toggle-button {
      rotate: 180deg;
    }
    .het-tree-wrapper .p-tree-root-children .p-tree-node .p-tree-node-content {
      padding-inline: 16px;
      padding-block: 17px;
      background: #F8FAFC;
      border-width: 1px 0 1px;
      border-style: solid;
      border-color: #E2E8F0;
      border-radius: 0;
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #2D3036;
    }
    .het-tree-wrapper .p-tree-root-children .p-tree-node .p-tree-node-content .p-tree-node-label {
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #2D3036;
      margin-inline-start: 16px;
    }
    .het-tree-wrapper .p-tree-root-children .p-tree-node .p-tree-node-content .p-tree-node-label .het-tag {
      margin-inline-start: 8px;
      --ptag-py: 4px;
      --ptag-px: 8px;
      --ptag-fs: 12px;
      --ptag-fw: 400;
      --ptag-lh: 14px;
    }
    .het-tree-wrapper .p-tree-root-children .p-tree-node .p-tree-node-content > .p-tree-node-toggle-button {
      position: absolute;
      inset-inline-end: 40px;
    }
    .het-tree-wrapper .p-tree-root-children .p-tree-node .p-tree-node-children {
      flex-direction: row;
      gap: 0;
      flex-wrap: wrap;
      padding-inline: 0;
      padding-block: 8px 0;
    }
    .het-tree-wrapper .p-tree-root-children .p-tree-node .p-tree-node-children > * {
      width: 33.3333333333%;
    }
    .het-tree-wrapper .p-tree-root-children .p-tree-node .p-tree-node-children .p-tree-node {
      display: inline-flex;
    }
    .het-tree-wrapper .p-tree-root-children .p-tree-node .p-tree-node-children .p-tree-node .p-tree-node-content {
      background: transparent;
      border: 0;
    }
    .het-tree-wrapper .p-tree-root-children .p-tree-node .p-tree-node-children .p-tree-node .p-tree-node-content .p-tree-node-label {
      color: #2D3036;
      font-size: 16px;
      font-weight: 400;
      line-height: 1.2;
      margin-inline-start: 14px;
    }
    .het-tree-wrapper .p-tree-root-children .p-tree-node .p-tree-node-children p-treenode:has(.p-tree-node-children),
    .het-tree-wrapper .p-tree-root-children .p-tree-node .p-tree-node-children p-treenode:has(> [aria-expanded]) {
      width: 100%;
      padding-inline: 16px;
      border: 1px solid #E9EBF2;
      border-radius: 8px;
    }
    .het-tree-wrapper .p-tree-root-children .p-tree-node .p-tree-node-children p-treenode:has(.p-tree-node-children) > .p-tree-node,
    .het-tree-wrapper .p-tree-root-children .p-tree-node .p-tree-node-children p-treenode:has(> [aria-expanded]) > .p-tree-node {
      flex-direction: column;
      width: 100%;
    }
    .het-tree-wrapper .p-tree-root-children .p-tree-node .p-tree-node-children p-treenode:has(.p-tree-node-children) > .p-tree-node[aria-expanded=true] > .p-tree-node-content,
    .het-tree-wrapper .p-tree-root-children .p-tree-node .p-tree-node-children p-treenode:has(> [aria-expanded]) > .p-tree-node[aria-expanded=true] > .p-tree-node-content {
      border-bottom: 1px solid #E9EBF2;
    }
    .het-tree-wrapper .p-tree-root-children .p-tree-node .p-tree-node-children p-treenode:has(.p-tree-node-children) > .p-tree-node > .p-tree-node-content,
    .het-tree-wrapper .p-tree-root-children .p-tree-node .p-tree-node-children p-treenode:has(> [aria-expanded]) > .p-tree-node > .p-tree-node-content {
      padding-inline: 0;
    }
    .het-tree-wrapper .p-tree-root-children .p-tree-node .p-tree-node-children p-treenode:has(.p-tree-node-children) > .p-tree-node .p-tree-node-children > .p-tree-node-content,
    .het-tree-wrapper .p-tree-root-children .p-tree-node .p-tree-node-children p-treenode:has(> [aria-expanded]) > .p-tree-node .p-tree-node-children > .p-tree-node-content {
      padding-bottom: 8px;
    }
    .het-tree-wrapper .p-checkbox {
      --pcheckbox-gap: 0.5rem;
      --pcheckbox-box-width: 20px;
      --pcheckbox-box-height: 20px;
      --pcheckbox-box-clr: #495057;
      --pcheckbox-box-bg: white;
      --pcheckbox-box-border-clr: #ced4da;
      --pcheckbox-box-border-width: 1px;
      --pcheckbox-box-border-radius: 4px;
      --pcheckbox-box-boxshadow: none;
      --pcheckbox-box-icon-width: 14px;
      --pcheckbox-box-icon-height: 13px;
      --pcheckbox-box-icon-clr: #495057;
      --pcheckbox-box-icon-transition-duration: 0.2s;
      --pcheckbox-box-hover-border-clr: #263579;
      --pcheckbox-box-checked-border-clr: #263579;
      --pcheckbox-box-checked-bg: #263579;
      --pcheckbox-box-checked-icon-clr: white;
      --pcheckbox-cursor: pointer;
      --pcheckbox-label-clr: #6E7C91;
      --pcheckbox-label-fs: 16px;
      --pcheckbox-label-fw: 400;
      --pcheckbox-label-lh: 1.2;
    }
    .het-progressbar {
      --progressbar-minwidth: 204px;
      --progressbar-height: 1.5rem;
      --progressbar-bg: #dee2e6;
      --progressbar-border-clr: transparent;
      --progressbar-border-width: 0;
      --progressbar-border-radius: 6px;
      --progressbar-value-my: 0;
      --progressbar-value-mx: 0;
      --progressbar-value-bg: #3B82F6;
      --progressbar-value-border-clr: transparent;
      --progressbar-value-border-width: 0;
      --progressbar-value-border-radius: 0;
      --progressbar-label-display: none;
      --progressbar-label-bg: #3B82F6;
      --progressbar-label-clr: white;
      --progressbar-label-fs: 14px;
      --progressbar-label-fw: 400;
      --progressbar-label-lh: 1.5rem;
    }
    .het-progressbar.table-progressbar {
      --progressbar-minwidth: 204px;
      --progressbar-height: 8px;
      --progressbar-bg: #EEF2F6;
      --progressbar-border-radius: 40vw;
      --progressbar-value-bg: var(--clr-primary);
      --progressbar-value-border-radius: 40vw;
      --progressbar-label-display: none;
    }
    .het-progressbar.progressbar-dashboard {
      --progressbar-height: 8px;
      --progressbar-value-bg: var(--clr-primary);
      --progressbar-bg: #F0F1F2;
    }
    .p-toast {
      --toast-opacity: 1;
      --toast-msg-wrapper-my: 0 1rem;
      --toast-msg-wrapper-mx: 0;
      --toast-msg-wrapper-boxshadow: none;
      --toast-msg-wrapper-border-radius: 8px;
      --toast-msg-content-py: 12px;
      --toast-msg-content-px: 16px;
      --toast-msg-content-border-clr: transparent;
      --toast-msg-content-border-width: 0;
      --toast-msg-content-border-radius: 8px;
      --toast-msg-content-text-my: 0;
      --toast-msg-content-text-mx: 10px;
      --toast-msg-content-text-summary-fs: 12.62px;
      --toast-msg-content-text-summary-fw: 500;
      --toast-msg-content-text-summary-lh: 17.8px;
      --toast-msg-content-text-detail-my: 8px 0;
      --toast-msg-content-text-detail-mx: 0;
      --toast-msg-content-text-detail-fs: 12.62px;
      --toast-msg-content-text-detail-fw: 400;
      --toast-msg-content-text-detail-lh: 19.8px;
      --toast-msg-content-icon-width: 20px;
      --toast-msg-content-icon-height: 20px;
      --toast-msg-content-close-width: 20px;
      --toast-msg-content-close-height: 20px;
      --toast-msg-content-close-clr: inherit;
      --toast-msg-content-close-bg: transparent;
      --toast-msg-content-close-border-clr: transparent;
      --toast-msg-content-close-border-width: 0;
      --toast-msg-content-close-border-radius: 8px;
      --toast-msg-content-close-hover-bg: transparent;
      --toast-msg-content-close-focus-boxshadow: none;
    }
    .p-toast .p-toast-message.p-toast-message-info {
      --toast-msg-wrapper-clr: var(--clr-primary);
      --toast-msg-wrapper-bg: #F5FAFF;
      --toast-msg-wrapper-border-clr: var(--clr-primary);
      --toast-msg-wrapper-border-width: 0;
      --toast-msg-content-close-clr: #6E7C91;
      --toast-msg-content-icon-clr: var(--clr-primary);
    }
    .p-toast .p-toast-message.p-toast-message-success {
      --toast-msg-wrapper-clr: #17B26A;
      --toast-msg-wrapper-bg: #F6FEF9;
      --toast-msg-wrapper-border-clr: #17B26A;
      --toast-msg-wrapper-border-width: 0;
      --toast-msg-content-close-clr: #6E7C91;
      --toast-msg-content-icon-clr: #17B26A;
    }
    .p-toast .p-toast-message.p-toast-message-warn {
      --toast-msg-wrapper-clr: #F79009;
      --toast-msg-wrapper-bg: #FFFCF5;
      --toast-msg-wrapper-border-clr: #F79009;
      --toast-msg-wrapper-border-width: 0;
      --toast-msg-content-close-clr: #6E7C91;
      --toast-msg-content-icon-clr: #F79009;
    }
    .p-toast .p-toast-message.p-toast-message-error {
      --toast-msg-wrapper-clr: #F04438;
      --toast-msg-wrapper-bg: #FFFBFA;
      --toast-msg-wrapper-border-clr: #F04438;
      --toast-msg-wrapper-border-width: 0;
      --toast-msg-content-close-clr: #6E7C91;
      --toast-msg-content-icon-clr: #F04438;
    }
    .p-tooltip {
      --tooltip-bg: #2B374D;
      --tooltip-clr: white;
      --tooltip-fs: 12.62px;
      --tooltip-fw: 400;
      --tooltip-py: 8px;
      --tooltip-px: 12px;
      --tooltip-boxshadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
      --tooltip-border-radius: 8px;
      --tooltip-arrow-border-clr: #2B374D;
    }
    .p-tooltip.het-aside-tooltip {
      --tooltip-bg: white;
      --tooltip-clr: #2B374D;
      --tooltip-arrow-border-clr: white;
    }
    .het-tablist {
      margin-bottom: 24px;
      --ptablist-nav-px: 0;
      --ptablist-nav-gap: 0;
      --ptablist-nav-bg: transparent;
      --ptablist-nav-border-width: 0;
      --ptablist-nav-border-radius-ss: 0;
      --ptablist-nav-border-radius-se: 0;
      --ptablist-nav-link-py: 13px;
      --ptablist-nav-link-px: 12px;
      --ptablist-nav-link-border-width: 1px 1px 1px 1px;
      --ptablist-nav-link-border-clr: transparent;
      --ptablist-nav-link-bg: #F7F7F8;
      --ptablist-nav-link-clr: #4C515B;
      --ptablist-nav-link-border-radius-ss: 0;
      --ptablist-nav-link-border-radius-se: 0;
      --ptablist-nav-link-fs: 16px;
      --ptablist-nav-link-fw: 400;
      --ptablist-nav-link-lh: 22px;
      --ptablist-nav-link-hover-border-clr: #E9EBF2;
      --ptablist-nav-link-hover-clr: #4C515B;
      --ptablist-nav-link-hover-bg: white;
      --ptablist-nav-link-active-bg: white;
      --ptablist-nav-link-active-border-clr: #E9EBF2 #E9EBF2 transparent #E9EBF2;
      --ptablist-nav-link-active-clr: #4C515B;
      --ptablist-content-border-width: 1px;
      --ptablist-content-py: 25px;
      --ptablist-content-px: 25px;
      --ptablist-content-border-clr: #E9EBF2;
      --ptablist-content-border-radius-ss: 0;
      --ptablist-content-border-radius-se: 0.5rem;
      --ptablist-content-border-radius-es: 0.5rem;
      --ptablist-content-border-radius-ee: 0.5rem;
    }
    .het-tablist .p-tablist .p-tablist-viewport .p-tablist-tab-list {
      width: max-content;
    }
    .het-tablist .p-tablist .p-tablist-viewport .p-tablist-tab-list .p-tab:first-of-type {
      border-start-start-radius: 8px;
    }
    .het-tablist .p-tablist .p-tablist-viewport .p-tablist-tab-list .p-tab:last-of-type {
      border-start-end-radius: 8px;
    }
    .het-tablist .p-tablist .p-tablist-viewport .p-tablist-tab-list .p-tab .het-tag {
      margin-inline-start: 5px;
      --ptag-fs: 1rem;
      --ptag-fw: 400;
      --ptag-lh: 1rem;
      --ptag-border-radius: 0.25rem;
      --ptag-bg: #FFFFFF;
      --ptag-clr: #4C515B;
    }
    .het-tablist .p-tablist .p-tablist-viewport .p-tablist-tab-list .p-tab.p-tab-active .het-tag.p-tag-danger,
    .het-tablist .p-tablist .p-tablist-viewport .p-tablist-tab-list .p-tab:hover .het-tag.p-tag-danger {
      --ptag-bg: #FEE4E2;
      --ptag-clr: #F04438;
    }
    .het-tablist .p-tablist .p-tablist-viewport .p-tablist-tab-list .p-tab.p-tab-active .het-tag.p-tag-warning,
    .het-tablist .p-tablist .p-tablist-viewport .p-tablist-tab-list .p-tab:hover .het-tag.p-tag-warning {
      --ptag-bg: #FEF5E7;
      --ptag-clr: var(--clr-warning);
    }
    .het-tablist .p-tablist .p-tablist-viewport .p-tablist-tab-list .p-tab.p-tab-active .het-tag.p-tag-success,
    .het-tablist .p-tablist .p-tablist-viewport .p-tablist-tab-list .p-tab:hover .het-tag.p-tag-success {
      --ptag-bg: #E7F8F2;
      --ptag-clr: var(--clr-success);
    }
    .het-tablist .p-tablist .p-tablist-viewport .p-tablist-tab-list .p-tab.p-tab-active .het-tag.p-tag-dark-primary,
    .het-tablist .p-tablist .p-tablist-viewport .p-tablist-tab-list .p-tab:hover .het-tag.p-tag-dark-primary {
      --ptag-bg: #E9EBF2;
      --ptag-clr: var(--clr-dark-primary);
    }
    .het-tablist .p-tablist .p-tablist-viewport .p-tablist-tab-list .p-tab.p-tab-active .het-tag.p-tag-primary,
    .het-tablist .p-tablist .p-tablist-viewport .p-tablist-tab-list .p-tab:hover .het-tag.p-tag-primary {
      --ptag-bg: #ECF7FC;
      --ptag-clr: var(--clr-primary);
    }
    .het-tablist .p-tabpanels {
      margin-top: -1px;
    }
    .het-tablist.tablist-line {
      margin-bottom: 0;
      --ptablist-nav-px: 0;
      --ptablist-nav-bg: transparent;
      --ptablist-nav-border-width-all: 0px 0px 1px 0;
      --ptablist-nav-link-py: 2px 12px;
      --ptablist-content-border-width: 0;
      --ptablist-content-px: 0;
      --ptablist-content-py: 32px 0px;
    }
    @media screen and (max-width: 992px) {
      .het-tablist.tablist-line .p-tabview-nav-content {
        padding-inline: 35px;
      }
    }
    .het-tablist.tablist-details {
      margin-bottom: 0;
      --ptablist-nav-py: 10px;
      --ptablist-nav-px: 10px;
      --ptablist-nav-bg: #F7F7F8;
      --ptablist-nav-gap: 20px;
      --ptablist-nav-border-width: 0;
      --ptablist-nav-border-radius-ss: 12px;
      --ptablist-nav-border-radius-se: 12px;
      --ptablist-nav-border-radius-es: 12px;
      --ptablist-nav-border-radius-ee: 12px;
      --ptablist-nav-link-py: 12px;
      --ptablist-nav-link-px: 16px;
      --ptablist-nav-link-bg: transparent;
      --ptablist-nav-link-gap: 8px;
      --ptablist-nav-link-clr: #4C515B;
      --ptablist-nav-link-fs: 14px;
      --ptablist-nav-link-fw: 500;
      --ptablist-nav-link-lh: 18px;
      --ptablist-nav-link-border-width: 0;
      --ptablist-nav-link-border-radius-ss: 8px;
      --ptablist-nav-link-border-radius-se: 8px;
      --ptablist-nav-link-border-radius-es: 8px;
      --ptablist-nav-link-border-radius-ee: 8px;
      --ptablist-nav-link-hover-border-clr: #E9EBF2;
      --ptablist-nav-link-hover-clr: white;
      --ptablist-nav-link-hover-bg: #6E78A5;
      --ptablist-nav-link-active-bg: #263579;
      --ptablist-nav-link-active-clr: white;
      --ptablist-content-py: 24px 0;
      --ptablist-content-px: 0;
      --ptablist-content-border-width: 0;
    }
    .het-tablist.tablist-details.overflow-unset .p-tablist {
      overflow: unset;
    }
    .het-tablist.tablist-details.overflow-unset .p-tablist .p-tablist-prev-button {
      inset-inline-start: -40px;
      background-color: #F7F7F8;
    }
    .het-tablist.tablist-details.overflow-unset .p-tablist .p-tablist-next-button {
      inset-inline-end: -40px;
      background-color: #F7F7F8;
    }
    .het-tablist.tabs-solid {
      --ptablist-nav-px: 8px;
      --ptablist-nav-py: 8px;
      --ptablist-nav-bg: #F7F7F8;
      --ptablist-nav-link-py: 13px;
      --ptablist-nav-link-px: 12px;
      --ptablist-nav-link-clr: #6B7280;
      --ptablist-nav-link-border-width: 0;
      --ptablist-nav-link-bg: transparent;
      --ptablist-nav-border-radius-ss: 8px;
      --ptablist-nav-border-radius-se: 8px;
      --ptablist-nav-border-radius-es: 8px;
      --ptablist-nav-border-radius-ee: 8px;
      --ptablist-nav-gap: 16px;
      --ptablist-content-py: 12px 0;
      --ptablist-content-px: 0;
      --ptablist-content-border-width: 0;
      --ptablist-nav-link-fs: 16px;
      --ptablist-nav-link-fw: 400;
      --ptablist-nav-link-lh: 22px;
      --ptablist-nav-link-hover-border-clr: transparent;
      --ptablist-nav-link-hover-clr: white;
      --ptablist-nav-link-hover-bg: var(--clr-primary);
      --ptablist-nav-link-active-bg: var(--clr-primary);
      --ptablist-nav-link-active-clr: white;
      --ptablist-nav-link-border-radius-ss: 6px;
      --ptablist-nav-link-border-radius-se: 6px;
      --ptablist-nav-link-border-radius-es: 6px;
      --ptablist-nav-link-border-radius-ee: 6px;
      --ptablist-nav-link-gap: 8px;
    }
    .het-tablist.tabs-solid .p-tab {
      flex: 1;
      justify-content: center;
    }
    .het-tablist .p-tablist-nav-button {
      inset: unset;
      box-shadow: none;
      overflow: unset;
      background-color: #E9EBF2;
    }
    .het-tablist .p-tablist-prev-button {
      inset-inline-start: 0;
      border-start-start-radius: 10px;
      border-end-start-radius: 10px;
    }
    [dir=rtl] .het-tablist .p-tablist-prev-button {
      border-radius: unset;
      border-start-end-radius: 10px;
      border-end-end-radius: 10px;
      scale: -1;
    }
    .het-tablist .p-tablist-next-button {
      inset-inline-end: 0;
      border-start-end-radius: 10px;
      border-end-end-radius: 10px;
    }
    [dir=rtl] .het-tablist .p-tablist-next-button {
      border-radius: unset;
      border-start-start-radius: 10px;
      border-end-start-radius: 10px;
      scale: -1;
    }
    .het-tablist-btns {
      margin-bottom: 24px;
    }
    .het-tablist-btns .tablist-btns-list {
      display: flex;
      align-items: center;
      margin-bottom: -1px;
    }
    .het-tablist-btns .tablist-btns-list li {
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 12px 16px;
      background: #F7F7F8;
      border: 1px solid #D1D3D8;
      font-size: 1rem;
      font-weight: 400;
      line-height: 20px;
      color: #4C515B;
      height: 50px;
      cursor: pointer;
    }
    .het-tablist-btns .tablist-btns-list li.dot-new-records {
      position: relative;
    }
    .het-tablist-btns .tablist-btns-list li.dot-new-records:before {
      content: "";
      position: absolute;
      width: 8px;
      height: 8px;
      border-radius: 50%;
      background: var(--clr-success);
      inset-inline-end: 8px;
      top: 8px;
    }
    .het-tablist-btns .tablist-btns-list li:first-child {
      border-start-start-radius: 8px;
    }
    .het-tablist-btns .tablist-btns-list li:last-child {
      border-start-end-radius: 8px;
    }
    .het-tablist-btns .tablist-btns-list li + li {
      border-inline-start: 0;
    }
    .het-tablist-btns .tablist-btns-list li .het-tag {
      --ptag-fs: 1rem;
      --ptag-fw: 400;
      --ptag-lh: 1rem;
      --ptag-border-radius: 0.25rem;
      --ptag-bg: #FFFFFF;
      --ptag-clr: #4C515B;
    }
    .het-tablist-btns .tablist-btns-list li.tablist-active {
      border-bottom: 0;
    }
    .het-tablist-btns .tablist-btns-list li.tablist-active,
    .het-tablist-btns .tablist-btns-list li:hover {
      background: white;
      font-weight: 500;
    }
    .het-tablist-btns .tablist-btns-list li.tablist-active:has(.p-tag-danger),
    .het-tablist-btns .tablist-btns-list li:hover:has(.p-tag-danger) {
      color: #F04438;
    }
    .het-tablist-btns .tablist-btns-list li.tablist-active:has(.p-tag-warning),
    .het-tablist-btns .tablist-btns-list li:hover:has(.p-tag-warning) {
      color: var(--clr-warning);
    }
    .het-tablist-btns .tablist-btns-list li.tablist-active:has(.p-tag-success),
    .het-tablist-btns .tablist-btns-list li:hover:has(.p-tag-success) {
      color: var(--clr-success);
    }
    .het-tablist-btns .tablist-btns-list li.tablist-active:has(.p-tag-dark-primary),
    .het-tablist-btns .tablist-btns-list li:hover:has(.p-tag-dark-primary) {
      color: var(--clr-dark-primary);
    }
    .het-tablist-btns .tablist-btns-list li.tablist-active:has(.p-tag-primary),
    .het-tablist-btns .tablist-btns-list li:hover:has(.p-tag-primary) {
      color: var(--clr-primary);
    }
    .het-tablist-btns .tablist-btns-list li.tablist-active .p-tag-danger,
    .het-tablist-btns .tablist-btns-list li:hover .p-tag-danger {
      --ptag-bg: #FEE4E2;
      --ptag-clr: #F04438;
    }
    .het-tablist-btns .tablist-btns-list li.tablist-active .p-tag-warning,
    .het-tablist-btns .tablist-btns-list li:hover .p-tag-warning {
      --ptag-bg: #FEF5E7;
      --ptag-clr: var(--clr-warning);
    }
    .het-tablist-btns .tablist-btns-list li.tablist-active .p-tag-success,
    .het-tablist-btns .tablist-btns-list li:hover .p-tag-success {
      --ptag-bg: #E7F8F2;
      --ptag-clr: var(--clr-success);
    }
    .het-tablist-btns .tablist-btns-list li.tablist-active .p-tag-dark-primary,
    .het-tablist-btns .tablist-btns-list li:hover .p-tag-dark-primary {
      --ptag-bg: #E9EBF2;
      --ptag-clr: var(--clr-dark-primary);
    }
    .het-tablist-btns .tablist-btns-list li.tablist-active .p-tag-primary,
    .het-tablist-btns .tablist-btns-list li:hover .p-tag-primary {
      --ptag-bg: #ECF7FC;
      --ptag-clr: var(--clr-primary);
    }
    .het-tablist-btns .tablist-btns-content {
      padding: 25px;
      background: white;
      border: 1px solid #D1D3D8;
      border-radius: 8px;
      border-start-start-radius: 0;
    }
    .het-tablist-btns .tablist-btns-content .tablist-btns-tab:not(.tablist-content-active) {
      display: none;
    }
    .het-upload-img.p-fileupload {
      position: relative;
    }
    .het-upload-img.p-fileupload .p-fileupload-buttonbar {
      padding: 0;
      border: 0;
      background: none;
      color: transparent;
    }
    .het-upload-img.p-fileupload .p-fileupload-buttonbar > .p-fileupload-choose {
      background: #F8FAFC;
      border: 1px dashed #CED7E3;
      border-radius: 100%;
      width: 96px;
      aspect-ratio: 1;
      color: #6E7C91;
      flex-direction: column;
      justify-content: center;
      margin: 0;
    }
    .het-upload-img.p-fileupload .p-fileupload-buttonbar > .p-fileupload-choose:hover {
      border-color: var(--clr-primary);
    }
    .het-upload-img.p-fileupload .p-fileupload-buttonbar > .p-fileupload-choose > *:not(input) {
      flex-grow: 0;
    }
    .het-upload-img.p-fileupload .p-fileupload-buttonbar > .p-fileupload-choose .p-button-label {
      color: #424B59;
    }
    .het-upload-img.p-fileupload .p-fileupload-content {
      position: absolute;
      top: 0;
      inset-inline-start: 0;
    }
    .het-upload-img.p-fileupload .p-fileupload-content .p-fileupload-row .p-fileupload-filename {
      display: none;
    }
    .het-upload-img.p-fileupload .p-fileupload-content .p-fileupload-row .p-fileupload-filename + div:not(:last-child) {
      display: none;
    }
    .het-upload-img.p-fileupload .p-fileupload-content .p-fileupload-row > div {
      padding: 0;
    }
    .het-upload-img.p-fileupload .p-fileupload-content .p-fileupload-row > div:last-child:has(.p-button) {
      position: absolute;
      bottom: 0;
      inset-inline-start: 0;
    }
    .het-upload-img.p-fileupload .p-fileupload-content .p-fileupload-row > div:first-child:has(> img) {
      width: 100%;
      height: 100%;
      aspect-ratio: 1;
      border-radius: 100%;
      background: #F8FAFC;
    }
    .het-upload-img.p-fileupload .p-fileupload-content .p-fileupload-row > div > img {
      width: 100%;
      height: 100%;
      aspect-ratio: 1;
      object-fit: cover;
      border-radius: 100%;
    }
    .het-upload-img.p-fileupload .p-fileupload-content .p-progressbar {
      height: 0;
    }
    .het-upload-img.p-fileupload .btn-upload-cancel.het-btn {
      background: #FEE4E2;
      border: 0;
      border-radius: 100%;
      width: 24px;
      height: 24px;
      bottom: -4px;
      inset-inline-start: 10px;
      color: var(--clr-danger);
    }
    .het-upload-img.p-fileupload .btn-upload-cancel.het-btn > .p-icon-wrapper {
      width: 12px;
    }
    .het-alert {
      --palert-content-align: space-between;
      --palert-content-gap: 0;
      --palert-my: 0;
      --palert-mx: 0;
      --palert-py: 0.5rem;
      --palert-px: 0.75rem;
      --palert-clr: #424B59;
      --palert-bg: #e9e9ff;
      --palert-border-width: 1px;
      --palert-border-clr: transparent;
      --palert-border-style: solid;
      --palert-border-radius: 0.5rem;
      --palert-svg-height: 1rem;
      --palert-svg-clr: #424B59;
      --palert-text-gap: 0.5rem;
      --palert-content-fs: 0.875rem;
      --palert-content-fw: 400;
      --palert-content-lh: 1.125rem;
      --palert-content-clr: #424B59;
      --palert-close-width: auto;
      --palert-close-height: auto;
      --palert-close-border-width: 0;
      --palert-close-border-clr: transparent;
      --palert-close-border-style: solid;
      --palert-close-border-radius: 50%;
      --palert-close-bg: transparent;
      --palert-close-clr: #424B59;
      --palert-close-py: 0;
      --palert-close-px: 0;
      --palert-close-hover-bg: transparent;
      --palert-close-hover-clr: #424B59;
    }
    .het-alert.alert-notclosable .p-message-text {
      flex: 1;
      width: 100%;
    }
    .het-alert.p-message-info {
      --palert-bg: var(--clr-light-primary);
      --palert-border-clr: transparent;
      --palert-clr: var(--clr-primary);
      --palert-svg-clr: var(--clr-primary);
      --palert-content-clr: var(--clr-primary);
      --palert-close-clr: var(--clr-primary);
    }
    .het-alert.p-message-success {
      --palert-bg: var(--clr-light-success);
      --palert-border-clr: transparent;
      --palert-clr: var(--clr-success);
      --palert-svg-clr: var(--clr-success);
      --palert-content-clr: var(--clr-success);
      --palert-close-clr: var(--clr-success);
    }
    .het-alert.p-message-warning {
      --palert-bg: var(--clr-light-warning);
      --palert-border-clr: transparent;
      --palert-clr: var(--clr-warning);
      --palert-svg-clr: var(--clr-warning);
      --palert-content-clr: var(--clr-warning);
      --palert-close-clr: var(--clr-warning);
    }
    .het-alert.p-message-error {
      --palert-bg: var(--clr-light-danger);
      --palert-border-clr: transparent;
      --palert-clr: var(--clr-danger);
      --palert-svg-clr: var(--clr-danger);
      --palert-content-clr: var(--clr-danger);
      --palert-close-clr: var(--clr-danger);
    }
    .het-alert.p-message-warning-2 {
      --palert-py: 12px;
      --palert-px: 12px;
      --palert-bg: #FEF5E7;
      --palert-content-clr: #875706;
      --palert-svg-height: 30px;
      --palert-svg-clr: #F59E0B;
    }
    .het-alert.p-message-light-grey {
      --palert-py: 12px;
      --palert-px: 12px;
      --palert-bg: #F7F7F8;
      --palert-content-clr: #2D3036;
      --palert-svg-height: 30px;
      --palert-svg-clr: #2D3036;
      --palert-content-fs: 16px;
    }
    .het-alert.p-message-light-grey .het-btn {
      --pbtn-fw: 500 ;
    }
    .het-alert.alert-flex-between .p-message-text {
      width: 100%;
    }
    .het-alert.p-message-dark-blue {
      --palert-py: 12px;
      --palert-px: 16px;
      --palert-bg: #E7F6FD;
      --palert-content-clr: #085B80;
      --palert-content-fs: 16px;
    }
    .het-alert.p-message-dark-blue .btn-reload .p-button-link {
      --pbtn-fw: 500;
      --pbtn-clr: #085B80;
    }
    .het-alert.p-message-dark-blue .btn-reload .p-button-link svg {
      color: #085B80;
    }
    .slider-range-wrapper {
      margin-top: 26px;
    }
    .slider-range-wrapper .het-slider-range {
      margin-bottom: 26px;
    }
    .slider-range-wrapper .slider-range-content {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
      flex-wrap: wrap;
    }
    .slider-range-wrapper .slider-range-content > p {
      font-size: 12px;
      font-weight: 400;
      line-height: 17px;
      color: #6B7280;
    }
    .het-slider-range {
      --pslider-track-bg: #F0F1F2;
      --pslider-range-bg: #3DAAE1;
      --pslider-border-radius: 0;
      --pslider-handle-height: 20px;
      --pslider-handle-width: 20px;
      --pslider-handle-bg: #3DAAE1;
      --pslider-handle-border-radius: 100%;
      --pslider-handle-content-width: 20px;
      --pslider-handle-content-height: 20px;
      --pslider-handle-content-bg: #3DAAE1;
      --pslider-handle-content-border-radius: 100%;
      --pslider-handle-content-shadow: none;
      --pslider-track-size: 3px;
    }
  }
  @layer layout {
    @layer main, header, aside, footer, extras;
    @layer main {
      .wrapper {
        position: relative;
        transition: 0.2s all ease-in-out;
        padding: 0;
        background: #263579;
      }
      .wrapper .container-fluid {
        padding-inline: 0;
      }
      .wrapper > .content {
        background: white;
        border-start-start-radius: 32px;
        border-end-start-radius: 32px;
        padding: 24px;
      }
      .flex-root {
        display: flex;
        -webkit-box-flex: 1;
        -ms-flex: 1 0 0;
        flex: 1;
        min-height: 100vh;
      }
      .flex-root .flex-column-fluid {
        display: flex;
        -webkit-box-flex: 1;
        -ms-flex: 1 0 auto;
        flex: 1 0 auto;
      }
      .flex-root .flex-row-fluid {
        display: flex;
        -webkit-box-flex: 1;
        -ms-flex: 1 0 0;
        flex: 1 auto;
        min-width: 0;
      }
      .flex-root .flex-row-auto {
        display: flex;
        -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
      }
    }
    @layer header {
      .het-header {
        padding-block: 0 16px;
        background: white;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 0.5rem;
        flex-wrap: wrap;
        transition: 0.2s all ease-in-out;
      }
      .het-header .header-title h2 {
        font-size: 20px;
        font-weight: 500;
        line-height: 24px;
        color: #2D3036;
      }
      .het-header .header-toolbar {
        display: flex;
        align-items: center;
        gap: 1rem;
        flex-wrap: wrap;
      }
      .het-header .header-toolbar .header-user {
        display: flex;
        align-items: center;
        gap: 10px;
        flex-wrap: wrap;
        cursor: pointer;
        padding-inline: 12px;
        padding-block: 8px;
        background: rgba(233, 235, 242, 0.5019607843);
        border-radius: 6px;
      }
      .het-header .header-toolbar .header-user .user-icon {
        width: 32px;
        height: 32px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: var(--clr-dark-primary);
        border-radius: 100%;
        font-size: 14px;
        font-weight: 500;
        line-height: 17px;
        color: white;
      }
      @media screen and (max-width: 767.98px) {
        .het-header .header-toolbar .header-user .user-info {
          display: none;
        }
      }
      .het-header .header-toolbar .header-user .user-info > span {
        font-size: 14px;
        font-weight: 500;
        line-height: 17px;
        color: #2D3036;
      }
      .het-header .header-toolbar .header-user > .svg-icon {
        width: 24px;
        height: 24px;
        color: #2D3036;
      }
      .het-header .header-toolbar .header-user > .svg-icon svg {
        width: auto;
        height: 7px;
      }
      .het-header .header-calendar {
        display: flex;
        align-items: center;
        gap: 8px;
      }
      .het-header .header-calendar .svg-icon {
        color: #6E7C91;
        width: 24px;
        height: 24px;
      }
      .het-header .header-calendar p {
        font-size: 0.78875rem;
        font-weight: 500;
        line-height: 17.8px;
        color: #424B59;
      }
      .het-header .header-notification {
        display: flex;
        align-items: center;
        position: relative;
      }
      .het-header .header-notification::before {
        position: absolute;
        width: 7px;
        height: 7px;
        border-radius: 100%;
        background: red;
        border: 1.3px solid white;
        z-index: 1;
        top: 1px;
        inset-inline-start: 4px;
      }
      .het-header .header-notification.notification-new::before {
        content: "";
      }
      .het-header .header-notification .svg-icon {
        color: #6E7C91;
        width: 24px;
        height: 24px;
      }
      .het-breadcrumbs-wrapper {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 1rem;
        padding-bottom: 12px;
        border-bottom: 1px solid #E9EBF2;
        margin-bottom: 24px;
      }
      @media screen and (max-width: 600px) {
        .het-breadcrumbs-wrapper {
          flex-wrap: wrap;
        }
      }
      .het-breadcrumbs-wrapper .het-breadcrumbs {
        --breadcrumbs-py: 0;
        --breadcrumbs-px: 0;
        --breadcrumbs-bg: transparent;
        --breadcrumbs-border-width: 0px;
        --breadcrumbs-border-clr: #dee2e6;
        --breadcrumbs-border-radius: 0px;
        --breadcrumbs-gap: 12px;
        --breadcrumbs-link-border-radius: 0px;
        --breadcrumbs-link-focus-boxshadow: none;
        --breadcrumbs-link-fs: 14px;
        --breadcrumbs-link-fw: 400;
        --breadcrumbs-link-lh: 17px;
        --breadcrumbs-link-clr: #898E99;
        --breadcrumbs-link-hover-clr: #4C515B;
        --breadcrumbs-link-hover-textdecoration: none;
        --breadcrumbs-link-icon-clr: #898E99;
        --breadcrumbs-icon-margin: 0 10px;
        --breadcrumbs-icon-clr: #6E7C91;
        --breadcrumbs-icon-width: auto;
        --breadcrumbs-icon-height: auto;
        --breadcrumbs-link-lastchild-clr: #424B59;
        --breadcrumbs-link-lastchild-icon-clr: #424B59;
        --breadcrumbs-separator-margin: 0;
        --breadcrumbs-separator-clr: #898E99;
      }
      @media screen and (max-width: 550px) {
        .het-breadcrumbs-wrapper .het-breadcrumbs.p-breadcrumb .p-breadcrumb-list {
          flex-wrap: wrap !important;
          gap: 12px 0;
        }
      }
      .het-breadcrumbs-wrapper .p-breadcrumb-separator {
        inline-size: 5px;
        aspect-ratio: 1;
        border-radius: 100%;
        background: #898E99;
      }
      .het-notifications-menu {
        min-width: 380px;
        padding: 0;
      }
      .het-notifications-menu .notifications-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 6px;
        padding-inline: 24px;
        padding-block: 16px;
        border-bottom: 1px solid #E9EBF2;
        margin-bottom: 16px;
      }
      .het-notifications-menu .notifications-header h3 {
        font-weight: 500;
        font-size: 18px;
        line-height: 28px;
        color: #4C515B;
      }
      .het-notifications-menu .notification-footer {
        padding: 16px;
        text-align: center;
      }
      .het-notifications-menu .notification-footer .het-btn {
        --pbtn-fw: 500;
      }
      .notifications-menu-list li {
        --notification-ps: 24px;
        --notification-pe: 24px;
        position: relative;
        padding-inline: var(--notification-ps, 24px) var(--notification-pe, 24px);
        padding-block: 0 20px;
        border-bottom: 1px solid #E9EBF2;
      }
      .notifications-menu-list li:has(> app-empty-placeholder) {
        text-align: center;
      }
      .notifications-menu-list li::before {
        position: absolute;
        width: 7px;
        height: 7px;
        background: var(--clr-primary);
        border-radius: 100%;
        inset-inline-end: 8px;
        top: 0;
      }
      .notifications-menu-list li:not(:last-child) {
        margin-bottom: 16px;
      }
      .notifications-menu-list li .notification-title {
        font-size: 16px;
        font-weight: 500;
        line-height: 22px;
        color: #898E99;
        margin-bottom: 4px;
      }
      .notifications-menu-list li p {
        font-size: 12px;
        font-weight: 400;
        line-height: 17px;
        color: #898E99;
      }
      .notifications-menu-list li .notification-desc {
        margin-bottom: 4px;
      }
      .notifications-menu-list li .notification-time {
        color: #BBBEC5;
      }
      .notifications-menu-list li > .het-btn {
        margin-top: 12px;
      }
      .notifications-menu-list li.notification-unread .notification-title {
        color: #3B3F46;
      }
      .notifications-menu-list li.notification-unread::before {
        content: "";
      }
      .notifications-menu-list.het-notifications li {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 8px;
        flex-wrap: wrap;
      }
      .notifications-menu-list.het-notifications li .notification-title {
        color: #3B3F46;
        margin-bottom: 8px;
      }
      .notifications-menu-list.het-notifications li .notification-desc {
        font-size: 16px;
        color: #6B7280;
        line-height: 22px;
        margin-bottom: 8px;
      }
      .notifications-menu-list.het-notifications li .notification-time {
        font-size: 14px;
        color: #898E99;
        line-height: 20px;
      }
      .notifications-menu-list.het-notifications li:last-child {
        border-bottom: 0;
      }
      .notifications-menu-list.scroll {
        --scroll-min-height: 350px;
        --scroll-padding-istart: 8px;
        margin-inline-end: 8px;
      }
      .notifications-menu-list.scroll li {
        --notification-pe: 32px;
      }
    }
    @layer aside {
      :root {
        --aside-width: 222px;
      }
      .aside {
        width: var(--aside-width, 250px);
        transition: 0.2s all ease-in-out;
        background: #263579;
        z-index: 50;
      }
      .aside-fixed .aside {
        position: fixed;
        top: 0;
        bottom: 0;
        inset-inline-start: 0;
      }
      .aside .het-aside {
        position: relative;
        isolation: isolate;
        padding-block: 1rem;
        padding-inline: 1rem 0.5rem;
        overflow: clip;
        height: 100%;
      }
      .aside .het-aside .menu-pattern {
        position: absolute;
        bottom: -57vh;
        width: 900px;
        z-index: -1;
        inset-inline-start: -290px;
        opacity: 0.2;
      }
      .aside .het-aside .aside-logo {
        display: flex;
        align-items: center;
        position: relative;
        padding-block: 14px 20px;
        margin-inline: 0 0.5rem;
        justify-content: center;
        transition: 0.2s all ease-in-out;
        border-bottom: 1px solid #374A98;
        margin-bottom: 20px;
      }
      .aside .het-aside .aside-logo > .svg-icon {
        width: 150px;
        transition: 0.2s all ease-in-out;
      }
      .aside .het-aside .aside-nav {
        --panelMenu-header-content-border-clr: transparent;
        --panelMenu-header-content-clr: white;
        --panelMenu-header-content-bg: transparent;
        --panelMenu-header-content-border-radius: 8px;
        --panelMenu-header-hover-content-border-clr: transparent;
        --panelMenu-header-hover-content-bg: var(--clr-primary);
        --panelMenu-header-hover-content-clr: white;
        --panelMenu-header-content-action-fs: 14.22px;
        --panelMenu-header-content-action-fw: 500;
        --panelMenu-header-content-action-clr: white;
        --panelMenu-header-highlight-content-clr: white;
        --panelMenu-header-highlight-content-bg: transparent;
        --panelMenu-header-highlight-content-border-clr: transparent;
        --panelMenu-header-highlight-content-border-radius-ss: 8px;
        --panelMenu-header-highlight-content-border-radius-se: 8px;
        --panelMenu-header-highlight-content-border-radius-es: 8px;
        --panelMenu-header-highlight-content-border-radius-ee: 8px;
        --panelMenu-header-highlight-hover-content-border-clr: var(--clr-primary);
        --panelMenu-header-highlight-hover-content-bg: var(--clr-primary);
        --panelMenu-header-highlight-hover-content-clr: white;
        --panelMenu-content-bg: transparent;
        --panelMenu-content-border-clr: transparent;
        --panelMenu-content-py: 10px;
        --panelMenu-content-px: 16px 0;
        --panelMenu-content-item-clr: white;
        --panelMenu-content-item-link-icon-clr: white;
        --panelMenu-content-item-border-radius: 8px;
        --panelMenu-content-item-highlight-bg: var(--clr-primary);
        --panelMenu-content-item-hover-bg: var(--clr-primary);
        --panelMenu-content-item-focus-bg: var(--clr-primary);
        --panelMenu-content-item-focus-clr: white;
        --panelMenu-content-item-hover-clr: white;
        height: var(--scroll-min-height);
      }
      .aside .het-aside .aside-nav.scroll {
        --scroll-min-height: calc(100vh - 126px);
      }
      .aside .het-aside .aside-nav .p-panelmenu-header-content:has(> .active) {
        background: var(--clr-primary);
        border-color: var(--clr-primary);
      }
      .aside .het-aside .aside-nav .nav-item {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
        padding: 10px 12px;
      }
      .aside .het-aside .aside-nav .nav-item .item-title {
        display: flex;
        align-items: center;
        gap: 12px;
        color: white;
        flex-shrink: 0;
      }
      .aside .het-aside .aside-nav .nav-item .item-title .svg-icon {
        max-width: 20px;
        min-height: 24px;
        transition: all 0.2s all;
      }
      .aside .het-aside .aside-nav .nav-item .item-title p {
        font-size: 14.22px;
        font-weight: 500;
        line-height: 21.33px;
        transition:
          0.1s transfom ease-in-out,
          0.05s width ease,
          0.2s z-index ease,
          0.2s position ease;
        transition-delay: 0.18s;
      }
      .aside .het-aside .aside-nav .nav-item .item-toolbar .svg-icon {
        transform: rotate(-90deg);
        transition: all 0.2s ease-in-out;
      }
      [dir=rtl] .aside .het-aside .aside-nav .nav-item .item-toolbar .svg-icon {
        transform: rotate(90deg);
      }
      .aside .het-aside .aside-nav .p-panelmenu-header.p-highlight .nav-item .item-toolbar .svg-icon,
      .aside .het-aside .aside-nav .p-submenu-list:not(.p-panelmenu-root-list) .nav-item .item-toolbar .svg-icon,
      .aside .het-aside .aside-nav .p-menuitem[aria-expanded=true] .nav-item .item-toolbar .svg-icon {
        transform: rotate(-180deg);
        transition: all 0.2s ease-in-out;
      }
      [dir=rtl] .aside .het-aside .aside-nav .p-panelmenu-header.p-highlight .nav-item .item-toolbar .svg-icon,
      [dir=rtl] .aside .het-aside .aside-nav .p-submenu-list:not(.p-panelmenu-root-list) .nav-item .item-toolbar .svg-icon,
      [dir=rtl] .aside .het-aside .aside-nav .p-menuitem[aria-expanded=true] .nav-item .item-toolbar .svg-icon {
        transform: rotate(180deg);
      }
      [dir=ltr] .aside .het-aside .aside-nav .p-submenu-list .nav-item .item-title .svg-icon {
        transform: scaleX(-1);
      }
      .aside .het-aside .aside-nav .p-submenu-list .p-menuitem[aria-expanded=true] > .p-menuitem-content .nav-item {
        background: var(--clr-primary);
        border-radius: 8px;
      }
      .aside .het-aside .aside-nav .p-menuitem-content > .nav-item {
        padding: 6px 12px 6px;
        margin-bottom: 6px;
      }
      .aside .het-aside .aside-nav .p-panelmenu-submenu {
        --p-panelmenu-item-focus-background: transparent;
      }
      .aside .het-aside .aside-nav .p-panelmenu-submenu .nav-item .svg-icon:empty {
        width: 8px;
        min-height: 8px;
        border-radius: 100%;
        background: rgba(255, 255, 255, 0.6980392157);
      }
      .aside .het-aside .aside-nav .p-panelmenu-submenu .p-panelmenu-item:not(.p-disabled) > .p-panelmenu-item-content .active {
        outline: 0;
        background: transparent;
        color: var(--clr-primary);
      }
      .aside .het-aside .aside-nav .p-panelmenu-submenu .p-panelmenu-item:not(.p-disabled) > .p-panelmenu-item-content .active .item-title {
        color: var(--clr-primary);
      }
      .aside .het-aside .aside-nav .p-panelmenu-submenu .p-panelmenu-item:not(.p-disabled) > .p-panelmenu-item-content .active .svg-icon:empty {
        background: var(--clr-primary);
      }
      .aside .het-aside .aside-nav .p-panelmenu-submenu .p-panelmenu-item:not(.p-disabled) > .p-panelmenu-item-content:hover {
        outline: 0;
        background: transparent;
        color: var(--clr-primary);
      }
      .aside .het-aside .aside-nav .p-panelmenu-submenu .p-panelmenu-item:not(.p-disabled) > .p-panelmenu-item-content:hover .nav-item .item-title {
        color: var(--clr-primary);
      }
      .aside .het-aside .aside-nav .p-panelmenu-submenu .p-panelmenu-item:not(.p-disabled) > .p-panelmenu-item-content:hover .nav-item .svg-icon:empty {
        background: var(--clr-primary);
      }
      .aside .het-aside .aside-nav .p-panelmenu-submenu .p-panelmenu-item.p-focus > .p-panelmenu-item-content {
        outline: 0;
        background: transparent;
        color: var(--clr-primary);
      }
      .aside .het-aside .aside-nav .p-panelmenu-submenu .p-panelmenu-item.p-focus > .p-panelmenu-item-content .nav-item .item-title {
        color: var(--clr-primary);
      }
      .aside .het-aside .aside-nav .p-panelmenu-submenu .p-panelmenu-item.p-focus > .p-panelmenu-item-content .nav-item .svg-icon:empty {
        background: var(--clr-primary);
      }
      .aside .het-aside .aside-nav .p-panelmenu-header-active .nav-item .item-toolbar .svg-icon {
        rotate: 90deg;
        transition: all 0.2s ease-in-out;
      }
      .aside .het-aside .aside-nav .p-panelmenu-content-container {
        visibility: visible;
      }
      .aside .het-aside .aside-nav .p-panelmenu-content-container.ng-animating {
        transition-property:
          visibility,
          height,
          opacity;
        opacity: 0;
      }
      .aside .het-aside .aside-nav .p-panelmenu-content-container.p-panelmenu-expanded {
        visibility: visible;
        transition-property:
          visibility,
          height,
          opacity;
        transition-delay: 0s;
      }
      .aside .het-aside .aside-nav .p-panelmenu-content-container:not(.p-panelmenu-expanded) {
        transition: 0.2s cubic-bezier(0.86, 0, 0.2, 1);
        transition-property:
          visibility,
          height,
          opacity;
        opacity: 0;
        visibility: hidden;
      }
      .aside .het-aside p-panelMenu {
        display: block;
        height: calc(100vh - 126px);
      }
      .aside-fixed .wrapper {
        padding-inline-start: var(--aside-width, 250px);
      }
      @media screen and (max-width: 767.98px) {
        .aside-mobile {
          position: relative;
          isolation: isolate;
        }
        .aside-mobile:before {
          position: absolute;
          width: 100%;
          height: 100%;
          background: black;
          top: 0;
          inset-inline-start: 0;
          opacity: 0.7;
          z-index: 1066;
        }
        .aside-mobile .aside {
          transition: 0.2s all ease-in-out;
        }
        [dir=ltr] .aside-mobile .aside {
          transform: translateX(-222px);
        }
        [dir=rtl] .aside-mobile .aside {
          transform: translateX(222px);
        }
        .aside-mobile .wrapper {
          padding-inline-start: 0;
        }
        .aside-mobile .content {
          border-radius: 0;
        }
        .aside-mobile.aside-opened {
          overflow: hidden;
        }
        .aside-mobile.aside-opened .aside {
          transform: translateX(0px);
          transition: 0.2s all ease-in-out;
          z-index: 1067;
        }
        .aside-mobile.aside-opened::before {
          content: "";
        }
      }
      @media screen and (min-width: 768px) {
        .aside-mobile .btn-mobile-menu {
          display: none;
        }
      }
      .aside-mobile .mobile-btn {
        position: absolute;
        width: 16px;
        height: 16px;
        border-radius: 100%;
        border: 1px solid white;
        color: white;
        display: flex;
        align-items: center;
        justify-content: center;
        inset-inline-end: 10px;
        top: 10px;
        z-index: 1;
      }
      .aside-mobile .mobile-btn svg {
        width: 6px;
        height: auto;
      }
      @media screen and (min-width: 768px) {
        .aside-mobile .mobile-btn {
          display: none;
        }
      }
    }
    @layer footer {
      .het-footer {
        padding: 15px 0;
        text-align: center;
        font-size: 16px;
        font-weight: 700;
        line-height: 24px;
        color: rgba(33, 20, 95, 0.3);
      }
    }
    @layer extras {
      .het-spinner {
        --spinner-overlay-bg: rgba(249, 252, 254, 0.33);
        --spinner-img-width: 150px;
        --spinner-svg-width: 200px;
      }
      .spinner-het.p-progress-spinner {
        position: fixed !important;
        inset: 0;
        margin: auto !important;
      }
      .spinner-het.p-progress-spinner::before {
        content: "";
        width: 100vw;
        height: 100vh;
        background: black;
        position: fixed;
        top: 0;
        inset: 0;
        margin: auto;
        opacity: 0.4;
      }
      .het-scrolltop {
        --scrolltop-width: 35px;
        --scrolltop-height: 35px;
        --scrolltop-bg: var(--clr-primary);
        --scrolltop-border-radius: 8px;
        --scrolltop-icon-clr: white;
        --scrolltop-width-tablets: 30px;
        --scrolltop-height-tablets: 30px;
        --scrolltop-icon-width: 20px;
        --scrolltop-icon-height: 20px;
      }
    }
  }
  @layer modules {
    .het-login {
      display: grid;
      grid-template-columns: 1fr 1fr;
      align-items: center;
      background-color: #263579;
      position: relative;
    }
    .het-login .login-lang-wrapper {
      position: absolute;
      top: 42px;
      inset-inline-end: 42px;
    }
    .het-login .login-logo {
      padding: 20px;
      height: 100%;
      display: flex;
      align-items: center;
      justify-content: center;
      background: #263579;
      flex-direction: column;
      gap: 20px;
      min-height: 100vh;
      position: relative;
      isolation: isolate;
      overflow: hidden;
    }
    .het-login .login-logo .svg-pattern {
      position: absolute;
      width: 120%;
      height: auto;
      opacity: 0.2;
      top: 250px;
      bottom: 0;
      inset-inline-start: -150px;
      z-index: -1;
    }
    .het-login .login-logo h1 {
      font-weight: 400;
      font-size: 25px;
      color: white;
    }
    .het-login .login-form-wrapper {
      display: grid;
      padding: 20vh 20px 48px;
      height: 100%;
      min-height: 100vh;
      background: white;
      border-start-start-radius: 32px;
      border-end-start-radius: 32px;
    }
    .het-login .login-form-wrapper .login-form {
      width: clamp(300px, 25vw, 500px);
      margin-inline: auto;
      place-content: center;
    }
    .het-login .login-form-wrapper .login-form h3 {
      display: flex;
      align-items: center;
      justify-content: space-between;
      font-size: 20px;
      font-weight: 500;
      line-height: 24px;
      color: #2d3036;
      margin-bottom: 14px;
    }
    .het-login .login-form-wrapper .login-form h3 > .het-btn {
      --pbtn-bg: #f3f4f6;
      --pbtn-clr: #2d3036;
      --pbtn-border-clr: #f3f4f6;
      --pbtn-border-radius: 50%;
      --pbtn-minheight: 40px;
    }
    .het-login .login-form-wrapper .login-form > p {
      font-size: 16px;
      font-weight: 400;
      line-height: 22px;
      color: #6b7280;
      margin-bottom: 22px;
    }
    .het-login .login-form-wrapper .login-form .form-group {
      margin-bottom: 16px;
    }
    .het-login .login-form-wrapper > .svg-wrapper {
      padding-top: 50px;
      place-content: end;
      text-align: center;
    }
    .het-login .mb-22 {
      margin-bottom: 22px;
    }
    .het-login .w-100 {
      width: 100%;
    }
    .total-checked-employee {
      margin-top: 16px;
      display: flex;
      font-weight: 400;
      font-size: 14px;
      line-height: 20px;
      color: #6b7280;
    }
    .overlay-wrapper {
      position: relative;
    }
    .overlay-wrapper .section-overlay {
      position: absolute;
      display: flex;
      align-items: center;
      justify-content: center;
      width: 100%;
      height: 100%;
      background: rgba(255, 255, 255, 0.5);
      -webkit-backdrop-filter: blur(5px);
      backdrop-filter: blur(5px);
      font-weight: 500;
      font-size: 16px;
      line-height: 22px;
      color: #4c515b;
      z-index: 4;
      flex-direction: column;
      gap: 30px;
    }
    .modal-section-title {
      font-weight: 500;
      font-size: 18px;
      line-height: 28px;
      color: #4c515b;
      padding-bottom: 8px;
      border-bottom: 1px solid #f0f1f2;
      margin-bottom: 20px;
    }
    .modal-table-count {
      font-weight: 400;
      font-size: 16px;
      line-height: 22px;
      color: #6b7280;
      margin-bottom: 16px;
    }
    .het-error-page {
      display: flex;
      align-items: center;
      justify-content: center;
      background: #e9ebf2;
      padding: 10vh;
      min-height: 100vh;
    }
    .het-settings-list {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(262px, 1fr));
      gap: 24px;
    }
    .het-settings-list > li {
      padding: 24px;
      border: 1px solid #e9ebf2;
      border-radius: 8px;
      box-shadow: 0px 6px 20px 1px rgba(193, 210, 234, 0.2588235294);
      place-content: center;
    }
    .het-settings-list > li:hover {
      cursor: pointer;
      border-color: var(--clr-primary);
    }
    .het-settings-list > li > .svg-icon {
      width: 50px;
      height: 50px;
      border-radius: 100%;
      background: #c3e5f6;
      margin-bottom: 16px;
      color: #1a475f;
    }
    .het-settings-list > li > p {
      font-weight: 500;
      font-size: 16px;
      line-height: 24px;
      color: #4c515b;
    }
    .view-info-wrapper {
      margin-bottom: 30px;
    }
    .view-info-wrapper h3 {
      display: flex;
      align-items: center;
      gap: 4px;
      font-size: 14px;
      font-weight: 400;
      line-height: 17px;
      color: #2d3036;
      margin-bottom: 8px;
    }
    .view-info-wrapper .info-desc {
      display: flex;
      align-items: center;
      gap: 8px;
      font-size: 14px;
      font-weight: 500;
      line-height: 120%;
      color: #2d3036;
    }
    .view-info-wrapper .info-desc > span {
      max-width: 31ch;
    }
    .view-info-wrapper .info-desc .het-btn {
      --pbtn-fs: 14px;
    }
    .view-info-wrapper .info-desc .info-desc-icon {
      width: 32px;
      height: 32px;
      display: flex;
      align-items: center;
      justify-content: center;
      background: #e9ebf2;
      border-radius: 100%;
      font-size: 14px;
      font-weight: 400;
      line-height: 18px;
      color: #263579;
    }
    .view-info-wrapper .info-subDesc {
      font-weight: 400;
      font-size: 12px;
      line-height: 18px;
      color: #6b7280;
      margin-top: 8px;
    }
    .view-info-wrapper .info-signature-wrapper {
      padding: 8px;
      border-radius: 8px;
      background: #fafafa;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
    }
    .view-info-wrapper .info-signature-wrapper .info-signature {
      display: flex;
      align-items: center;
      gap: 12px;
    }
    .view-info-wrapper .info-signature-wrapper .info-signature > .svg-icon {
      width: 40px;
      height: 40px;
      background: #f7f7f8;
      border-radius: 8px;
      color: #898e99;
    }
    .view-info-wrapper .info-signature-wrapper .info-signature > .svg-icon svg {
      width: 22px;
      height: auto;
    }
    .view-info-wrapper .info-signature-wrapper .info-signature .signature-title {
      font-weight: 400;
      font-size: 14px;
      line-height: 18px;
      color: #4c515b;
      margin-bottom: 4px;
    }
    .view-info-wrapper .info-signature-wrapper .info-signature .signature-size {
      font-weight: 400;
      font-size: 12px;
      line-height: 15px;
      color: #898e99;
    }
    .view-info-wrapper .info-signature-wrapper > .het-btn {
      margin-inline-end: 10px;
    }
    .modal-default .signature-img-wrapper {
      display: flex;
      align-items: center;
      justify-content: center;
      margin-bottom: 24px;
    }
    .modal-default .signature-img-wrapper > img {
      max-height: 200px;
      width: auto;
      object-fit: contain;
    }
    .view-info-box {
      padding: 16px;
      border: 1px solid #e9ebf2;
      border-radius: 8px;
      margin-bottom: 24px;
    }
    .view-info-box .view-info-wrapper {
      margin-bottom: 0;
    }
    .het-profile-header .header-bgpattern {
      position: relative;
      background: var(--clr-dark-primary);
      border-start-start-radius: 8px;
      border-start-end-radius: 8px;
      height: 118px;
      overflow: clip;
    }
    .het-profile-header .header-bgpattern > .svg-icon {
      position: absolute;
      rotate: 90deg;
      bottom: -515px;
      width: 30%;
      inset-inline-end: -60px;
      opacity: 0.2;
      width: 473px;
    }
    .het-profile-header .header-content {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 0.5rem;
      margin-top: -50px;
    }
    .het-profile-header .header-content .header-title {
      padding-inline-start: 25px;
      z-index: 1;
    }
    .het-profile-header .header-content .header-title .title-icon {
      width: 100px;
      height: 100px;
      display: flex;
      align-items: center;
      justify-content: center;
      outline: 4px solid white;
      border-radius: 6px;
      background: #e9ebf2;
      font-weight: 500;
      font-size: 25px;
      line-height: 32px;
      color: var(--clr-dark-primary);
      margin-bottom: 22px;
    }
    .het-profile-header .header-content .header-title > h2 {
      font-size: 16px;
      font-weight: 700;
      line-height: 19px;
      color: #101633;
    }
    .het-profile-header .header-content .header-toolbar {
      display: flex;
      align-items: center;
      gap: 1rem;
      margin-top: 32px;
    }
    .het-profile-header.employee-details .header-content {
      margin-top: -25px;
      align-items: flex-end;
    }
    .het-profile-header.employee-details .header-content .header-title {
      display: flex;
      align-items: flex-end;
      gap: 20px;
      flex-wrap: wrap;
    }
    .het-profile-header.employee-details .header-content .header-title .title-icon {
      margin-bottom: 0;
    }
    .het-profile-header.employee-details .header-content .header-title .title-info h2 {
      font-weight: 600;
      font-size: 16px;
      line-height: 19px;
      color: #101633;
      margin-bottom: 8px;
    }
    .het-profile-header.employee-details .header-content .header-title .title-info p {
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #3b3f46;
    }
    .het-profile-header.employee-details .header-content .header-toolbar {
      margin-top: 0;
    }
    .het-profile-header.employee-details .header-content .header-toolbar .het-tag {
      margin-bottom: 6px;
    }
    .total-salary-wrapper {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
      padding: 16px;
      border-radius: 8px;
      background: #f0f1f2;
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #2d3036;
    }
    .total-salary-wrapper .total-salary {
      display: flex;
      align-items: center;
      gap: 3px;
    }
    .het-new-salary-wrapper {
      height: calc(100% - 32px);
    }
    .het-old-salary-wrapper {
      padding: 16px;
      background: #f7f7f8;
      border-radius: 8px;
      height: calc(100% - 32px);
    }
    .het-old-salary-wrapper .salary-list {
      margin-bottom: 24px;
    }
    .het-old-salary-wrapper .salary-list > li:not(.total-salary-wrapper) {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
      padding-inline-end: 16px;
    }
    .het-old-salary-wrapper .salary-list > li:not(.total-salary-wrapper) > h3 {
      font-weight: 400;
      font-size: 14px;
      line-height: 17px;
      color: #2d3036;
    }
    .het-old-salary-wrapper .salary-list > li:not(.total-salary-wrapper) > div {
      display: flex;
      align-items: center;
      gap: 3px;
      font-size: 14px;
      font-weight: 500;
      line-height: 17px;
      color: #2d3036;
    }
    .het-old-salary-wrapper .salary-list > li:not(.total-salary-wrapper) > div .svg-icon svg {
      height: 14px;
      width: auto;
    }
    .het-old-salary-wrapper .salary-list > li:not(:last-child) {
      margin-bottom: 20px;
    }
    .het-old-salary-wrapper .salary-rejection-reason h3 {
      font-size: 14px;
      font-weight: 500;
      line-height: 17px;
      color: #2d3036;
      margin-bottom: 8px;
    }
    .het-old-salary-wrapper .salary-rejection-reason p {
      font-size: 14px;
      font-weight: 400;
      line-height: 20px;
      color: #2d3036;
    }
    .section-info-cards-wrapper {
      margin-bottom: 16px;
    }
    .section-info-cards-wrapper .info-cards-title {
      font-weight: 500;
      font-size: 16px;
      line-height: 17px;
      color: #101633;
      margin-bottom: 16px;
    }
    .section-info-cards-wrapper .info-cards-list {
      display: flex;
      align-items: center;
      flex-wrap: wrap;
      gap: 16px;
    }
    .section-info-cards-wrapper .info-cards-list > li {
      padding: 24px 16px;
      border: 1px solid #e9ebf2;
      border-radius: 8px;
      flex: 1;
      width: calc(25% - 12px);
      min-width: max-content;
    }
    .section-info-cards-wrapper .info-cards-list > li h3 {
      display: flex;
      align-items: center;
      justify-content: space-between;
      font-size: 24px;
      font-weight: 700;
      line-height: 29px;
      margin-bottom: 8px;
    }
    .section-info-cards-wrapper .info-cards-list > li p {
      font-weight: 400;
      font-size: 16px;
      line-height: 140%;
      color: #4c515b;
    }
    .info-box-wrapper {
      padding: 16px;
      border: 1px solid #f7f7f8;
      border-radius: 8px;
      margin-bottom: 16px;
    }
    .info-box-wrapper h3 {
      font-weight: 400;
      font-size: 14px;
      line-height: 17px;
      color: #2d3036;
      margin-bottom: 8px;
    }
    .info-box-wrapper p {
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #2d3036;
    }
    .info-box-wrapper p > .svg-icon svg {
      width: 12px;
      height: auto;
    }
    .info-table-wrapper > h3 {
      font-weight: 500;
      font-size: 16px;
      line-height: 120%;
      color: #3b3f46;
      margin-bottom: 16px;
    }
    .info-table-wrapper ul {
      display: flex;
      align-items: center;
      flex-wrap: wrap;
    }
    .info-table-wrapper ul li {
      display: flex;
      align-items: center;
      flex: 50%;
    }
    .info-table-wrapper ul li h4 {
      font-weight: 400;
      font-size: 14px;
      line-height: 18px;
      color: #4c515b;
      flex: 1;
      padding: 22px 24px;
      border: 1px solid #e9ebf2;
      border-inline-end-width: 0;
    }
    .info-table-wrapper ul li p {
      display: flex;
      align-items: center;
      justify-content: center;
      font-weight: 500;
      font-size: 14px;
      line-height: 18px;
      color: #2d3036;
      padding: 22px;
      min-width: 140px;
      border: 1px solid #e9ebf2;
    }
    .info-table-wrapper ul li p .svg-icon {
      margin-inline-start: 5px;
    }
    .info-table-wrapper ul li p .svg-icon svg {
      width: 12px;
      height: auto;
    }
    .info-table-wrapper ul li:not(:first-child, :nth-child(2)) h4,
    .info-table-wrapper ul li:not(:first-child, :nth-child(2)) p {
      border-block-start-width: 0;
    }
    .info-table-wrapper ul li:nth-child(even) h4 {
      border-inline-start-width: 0;
    }
    .het-stepper {
      display: flex;
      align-items: center;
      gap: 12px;
      flex-wrap: wrap;
      margin-bottom: 32px;
    }
    .het-stepper .stepper-link {
      flex: 1;
      padding: 16px;
      border-radius: 8px;
      background: rgba(240, 241, 242, 0.5019607843);
      display: flex;
      align-items: center;
      gap: 16px;
      min-width: max-content;
    }
    .het-stepper .stepper-link:not(.link-done) .svg-icon {
      display: none;
    }
    .het-stepper .stepper-link .stepper-icon {
      inline-size: 40px;
      aspect-ratio: 1;
      display: flex;
      align-items: center;
      justify-content: center;
      border: 2px solid #9ca1aa;
      border-radius: 100%;
      color: #9ca1aa;
      font-size: 16px;
      font-weight: 500;
      line-height: 19px;
    }
    .het-stepper .stepper-link .stepper-content h2 {
      font-weight: 500;
      font-size: 16px;
      line-height: 19px;
      color: #6b7280;
      margin-bottom: 4px;
    }
    .het-stepper .stepper-link .stepper-content p {
      font-weight: 400;
      font-size: 14px;
      line-height: 20px;
      color: #9ca1aa;
    }
    .het-stepper .stepper-link.link-active {
      background: var(--clr-dark-primary);
    }
    .het-stepper .stepper-link.link-active .stepper-number {
      color: white;
    }
    .het-stepper .stepper-link.link-active .stepper-content h2 {
      color: white;
    }
    .het-stepper .stepper-link.link-active .stepper-content p {
      color: #abb7c2;
    }
    .het-stepper .stepper-link.link-done {
      background: #e7f8f2;
    }
    .het-stepper .stepper-link.link-done .stepper-icon {
      border-color: var(--clr-success);
      background: var(--clr-success);
    }
    .het-stepper .stepper-link.link-done .stepper-icon .stepper-number {
      display: none;
    }
    .het-stepper .stepper-link.link-done .stepper-icon .svg-icon {
      display: flex;
      color: white;
    }
    .het-stepper .stepper-link.link-done .stepper-content h2 {
      color: #2d3036;
    }
    .het-stepper .stepper-link.link-done .stepper-content p {
      color: #6b7280;
    }
    .stepper-action {
      display: flex;
      align-items: center;
      gap: 16px;
    }
    .stepper-section-subtitle {
      font-weight: 700;
      font-size: 16px;
      line-height: 19px;
      color: #101633;
      margin-bottom: 16px;
      display: flex;
      align-items: center;
      justify-content: space-between;
    }
    .stepper-section-subtitle .section-actions {
      display: flex;
      align-items: center;
      gap: 16px;
    }
    .process-info-wrapper {
      padding: 16px;
      background: rgba(240, 241, 242, 0.5019607843);
      border-radius: 8px;
      display: flex;
      align-items: center;
      gap: 24px;
      margin-bottom: 24px;
      flex-wrap: wrap;
    }
    .process-info-wrapper .info-item {
      flex: 1;
      margin-block: 5px;
    }
    .process-info-wrapper .info-item:not(:last-child) {
      border-inline-end: 1px solid #d1d3d8;
    }
    @media screen and (max-width: 767.99px) {
      .process-info-wrapper .info-item {
        width: 100%;
        flex: auto;
      }
      .process-info-wrapper .info-item:not(:last-child) {
        border-inline-end: 0;
      }
    }
    .process-info-wrapper .info-item h4 {
      font-weight: 400;
      font-size: 14px;
      line-height: 17px;
      color: #2d3036;
      margin-bottom: 8px;
    }
    .process-info-wrapper .info-item p {
      font-weight: 500;
      font-size: 14px;
      line-height: 12px;
      color: #3b3f46;
    }
    .het-uploader-wrapper {
      padding: 32px;
      text-align: center;
      cursor: pointer;
      margin-bottom: 24px;
      border: 1px dashed #cbd0dc;
      border-radius: 8px;
    }
    .het-uploader-wrapper.drag-over {
      border: 2px dashed var(--clr-primary);
    }
    .het-uploader-wrapper:hover,
    .het-uploader-wrapper:focus {
      border-color: var(--clr-primary);
    }
    .het-uploader-wrapper > .input-upload {
      position: absolute;
      padding: 0;
      inset-inline-start: -999999rem;
    }
    .het-uploader-wrapper .file-wrapper .file-title {
      font-size: 16px;
      font-weight: 500;
      color: #292d32;
      line-height: 19px;
      margin-bottom: 8px;
    }
    .het-uploader-wrapper .file-wrapper .file-info {
      font-size: 14px;
      font-weight: 400;
      color: #a9acb4;
      line-height: 20px;
      margin-bottom: 16px;
    }
    .het-uploader-wrapper .file-wrapper .svg-icon {
      color: #292d32;
    }
    .het-uploader-wrapper .file-wrapper .het-btn {
      --pbtn-clr: #2d3036;
      --pbtn-border-clr: #cbd0dc;
      --pbtn-fs: 14px;
      --pbtn-fw: 400;
      pointer-events: none;
    }
    .het-uploader-wrapper.img-upload {
      padding: 24px;
      border: 0;
      background: #fafafa;
      margin-bottom: 16px;
    }
    .het-uploader-wrapper.img-upload .file-wrapper .het-btn {
      background: white;
      border-color: #cbd0dc;
    }
    .het-uploaded-file-wrapper {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 19px 20px;
      border: 1px solid transparent;
      border-radius: 8px;
      background: rgba(233, 235, 242, 0.4);
      margin-bottom: 24px;
    }
    .het-uploaded-file-wrapper .uploaded-content-wrapper {
      display: flex;
      align-items: center;
      gap: 16px;
      flex: 1;
    }
    .het-uploaded-file-wrapper .uploaded-content-wrapper .uploaded-content {
      flex: 1;
    }
    .het-uploaded-file-wrapper .uploaded-content-wrapper .uploaded-content h3 {
      font-size: 16px;
      font-weight: 400;
      color: #292d32;
      line-height: 22px;
      margin-bottom: 8px;
    }
    .het-uploaded-file-wrapper .uploaded-content-wrapper .uploaded-content p {
      display: flex;
      align-items: center;
      font-size: 14px;
      font-weight: 400;
      color: #a9acb4;
      line-height: 20px;
    }
    .het-uploaded-file-wrapper .uploaded-content-wrapper .uploaded-content p .uploaded-text {
      margin-inline-start: 8px;
      font-size: 16px;
      font-weight: 400;
      line-height: 22px;
      color: #292d32;
    }
    .het-uploaded-file-wrapper .uploaded-content-wrapper .attachment-icon {
      width: 44px;
      height: 44px;
      display: flex;
      align-items: center;
      justify-content: center;
      border-radius: 100%;
      background: #e0f1ff;
      min-width: 44px;
    }
    .het-uploaded-file-wrapper .uploaded-content-wrapper .attachment-icon > svg {
      height: 20px;
      width: auto;
    }
    .het-uploaded-file-wrapper.uploading-wrapper {
      align-items: flex-start;
    }
    .het-uploaded-file-wrapper.uploading-wrapper .uploaded-content-wrapper {
      align-items: flex-start;
    }
    .het-uploaded-file-wrapper.uploading-wrapper .uploaded-content-wrapper .uploaded-icon {
      display: none;
    }
    .het-uploaded-file-wrapper.uploading-wrapper .uploaded-content-wrapper .uploading-icon {
      color: #ced7e3;
    }
    .het-uploaded-file-wrapper.uploading-wrapper .uploaded-content-wrapper .uploaded-content > p {
      margin-bottom: 12px;
    }
    .het-uploaded-file-wrapper.uploading-wrapper .uploaded-content-wrapper .uploaded-content .het-progressbar {
      --progressbar-label-display: block;
      --progressbar-label-fs: 0;
      --progressbar-height: 10px;
      --progressbar-border-radius: 8px;
      --progressbar-bg: #cbd0dc;
      --progressbar-value-bg: #3daae1;
      --progressbar-label-bg: #3daae1;
    }
    .het-uploaded-file-wrapper:not(.uploading-wrapper) .uploaded-content-wrapper .uploading-icon {
      display: none !important;
    }
    .het-uploaded-file-wrapper:not(.uploading-wrapper) .het-progressbar {
      display: none;
    }
    .het-uploaded-file-wrapper.img-uploaded {
      margin-bottom: 0;
      background: #fafafa;
      padding: 16px;
      border: 0;
    }
    .het-uploaded-file-wrapper.img-uploaded .uploaded-content-wrapper {
      gap: 12px;
    }
    .het-uploaded-file-wrapper.img-uploaded .uploaded-content-wrapper > .svg-icon {
      width: 40px;
      height: 40px;
      border-radius: 8px;
      background: #f7f7f8;
      color: #898e99;
    }
    .het-uploaded-file-wrapper.img-uploaded .uploaded-content-wrapper .uploaded-content h3 {
      font-size: 14px;
      font-weight: 400;
      line-height: 18px;
      color: #4c515b;
      margin-bottom: 4px;
    }
    .het-uploaded-file-wrapper.img-uploaded .uploaded-content-wrapper .uploaded-content p {
      font-size: 12px;
      font-weight: 400;
      line-height: 15px;
      color: #898e99;
    }
    .het-uploaded-file-wrapper.img-uploaded .upload-thumbnail {
      display: flex;
      align-items: center;
      justify-content: center;
      display: flex;
      display: fl;
    }
    .het-uploaded-file-wrapper.img-uploaded .upload-thumbnail svg,
    .het-uploaded-file-wrapper.img-uploaded .upload-thumbnail img {
      width: 40px;
      height: 40px;
      border-radius: 8px;
    }
    .het-uploaded-file-wrapper + .uploaded-actions {
      display: flex;
      align-items: center;
      gap: 8px;
      margin-top: 16px;
    }
    .het-employee-offer .offer-actions {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 16px;
      margin-bottom: 48px;
    }
    .het-employee-offer-wrapper {
      display: flex;
      flex-direction: column;
      gap: 21px;
      text-align: center;
    }
    .het-employee-offer-wrapper h3 {
      font-weight: 600;
      font-size: 18px;
      line-height: 22px;
      color: #263579;
    }
    .het-employee-offer-wrapper p {
      font-weight: 400;
      font-size: 12px;
      line-height: 22px;
      color: black;
    }
    .het-employee-offer-wrapper .het-checkbox-wrapper > p {
      font-size: 14px;
      color: #101633;
    }
    .het-employee-offer-wrapper .employee-offer-actions {
      display: flex;
      align-items: center;
      gap: 16px;
    }
    .offer-overlay-blur {
      width: 100vw;
      height: 100vh;
      position: absolute;
      background: rgba(255, 255, 255, 0.6);
      z-index: 6;
      -webkit-backdrop-filter: blur(10px);
      backdrop-filter: blur(10px);
    }
    @media only screen and (max-device-width: 480px), only screen and (max-width: 480px) {
      .het-employee-offer {
        display: flex;
        flex-direction: column;
        height: 100vh;
      }
    }
    @media only screen and (max-device-width: 480px), only screen and (max-width: 480px) {
      .het-employee-offer .offer-actions {
        margin-bottom: 0;
        padding: 29px 10px;
        box-shadow: 0px 10px 10px 0px rgba(0, 0, 0, 0.2196078431), 0px 14px 28px 0px rgba(0, 0, 0, 0.1607843137);
      }
    }
    .offer-wrapper.new-offer {
      --offer-fs-xs: 12px;
      --offer-fs-sm: 14px;
      --offer-fs-md: 16px;
      --offer-fs-lg: 20px;
      padding: 16px 48px 32px;
      font-size: --offer-fs-sm;
      font-family: "BahijSansArabic";
    }
    .offer-wrapper.new-offer .overlay-popup-wrapper {
      display: block !important;
      min-width: 100% !important;
      width: 100% !important;
      background: #ffffff;
      -webkit-text-size-adjust: none;
      direction: rtl !important;
      position: relative;
      isolation: isolate;
    }
    .offer-wrapper.new-offer .offer-title {
      color: #2d3036;
      font-size: var(--offer-fs-lg, 20px);
      font-weight: 600;
      line-height: 24px;
      text-align: center;
      margin-block: 16px;
    }
    .offer-wrapper.new-offer span.stamp {
      position: absolute;
      transform-origin: center center;
      -webkit-transform-origin: center center;
      font-size: 60px;
      color: rgba(150, 150, 150, 0.2);
      white-space: nowrap;
      text-align: center;
      z-index: 3;
      pointer-events: none;
      -webkit-user-select: none;
      user-select: none;
      width: 100%;
    }
    @media only screen and (max-device-width: 480px), only screen and (max-width: 480px) {
      .offer-wrapper.new-offer span.stamp {
        font-size: 30px;
      }
    }
    .offer-wrapper.new-offer span.stamp.st-0 {
      top: 15%;
      left: 15%;
      transform: translate(-15%, -15%) rotate(-21deg);
      -webkit-transform: translate(-15%, -15%) rotate(-21deg);
      -moz-transform: translate(-15%, -15%) rotate(-21deg);
      -ms-transform: translate(-15%, -15%) rotate(-21deg);
      -o-transform: translate(-15%, -15%) rotate(-21deg);
      display: none;
    }
    @media only screen and (max-device-width: 480px), only screen and (max-width: 480px) {
      .offer-wrapper.new-offer span.stamp.st-0 {
        display: block;
      }
    }
    .offer-wrapper.new-offer span.stamp.st-1 {
      top: 25%;
      left: 25%;
      transform: translate(-25%, -25%) rotate(-21deg);
      -webkit-transform: translate(-25%, -25%) rotate(-21deg);
      -moz-transform: translate(-25%, -25%) rotate(-21deg);
      -ms-transform: translate(-25%, -25%) rotate(-21deg);
      -o-transform: translate(-25%, -25%) rotate(-21deg);
    }
    .offer-wrapper.new-offer span.stamp.st-2 {
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%) rotate(-21deg);
      -webkit-transform: translate(-50%, -50%) rotate(-21deg);
      -moz-transform: translate(-50%, -50%) rotate(-21deg);
      -ms-transform: translate(-50%, -50%) rotate(-21deg);
      -o-transform: translate(-50%, -50%) rotate(-21deg);
    }
    @media only screen and (max-device-width: 480px), only screen and (max-width: 480px) {
      .offer-wrapper.new-offer span.stamp.st-2 {
        top: 40%;
        left: 40%;
        transform: translate(-40%, -40%) rotate(-21deg);
        -webkit-transform: translate(-40%, -40%) rotate(-21deg);
        -moz-transform: translate(-40%, -40%) rotate(-21deg);
        -ms-transform: translate(-40%, -40%) rotate(-21deg);
        -o-transform: translate(-40%, -40%) rotate(-21deg);
      }
    }
    .offer-wrapper.new-offer span.stamp.st-3 {
      top: 75%;
      left: 75%;
      transform: translate(-75%, -75%) rotate(-21deg);
      -webkit-transform: translate(-75%, -75%) rotate(-21deg);
      -moz-transform: translate(-75%, -75%) rotate(-21deg);
      -ms-transform: translate(-75%, -75%) rotate(-21deg);
      -o-transform: translate(-75%, -75%) rotate(-21deg);
    }
    @media only screen and (max-device-width: 480px), only screen and (max-width: 480px) {
      .offer-wrapper.new-offer span.stamp.st-3 {
        top: 55%;
        left: 55%;
        transform: translate(-55%, -55%) rotate(-21deg);
        -webkit-transform: translate(-55%, -55%) rotate(-21deg);
        -moz-transform: translate(-55%, -55%) rotate(-21deg);
        -ms-transform: translate(-55%, -55%) rotate(-21deg);
        -o-transform: translate(-55%, -55%) rotate(-21deg);
      }
    }
    .offer-wrapper.new-offer span.stamp.st-4 {
      top: 70%;
      left: 70%;
      transform: translate(-70%, -70%) rotate(-21deg);
      -webkit-transform: translate(-70%, -70%) rotate(-21deg);
      -moz-transform: translate(-70%, -70%) rotate(-21deg);
      -ms-transform: translate(-70%, -70%) rotate(-21deg);
      -o-transform: translate(-70%, -70%) rotate(-21deg);
      display: none;
    }
    @media only screen and (max-device-width: 480px), only screen and (max-width: 480px) {
      .offer-wrapper.new-offer span.stamp.st-4 {
        display: block;
      }
    }
    .offer-wrapper.new-offer span.stamp.st-5 {
      top: 90%;
      left: 90%;
      transform: translate(-90%, -90%) rotate(-21deg);
      -webkit-transform: translate(-90%, -90%) rotate(-21deg);
      -moz-transform: translate(-90%, -90%) rotate(-21deg);
      -ms-transform: translate(-90%, -90%) rotate(-21deg);
      -o-transform: translate(-90%, -90%) rotate(-21deg);
      display: none;
    }
    @media only screen and (max-device-width: 480px), only screen and (max-width: 480px) {
      .offer-wrapper.new-offer span.stamp.st-5 {
        display: block;
      }
    }
    .offer-wrapper.new-offer .logo-wrap {
      text-align: center;
      margin-block: 16px;
    }
    .offer-wrapper.new-offer .logo {
      width: auto;
      height: 80px;
      margin-inline: auto;
    }
    .offer-wrapper.new-offer .rtl {
      direction: rtl;
      text-align: right;
    }
    .offer-wrapper.new-offer .ltr {
      direction: ltr;
      text-align: left;
    }
    @media only screen and (max-device-width: 480px), only screen and (max-width: 480px) {
      .offer-wrapper.new-offer {
        padding: 16px;
        flex-grow: 1;
        overflow-y: auto;
      }
      .offer-wrapper.new-offer .td {
        width: 100% !important;
        min-width: 100% !important;
      }
    }
    .offer-wrapper.new-offer .sign-table {
      width: 100%;
      border-collapse: collapse;
      table-layout: fixed;
      margin-top: 16px;
    }
    .offer-wrapper.new-offer .sign-table td {
      border: 2px solid #3d3d3d;
      padding: 8px 10px;
    }
    .offer-wrapper.new-offer .sign-label {
      background: #e4e4e4;
      width: 160px;
      font-weight: 600;
      color: #263579;
    }
    @media only screen and (max-device-width: 480px), only screen and (max-width: 480px) {
      .offer-wrapper.new-offer .sign-label {
        width: 100px;
      }
    }
    .offer-wrapper.new-offer .copyRights-table {
      width: 100%;
      border-collapse: collapse;
      table-layout: fixed;
      margin-top: 32px;
    }
    .offer-wrapper.new-offer .copyRights-table td .text {
      padding-block: 10px;
      border-top: 1px solid #d1d3d8;
      color: #9ca1aa;
      font-size: var(--offer-fs-xs, 12px);
      white-space: nowrap;
    }
    @media only screen and (max-device-width: 480px), only screen and (max-width: 480px) {
      .offer-wrapper.new-offer .copyRights-table td .text {
        display: block;
        font-size: 12px;
      }
    }
    .offer-wrapper.new-offer .copyRights-table td img {
      height: 60px;
      display: block;
      margin-inline-start: 30px;
    }
    @media only screen and (max-device-width: 480px), only screen and (max-width: 480px) {
      .offer-wrapper.new-offer .copyRights-table td img {
        margin-inline-start: 0;
        height: 30px;
      }
    }
    .offer-wrapper.new-offer .contract-wrapper {
      position: relative;
      padding: 16px 0;
      padding-bottom: 8px;
    }
    @media only screen and (max-device-width: 480px), only screen and (max-width: 480px) {
      .offer-wrapper.new-offer .contract-wrapper {
        display: none;
      }
    }
    .offer-wrapper.new-offer .contract-wrapper.responsive {
      padding: 0;
      border: 0;
      flex-grow: 1;
      overflow-y: auto;
      display: none;
    }
    @media only screen and (max-device-width: 480px), only screen and (max-width: 480px) {
      .offer-wrapper.new-offer .contract-wrapper.responsive {
        display: block;
      }
    }
    @media only screen and (max-device-width: 480px), only screen and (max-width: 480px) {
      .offer-wrapper.new-offer .contract-wrapper.responsive td:not(.seperator-empty) {
        line-height: 170%;
      }
    }
    .offer-wrapper.new-offer .contract-wrapper-separator {
      position: absolute;
      top: 24px;
      left: 50%;
      transform: translateX(-50%);
      width: 2px;
      height: calc(100% - 72px);
      box-sizing: border-box;
      pointer-events: none;
      background: #3d3d3d;
    }
    .offer-wrapper.new-offer table.structured-table {
      width: 100%;
      border-collapse: collapse;
      table-layout: fixed;
      margin-bottom: 10px;
    }
    .offer-wrapper.new-offer table.structured-table td {
      vertical-align: top;
    }
    .offer-wrapper.new-offer table.structured-table td:nth-child(2),
    .offer-wrapper.new-offer table.structured-table td:nth-child(4) {
      line-height: 1.5;
    }
    .offer-wrapper.new-offer table.structured-table td[colspan] {
      border-block: 0;
    }
    .offer-wrapper.new-offer .seperator-empty {
      width: 32px;
    }
    .offer-wrapper.new-offer .title {
      font-size: var(--offer-fs-md, 16px);
      font-weight: 600;
      line-height: 1;
      background: #e4e4e4;
      padding: 8px 14px;
      color: #263579;
      text-align: center;
      border: 2px solid #3d3d3d;
    }
    .offer-wrapper.new-offer .date {
      font-size: var(--offer-fs-sm, 14px);
      font-weight: 500;
      line-height: 1;
      color: #263579;
    }
    .offer-wrapper.new-offer .name,
    .offer-wrapper.new-offer .id,
    .offer-wrapper.new-offer .welcome {
      font-size: var(--offer-fs-sm, 14px);
      font-weight: 600;
      line-height: 16px;
      color: #3d3d3d;
    }
    .offer-wrapper.new-offer .welcome {
      font-weight: 400;
      line-height: 1.5;
    }
    .offer-wrapper.new-offer .alert {
      font-size: var(--offer-fs-sm, 14px);
      font-weight: 600;
      line-height: 16px;
      color: #263579;
      margin-top: 8px;
      text-decoration: underline;
    }
    .offer-wrapper.new-offer .td-max-w-142 {
      width: 140px;
    }
    .offer-wrapper.new-offer .td-bg-grey {
      background: #e4e4e4;
    }
    .offer-wrapper.new-offer .td-bg-grey div {
      font-size: var(--offer-fs-xs, 12px);
      color: #263579;
      font-weight: 700;
    }
    .offer-wrapper.new-offer table.structured-table td.td-bg-grey {
      vertical-align: middle;
    }
    .offer-wrapper.new-offer .td-bg-darkblue {
      background: #e9ebf2;
    }
    .offer-wrapper.new-offer .content-table td:not(.seperator-empty) {
      border: 2px solid #3d3d3d;
      padding: 8px 13px;
      font-size: var(--offer-fs-xs, 12px);
      font-weight: 400;
      line-height: 14px;
      color: #3b3f46;
    }
    .offer-wrapper.new-offer .border-right-0 {
      border-right: 0 !important;
    }
    .offer-wrapper.new-offer .border-left-0 {
      border-left: 0 !important;
    }
    .offer-wrapper.new-offer .m-0 {
      margin: 0 !important;
    }
    .offer-wrapper.new-offer b {
      font-weight: 600;
    }
    .offer-wrapper.new-offer .lh-15 {
      line-height: 1.5;
    }
    .het-signature-wrapper {
      --signature-width: 393px;
      --signature-height: 149px;
      width: 100%;
      height: 100%;
      max-height: var(--signature-height, 140px);
      margin-bottom: 22px;
    }
    .het-signature-wrapper app-free-drawer .canvas_wrapper {
      position: relative;
      border: 1px dashed #d1d3d8;
      background: #fafafa;
      width: 100%;
      border-radius: 6px;
    }
    .het-signature-wrapper app-free-drawer .canvas_wrapper .canvas {
      background-repeat: no-repeat;
      background-size: cover;
      background-position: center;
      width: var(--signature-width, 393px);
      height: var(--signature-height, 149px);
    }
    .dashboard-filters-wrapper {
      display: flex;
      align-items: center;
      gap: 16px;
      flex-wrap: wrap;
    }
    .dashboard-filters-wrapper > * {
      flex: 1;
      min-width: 217px;
      max-width: 50%;
    }
    .het-dashboard-welcome {
      padding: 25px;
      border: 1px solid #e9ebf2;
      border-radius: 8px;
      margin-bottom: 24px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 22px;
    }
    .het-dashboard-welcome .welcome-icon {
      display: flex;
      align-items: center;
      justify-content: center;
    }
    .het-dashboard-welcome .welcome-icon .svg-icon svg {
      width: auto;
      height: 74px;
    }
    .het-dashboard-welcome .welcome-content h2 {
      font-weight: 500;
      font-size: 20px;
      line-height: 24px;
      color: #2d3036;
      margin-bottom: 12px;
    }
    .het-dashboard-welcome .welcome-content p {
      font-weight: 400;
      font-size: 16px;
      line-height: 22px;
      color: #6b7280;
    }
    .het-dashboard-welcome .welcome-time .time-title {
      display: flex;
      align-items: center;
      gap: 6px;
      font-size: 14px;
      font-weight: 400;
      line-height: 17px;
      color: #6b7280;
      margin-bottom: 8px;
    }
    .het-dashboard-welcome .welcome-time .time-title svg {
      width: 16px;
      height: auto;
    }
    .het-dashboard-welcome .welcome-time > p {
      font-size: 16px;
      font-weight: 500;
      line-height: 22px;
      color: #4c515b;
    }
    .dashboard-cards-list {
      display: flex;
      align-items: center;
      flex-wrap: wrap;
      gap: 24px;
    }
    .dashboard-cards-list li {
      flex: calc(50% - 24px);
      min-width: 180px;
      padding: 25px;
      border: 1px solid #e9ebf2;
      border-radius: 8px;
    }
    .dashboard-cards-list li .card-icon {
      width: 50px;
      height: 50px;
      padding: 12px;
      margin-bottom: 18px;
      border-radius: 100%;
    }
    .dashboard-cards-list li .card-icon svg {
      width: 26px;
      height: auto;
    }
    .dashboard-cards-list li h3 {
      font-weight: 400;
      font-size: 16px;
      line-height: 22px;
      color: #101633;
      margin-bottom: 12px;
    }
    .dashboard-cards-list li p {
      font-weight: 700;
      font-size: 25px;
      line-height: 22px;
      color: #101633;
    }
    .dashboard-cards-list li:first-child .card-icon {
      background: #ecf7fc;
      color: var(--clr-primary);
    }
    .dashboard-cards-list li:nth-child(2) .card-icon {
      background: #fef5e7;
      color: var(--clr-warning);
    }
    .dashboard-cards-list li:nth-child(3) .card-icon {
      background: #e7f8f2;
      color: var(--clr-success);
    }
    .dashboard-cards-list li:nth-child(4) .card-icon {
      background: #fdecec;
      color: var(--clr-danger);
    }
    .dashboard-stat-card {
      padding: 16px;
      border: 1px solid #e9ebf2;
      border-radius: 8px;
      margin-bottom: 24px;
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 6px;
    }
    .dashboard-stat-card .stat-title .svg-icon {
      width: 44px;
      height: 44px;
      background: var(--stat-svg-icon-bg, #e9ebf2);
      color: var(--stat-svg-icon-clr, var(--clr-dark-primary));
      border-radius: 8px;
      margin-bottom: 16px;
    }
    .dashboard-stat-card .stat-title .svg-icon.stat-svg-dark-primary {
      --stat-svg-icon-bg: #e9ebf2;
      --stat-svg-icon-clr: var(--clr-dark-primary);
    }
    .dashboard-stat-card .stat-title .svg-icon.stat-svg-success {
      --stat-svg-icon-bg: #e7f8f2;
      --stat-svg-icon-clr: #0b835c;
    }
    .dashboard-stat-card .stat-title .svg-icon.stat-svg-warning {
      --stat-svg-icon-bg: #fef5e7;
      --stat-svg-icon-clr: #ae7008;
    }
    .dashboard-stat-card .stat-title h3 {
      font-size: 16px;
      font-weight: 500;
      line-height: 22px;
      color: #4c515b;
    }
    .dashboard-stat-card .stat-info {
      text-align: end;
    }
    .dashboard-stat-card .stat-info span {
      font-size: 14px;
      font-weight: 400;
      line-height: 20px;
      color: #4c515b;
      margin-bottom: 2px;
    }
    .dashboard-stat-card .stat-info p {
      font-size: 24px;
      font-weight: 700;
      line-height: 29px;
      color: #151d43;
    }
    .het-dashboard-chart-wrapper {
      padding: 25px;
      border: 1px solid #e9ebf2;
      border-radius: 8px;
      height: calc(100% - 24px);
    }
    .het-dashboard-chart-wrapper h3 {
      font-weight: 700;
      font-size: 16px;
      line-height: 22px;
      color: #21262b;
      margin-bottom: 28px;
    }
    .het-dashboard-chart-wrapper .chart-title {
      text-align: center;
      font-size: 14px;
      font-weight: 500;
      color: #4c515b;
      padding-top: 24px;
    }
    .chart-wrapper {
      margin-bottom: 24px;
      max-height: 302px;
      max-width: 100%;
      margin-inline: auto;
      position: relative;
    }
    .chart-wrapper canvas {
      height: 302px !important;
      width: 100% !important;
    }
    .chart-wrapper .chart-title {
      position: absolute;
      inset: 0;
      margin: auto;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-direction: column;
      gap: 5px;
    }
    .chart-wrapper .chart-title h3 {
      margin: 0;
      font-weight: 700;
      font-size: 25px;
      line-height: 30px;
      color: #21262b;
    }
    .chart-wrapper .chart-title p {
      font-weight: 400;
      font-size: 14px;
      line-height: 20px;
      color: #263579;
    }
    .chart-legends {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      flex-wrap: wrap;
    }
    .chart-legends > li:not(:last-child) {
      margin-bottom: 12px;
    }
    .chart-legends > li:first-child {
      --legend-title-dot-bg: var(--clr-success);
    }
    .chart-legends > li:nth-child(2) {
      --legend-title-dot-bg: var(--clr-danger);
    }
    .chart-legends > li:last-child {
      --legend-title-dot-bg: var(--clr-warning);
    }
    .chart-legends > li .legend-title {
      font-weight: 400;
      font-size: 12px;
      line-height: 17px;
      color: #6b7280;
      padding-inline-start: 19px;
      position: relative;
      margin-bottom: 12px;
    }
    .chart-legends > li .legend-title::before {
      content: "";
      position: absolute;
      width: 10px;
      height: 10px;
      background: var(--legend-title-dot-bg, red);
      inset-block: 0;
      margin-block: auto;
      inset-inline-start: 0;
    }
    .chart-legends > li .legend-content {
      font-weight: 700;
      font-size: 16px;
      line-height: 22px;
    }
    .chart-legends > li .legend-content:first-child {
      --legend-title-dot-bg: var(--clr-success);
    }
    .chart-legends > li .legend-content:nth-child(2) {
      --legend-title-dot-bg: var(--clr-danger);
    }
    .chart-legends > li .legend-content:last-child {
      --legend-title-dot-bg: var(--clr-warning);
    }
    .dashboard-card-wrapper {
      padding: 16px;
      padding-bottom: 22px;
      border: 1px solid #e9ebf2;
      border-radius: 8px;
    }
    .dashboard-card-wrapper .dashboard-card-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 6px;
      flex-wrap: wrap;
      margin-bottom: 24px;
    }
    .dashboard-card-wrapper .dashboard-card-header h3 {
      font-size: 16px;
      font-weight: 700;
      line-height: 22px;
      color: #21262b;
    }
    .dashboard-card-wrapper .dashboard-card-header h3 span {
      color: #9ca1aa;
      font-weight: 400;
    }
    .dashboard-card-wrapper .dashboard-card-header > .het-btn {
      --pbtn-fs: 14px;
    }
    .dashboard-card-wrapper .dashboard-card-header > .het-btn svg {
      width: 6px;
    }
    .dashboard-no-access {
      text-align: center;
      padding: 80px 30px;
      margin-bottom: 16px;
    }
    .dashboard-no-access .svg-icon {
      margin-bottom: 24px;
    }
    .dashboard-no-access .svg-icon svg {
      width: 96px;
      height: auto;
    }
    .dashboard-no-access h3 {
      font-size: 20px;
      font-weight: 700;
      line-height: 24px;
      color: #2d3036;
      margin-bottom: 14px;
    }
    .dashboard-no-access p {
      font-size: 14px;
      font-weight: 500;
      line-height: 17px;
      color: #6b7280;
    }
    .dashboard-tasks-list {
      display: grid;
      align-items: center;
      gap: 24px;
      grid-template-columns: 1fr 1fr;
    }
    @media screen and (max-width: 991.98px) {
      .dashboard-tasks-list {
        grid-template-columns: 1fr;
      }
    }
    .dashboard-tasks-list li {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
      padding: 13px 14px;
      border: 1px solid #e9ebf2;
      border-radius: 8px;
    }
    .dashboard-tasks-list li .task-content h4 {
      font-size: 14px;
      font-weight: 400;
      line-height: 20px;
      color: #2d3036;
      margin-bottom: 4px;
    }
    .dashboard-tasks-list li .task-content .task-info {
      display: flex;
      align-items: center;
      gap: 10px;
    }
    .dashboard-tasks-list li .task-content .task-info .task-date,
    .dashboard-tasks-list li .task-content .task-info .task-time {
      display: flex;
      align-items: center;
      gap: 4px;
      font-size: 14px;
      font-weight: 400;
      line-height: 20px;
      color: #6b7280;
    }
    .dashboard-tasks-list li .task-content .task-info .task-date svg,
    .dashboard-tasks-list li .task-content .task-info .task-time svg {
      height: 15px;
      width: auto;
    }
    .dashboard-tasks-list li:not(:last-child) {
      margin-bottom: 14px;
    }
    .dashboard-progress-list li .progress-info {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 6px;
      margin-bottom: 12px;
    }
    .dashboard-progress-list li .progress-info h4 {
      font-size: 14px;
      font-weight: 400;
      line-height: 20px;
      color: #4c515b;
    }
    .dashboard-progress-list li .progress-info h4 span {
      color: #898e99;
    }
    .dashboard-progress-list li .progress-info p {
      font-size: 16px;
      font-weight: 400;
      line-height: 23px;
      color: #4c515b;
    }
    .dashboard-progress-list li:not(:last-child) {
      margin-bottom: 20px;
    }
    .dashboard-card-nodata {
      display: flex;
      justify-content: center;
      align-items: center;
      flex-direction: column;
      padding: 119px 20px;
    }
    .dashboard-card-nodata > .svg-icon {
      margin-bottom: 20px;
    }
    .dashboard-card-nodata h3 {
      font-size: 16px;
      font-weight: 500;
      line-height: 22px;
      color: #4c515b;
      margin-bottom: 8px;
    }
    .dashboard-card-nodata p {
      font-size: 14px;
      font-weight: 400;
      line-height: 20px;
      color: #6b7280;
      margin-bottom: 12px;
    }
    .het-grievance-template {
      padding-block-start: 56px;
    }
    .het-grievance-template .het-signature-wrapper {
      --signature-width: 100%;
    }
    .het-grievance-template .logo-wrapper {
      display: flex;
      align-items: center;
      justify-content: center;
      margin-bottom: 56px;
    }
    .het-grievance-template .template-title {
      font-weight: 700;
      font-size: 18px;
      line-height: 22px;
      color: #263579;
      text-align: center;
      margin-bottom: 32px;
    }
    .het-grievance-template .template-alert {
      padding: 16px;
      border-radius: 8px;
      background: #e9ebf2;
      border: 1px solid #bcc0d5;
      margin-bottom: 20px;
      color: #101633;
      font-size: 16px;
      line-height: 23px;
    }
    .het-grievance-template .template-alert h3 {
      font-weight: 500;
      margin-bottom: 3px;
    }
    .het-grievance-template .template-alert p {
      font-weight: 400;
    }
    .het-audit-wrapper .audit-list li {
      display: flex;
      align-items: flex-start;
      gap: 32px;
    }
    .het-audit-wrapper .audit-list li .item-icon {
      position: relative;
      width: 30px;
      height: 30px;
      border-radius: 100%;
      background: #ecf7fc;
    }
    .het-audit-wrapper .audit-list li .item-icon::before {
      content: "";
      position: absolute;
      width: 12px;
      height: 12px;
      border-radius: 100%;
      background: var(--clr-primary);
      inset: 0;
      margin: auto;
    }
    .het-audit-wrapper .audit-list li .item-time {
      direction: ltr;
      text-align: end;
      max-width: 9ch;
      font-size: 14px;
      font-weight: 400;
      line-height: 20px;
      color: #898e99;
    }
    .het-audit-wrapper .audit-list li .item-content-wrapper {
      padding: 16px;
      border: 1px solid #f0f1f2;
      border-radius: 8px;
      flex: 1;
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
    }
    .het-audit-wrapper .audit-list li .item-content-wrapper .item-content h3 {
      font-size: 16px;
      font-weight: 700;
      line-height: 19px;
      color: #4c515b;
      margin-bottom: 12px;
    }
    .het-audit-wrapper .audit-list li .item-content-wrapper .item-content p {
      font-size: 16px;
      font-weight: 400;
      line-height: 22px;
      color: #6b7280;
      margin-bottom: 16px;
    }
    .het-audit-wrapper .audit-list li .item-content-wrapper .item-content .item-subcontent {
      display: flex;
      align-items: center;
      gap: 10px;
    }
    .het-audit-wrapper .audit-list li .item-content-wrapper .item-content .item-subcontent > span {
      font-size: 14px;
      font-weight: 400;
      line-height: 20px;
      color: #9ca1aa;
    }
    .het-audit-wrapper .audit-list li .item-content-wrapper .item-content .item-subcontent > span span {
      color: #4c515b;
    }
    .het-audit-wrapper .audit-list li .item-content-wrapper .item-toolbar {
      display: flex;
      align-items: center;
      gap: 10px;
    }
    .het-audit-wrapper .audit-list li + li {
      position: relative;
    }
    .het-audit-wrapper .audit-list li + li::before {
      content: "";
      position: absolute;
      width: 1px;
      height: calc(100% - 34px);
      background: #c3e5f6;
      inset-inline-start: 15px;
      bottom: calc(100% + 10px);
    }
    .het-audit-wrapper .audit-list li:not(:last-child) {
      margin-bottom: 16px;
    }
    .het-devices-audit-list li {
      position: relative;
      display: flex;
      align-items: center;
      gap: 6px;
    }
    .het-devices-audit-list li::before {
      content: none;
      width: 1px;
      height: calc(100% + 3px);
      background: #bbbec5;
      position: absolute;
      bottom: calc(100% - 7px);
      inset-inline-start: 34px;
    }
    .het-devices-audit-list li .item-time {
      font-size: 10px;
      font-weight: 400;
      line-height: 14px;
      color: #4c515b;
    }
    .het-devices-audit-list li .item-dot {
      width: 5px;
      height: 5px;
      border-radius: 100%;
      background: #4c515b;
    }
    .het-devices-audit-list li .item-desc {
      font-size: 14px;
      font-weight: 400;
      line-height: 19px;
      color: #4c515b;
    }
    .het-devices-audit-list li:not(:first-child)::before {
      content: "";
    }
    .het-devices-audit-list li:not(:last-child) {
      margin-bottom: 8px;
    }
    .het-info-warning {
      margin-top: 16px;
      display: flex;
      align-items: center;
      gap: 10px;
    }
    .het-info-warning .svg-icon svg {
      width: 20px;
      height: auto;
      color: #6b7280;
    }
    .het-info-warning > p {
      font-size: 16px;
      font-weight: 400;
      line-height: 22px;
      color: #6b7280;
    }
    .het-info-warning > p > span {
      font-weight: 500;
    }
  }
  @layer custom {
    :root {
      --body-clr: #1E293B;
      --body-bg: #ffffff;
      --body-fs: 0.875rem;
      --body-fw: 500;
      --clr-primary: #389BCD;
      --clr-light-primary: #ECF7FC;
      --clr-secondary: #9CA1AA;
      --clr-light-secondary: #F0F1F2;
      --clr-success: #10B981;
      --clr-light-success: #10B9814D;
      --clr-warning: #F59E0B;
      --clr-light-warning: #FCE1B399;
      --clr-danger: #EF4444;
      --clr-light-danger: #EF444433;
      --clr-info: #0EA5E9;
      --clr-dark-primary: #263579;
      --clr-darker-primary: #101633;
    }
  }
  @layer general {
    p-progressspinner[styleclass=spinner-het] {
      z-index: 3;
      position: relative;
    }
    .flex-center-wrapper {
      display: flex;
      align-items: center;
    }
    .flex-center-8-wrapper {
      display: flex;
      align-items: center;
      gap: 8px;
    }
    .flex-start-10-wrapper {
      display: flex;
      align-items: flex-start;
      gap: 10px;
    }
    .flex-center-10-wrapper {
      display: flex;
      align-items: center;
      gap: 10px;
    }
    .flex-center-12-wrapper {
      display: flex;
      align-items: center;
      gap: 12px;
    }
    .flex-center-16-wrapper {
      display: flex;
      align-items: center;
      gap: 16px;
    }
    .flex-end-16-wrapper {
      display: flex;
      align-items: flex-end;
      gap: 16px;
    }
    .flex-center-center-wrapper {
      display: flex;
      align-items: center;
      justify-content: center;
    }
    .flex-center-between-wrapper {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 6px;
    }
    .flex-1 {
      flex: 1;
    }
    @media screen and (max-width: 992px) {
      .flex-wrap-lg {
        flex-wrap: wrap;
      }
    }
    @media screen and (max-width: 768px) {
      .flex-wrap-md {
        flex-wrap: wrap;
      }
    }
    @media screen and (max-width: 550px) {
      .flex-wrap-sm {
        flex-wrap: wrap;
      }
    }
    @media screen and (max-width: 550px) {
      .gap-8-sm {
        gap: 8px;
      }
    }
    .text-start {
      text-align: start;
    }
    .text-primary {
      color: var(--clr-primary);
    }
    .text-primary .p-button-link {
      --pbtn-clr: var(--clr-primary);
    }
    .text-dark-primary {
      color: var(--clr-dark-primary);
    }
    .text-dark-primary .p-button-link {
      --pbtn-clr: var(--clr-dark-primary);
    }
    .text-darker-primary {
      color: var(--clr-darker-primary);
    }
    .text-darker-primary .p-button-link {
      --pbtn-clr: var(--clr-darker-primary);
    }
    .text-secondary {
      color: var(--clr-secondary);
    }
    .text-secondary .p-button-link {
      --pbtn-clr: var(--clr-secondary);
    }
    .text-success {
      color: var(--clr-success);
    }
    .text-success .p-button-link {
      --pbtn-clr: var(--clr-success);
    }
    .text-warning {
      color: var(--clr-warning);
    }
    .text-warning .p-button-link {
      --pbtn-clr: var(--clr-warning);
    }
    .text-danger {
      color: var(--clr-danger);
    }
    .text-danger .p-button-link {
      --pbtn-clr: var(--clr-danger);
    }
    .text-dark-grey {
      color: #6B7280;
    }
    .text-dark-grey .p-button-link {
      --pbtn-clr: #6B7280;
    }
    .text-darker-grey {
      color: #4C515B;
    }
    .text-darker-grey .p-button-link {
      --pbtn-clr: #4C515B;
    }
    .text-light-grey {
      color: #A9ACB4;
    }
    .text-light-grey .p-button-link {
      --pbtn-clr: #A9ACB4;
    }
    .text-linethrough {
      text-decoration: line-through;
    }
    .text-underline {
      text-decoration: underline;
    }
    .text-underline > .p-button {
      text-decoration: underline;
    }
    .text-center {
      text-align: center;
    }
    .svg-primary {
      color: var(--clr-primary);
    }
    .svg-grey {
      color: #6B7280;
    }
    .svg-success {
      color: var(--clr-success);
    }
    .svg-warning {
      color: var(--clr-warning);
    }
    .svg-danger {
      color: var(--clr-danger);
    }
    .rotate-90 {
      rotate: 90deg;
    }
    .rotate-n90 {
      rotate: -90deg;
    }
    .svg-icon.svg-h-100 > svg {
      height: 100%;
    }
    .svg-icon.svg-20 > svg {
      width: 20px;
      height: 20px;
      object-fit: cover;
    }
    .svg-icon.svg-w-18 > svg {
      width: 18px;
      height: auto;
    }
    .svg-icon.svg-w-20 > svg {
      width: 20px;
      height: auto;
    }
    .svg-icon.svg-w-24 > svg {
      width: 24px;
      height: auto;
    }
    .svg-icon.svg-w-34 > svg {
      width: 34px;
      height: auto;
    }
    .svg-icon.svg-w-44 > svg {
      width: 44px;
      height: auto;
    }
    .svg-icon.svg-w-50 > svg {
      width: 50px;
      height: auto;
    }
    .svg-icon.svg-w-56 > svg {
      width: 56px;
      height: auto;
    }
    .svg-icon.svg-h-56 > svg {
      height: 56px;
      width: auto;
    }
    .svg-icon.svg-w-14 > svg {
      width: 14px;
      height: auto;
    }
    .svg-h-14 svg {
      height: 14px;
      width: auto;
    }
    .svg-h-22 svg {
      height: 22px;
      width: auto;
    }
    [dir=ltr] .svg-flip-ltr {
      transform: scaleX(-1);
    }
    [dir=ltr] .flip-ltr {
      direction: ltr;
    }
    .flip-y {
      transform: scaleY(-1);
    }
    .flip-x {
      transform: scaleX(-1);
    }
    .w-100 {
      width: 100%;
    }
    .dir-ltr {
      direction: ltr;
    }
    .flex-child-1 > *:not(p-button) {
      flex: 1;
    }
    .lh-20 {
      line-height: 20px;
    }
    .fs-12 {
      font-size: 12px;
    }
    .fs-14 {
      font-size: 14px;
    }
    .fs-16 {
      font-size: 16px;
    }
    .fw-normal {
      font-weight: 400;
    }
    .fw-medium {
      font-weight: 500;
    }
    .fw-bold {
      font-weight: 700;
    }
    .fw-extrabold {
      font-weight: 800;
    }
    .fw-black {
      font-weight: 900;
    }
    .min-w-maxcontent {
      min-width: max-content;
    }
    .h-100 {
      height: 100%;
    }
    .section-title {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 0.5rem;
      border-bottom: 1px solid #E9EBF2;
      margin-bottom: 32px;
    }
    .section-title .title-content {
      display: flex;
      align-items: center;
      gap: 1rem;
      margin-bottom: 12px;
    }
    .section-title .title-content .svg-section-title {
      width: 40px;
      height: 40px;
      border-radius: 4px;
      background: #E9EBF2;
      color: var(--clr-dark-primary);
    }
    .section-title .title-content h3 {
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #101633;
    }
    .section-title.details-section {
      min-height: 33px;
      padding-bottom: 16px;
    }
    .section-title.details-section.pb-0 {
      padding-bottom: 0;
    }
    .section-title.details-section .title-content {
      margin-bottom: 0px;
    }
    .section-title.details-section .title-content h3 {
      font-weight: 600;
      font-size: 16px;
      line-height: 19px;
      color: #3B3F46;
    }
    .het-grievance-template .section-title.details-section .title-content h3 {
      color: #101633;
    }
    .section-title.details-section .title-toolbar {
      display: flex;
      align-items: center;
      gap: 16px;
    }
    .het-title {
      font-size: 16px;
      font-weight: 500;
      color: #101633;
      line-height: 17px;
      margin-bottom: 16px;
    }
    .het-content-sm {
      font-size: 14.22px;
      font-weight: 500;
      color: #6E7C91;
      line-height: 21.33px;
      margin-bottom: 32px;
    }
    .het-page-toolbar {
      display: flex;
      align-items: center;
      gap: 16px;
      margin-bottom: 24px;
    }
    .het-border-wrapper {
      border: 1px solid #CED7E3;
      border-radius: 8px;
      padding: 20px 16px;
    }
    [dir=rtl] .mobile-direction {
      direction: ltr;
      text-align: end;
      justify-content: flex-end;
    }
    .min-w-360 {
      --pbtn-minwidth: 360px;
      --form-control-minwidth: 360px;
    }
    @media screen and (max-width: 767px) {
      .min-w-150-md {
        --pbtn-minwidth: 150px;
        --form-control-minwidth: 150px;
      }
    }
    .min-w-120 {
      --pbtn-minwidth: 120px;
      --form-control-minwidth: 120px;
    }
    [dir=ltr] .w-34-ltr {
      min-width: 34px;
    }
    .pointer-none {
      pointer-events: none;
    }
    .img-wrapper.het-content-category-img,
    .img-wrapper.het-content-category-img svg,
    .img-wrapper.het-content-category-img img {
      width: 32px;
      height: 32px;
      border-radius: 100%;
      object-fit: cover;
      min-width: 32px;
    }
    .max-w-250 {
      max-width: 250px;
    }
    .h-100-n24 {
      height: calc(100% - 24px);
    }
    .mt-n44 {
      margin-top: -44px;
    }
    .mt-n68 {
      margin-top: -68px;
    }
    @media screen and (max-width: 550px) {
      .mt-n68 {
        margin-top: 0;
        justify-content: start;
      }
    }
    @media screen and (max-width: 768px) {
      .ms-35-md {
        margin-inline-start: 35px;
      }
    }
    .text-dark-1 {
      color: var(--clr-dark-1);
    }
    .text-body {
      color: var(--body-clr);
    }
    .img-20-rounded {
      border-radius: 100%;
      width: 20px;
      height: 20px;
      object-fit: cover;
      background: #F8FAFC;
    }
    .svg-icon.svg-ddl > svg {
      border-radius: 100%;
      background: #F8FAFC;
    }
    .svg-icon.star-off svg path {
      fill: rgba(0, 0, 0, 0.0588235294);
    }
    .het-notpricing-tag {
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 4px;
      border-radius: 100%;
      background: #EEF2F6;
    }
    .card-separator {
      width: calc(100% + 50px);
      height: 16px;
      background: var(--body-bg);
      margin-top: 24px;
      position: relative;
      margin-inline-start: -25px;
    }
    .card-separator .separator-start-top,
    .card-separator .separator-start-bottom,
    .card-separator .separator-end-top,
    .card-separator .separator-end-bottom {
      position: absolute;
      width: 20px;
      height: 20px;
      overflow: hidden;
    }
    .card-separator .separator-start-top::before,
    .card-separator .separator-start-bottom::before,
    .card-separator .separator-end-top::before,
    .card-separator .separator-end-bottom::before {
      content: "";
      display: block;
      width: 110%;
      height: 110%;
      position: absolute;
      border-radius: 100%;
    }
    .card-separator .separator-end-top {
      top: -20px;
      inset-inline-end: 0;
    }
    .card-separator .separator-end-top::before {
      bottom: 0;
      inset-inline-end: 0;
      box-shadow: -10px 10px 0 0 var(--body-bg);
    }
    .card-separator .separator-end-bottom {
      top: 15px;
      inset-inline-end: 0;
    }
    .card-separator .separator-end-bottom::before {
      top: 0;
      inset-inline-end: 0;
      box-shadow: -10px -10px 0 0 var(--body-bg);
    }
    .card-separator .separator-start-top {
      top: -20px;
      inset-inline-start: 0;
    }
    .card-separator .separator-start-top::before {
      bottom: 0;
      inset-inline-start: 0;
      box-shadow: 10px 10px 0 0 var(--body-bg);
    }
    .card-separator .separator-start-bottom {
      top: 15px;
      inset-inline-start: 0;
    }
    .card-separator .separator-start-bottom::before {
      top: 0;
      inset-inline-start: 0;
      box-shadow: 10px -10px 0 0 var(--body-bg);
    }
    .text-trim.trim-40 {
      --txtsplit-maxwidth: 40ch;
    }
    .min-h-102 {
      min-height: 102px;
    }
    .het-search-nodata {
      min-height: 350px;
      display: grid;
      place-content: center;
      text-align: center;
      gap: 8px;
    }
    .het-search-nodata .nodata-icon {
      display: flex;
      align-items: center;
      justify-content: center;
    }
    .het-search-nodata .nodata-icon .svg-icon {
      width: 40px;
      height: 40px;
      border-radius: 100%;
      background: rgba(138, 202, 255, 0.4);
      padding: 10px;
      color: var(--clr-primary);
      box-shadow: 0 0 0 8px rgba(224, 241, 255, 0.6);
      margin-bottom: 16px;
    }
    .het-search-nodata .nodata-title {
      font-size: 14.22px;
      font-weight: 700;
      line-height: 19.91px;
      color: #424B59;
    }
    .het-search-nodata .nodata-content {
      font-size: 12.62px;
      font-weight: 500;
      line-height: 17.8px;
      color: #6E7C91;
    }
    .het-fixed-label-form.het-mobile-form .p-icon-field > .het-form-control {
      text-align: end;
    }
    [dir=ltr] .het-fixed-label-form.het-mobile-form .p-icon-field > .het-form-control {
      text-align: start;
      padding-inline-end: var(--form-control-padding-inline, 12px);
      padding-inline-start: 68px;
    }
    [dir=rtl] .het-fixed-label-form.het-mobile-form .p-icon-field > span {
      direction: ltr;
      border-inline-start: 0px;
      border-inline-end: 1px solid #CED7E3;
      inset-inline-end: auto;
      inset-inline-start: 0;
    }
    [dir=ltr] .het-fixed-label-form.het-mobile-form .p-icon-field > span {
      direction: ltr;
      border-inline-start: 0px;
      border-inline-end: 1px solid #CED7E3;
      inset-inline-end: auto;
      inset-inline-start: 0;
    }
    .het-fixed-label-form .p-icon-field {
      position: relative;
    }
    .het-fixed-label-form .p-icon-field > .het-form-control {
      padding-inline-start: var(--form-control-padding-inline, 12px);
      padding-inline-end: 68px;
      text-align: center;
    }
    @media screen and (max-width: 600px) {
      .het-fixed-label-form .p-icon-field > .het-form-control {
        padding-inline-end: 37px;
      }
    }
    .het-fixed-label-form .p-icon-field > span {
      min-width: 48px;
      font-size: 12.62px;
      font-weight: 500;
      line-height: 17.8px;
      padding: 8px;
      color: #B5BCC4;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      position: absolute;
      inset-block: 0;
      margin-block: auto;
      inset-inline-end: 0;
    }
    .het-fixed-label-form .p-icon-field:has(.het-form-control:focus) > span {
      border-color: var(--clr-primary);
    }
    .het-textarea-charcount {
      position: relative;
    }
    .het-textarea-charcount > span {
      position: absolute;
      min-width: max-content;
      direction: ltr;
      bottom: 15px;
      inset-inline-start: 16px;
      color: #B5BCC4;
      font-size: 14.22px;
      font-weight: 500;
      line-height: 21.33px;
    }
    .suggested-item > .img-wrapper .svg-icon svg rect {
      fill: #E0F1FF;
    }
    .suggested-item > .img-wrapper .svg-icon svg path {
      fill: var(--clr-primary);
    }
    [draggable=true] {
      cursor: grab;
    }
    [draggable=true].p-draggable-enter {
      border-color: var(--clr-primary);
      --table-tbody-td-border-clr: var(--clr-primary);
    }
    [draggable=true].p-draggable-enter > p-panel > .het-panel-content.content-section,
    [draggable=true].p-draggable-enter > p-panel > .het-panel-content.content-lesson {
      --panel-header-border-clr: var(--clr-primary);
    }
    .p-panel .p-panel-header:has(> .p-draggable-enter) {
      border-color: var(--clr-primary);
    }
    .skeleton_holder {
      background:
        linear-gradient(
          0deg,
          #ECEBEB,
          #ECEBEB),
        linear-gradient(
          270deg,
          rgba(255, 255, 255, 0) 0%,
          #FFFFFF 82.21%,
          rgba(255, 255, 255, 0) 100%);
      height: 0.75rem;
    }
    .svg-done * {
      stroke: currentColor;
    }
    .svg-done .circle {
      animation: circle 1.5s linear infinite;
    }
    .svg-done .tip {
      animation: tip 1.5s linear 0.3s infinite;
    }
    .svg-done .line {
      animation: line 1.5s linear 0.4s infinite;
    }
    @keyframes circle {
      50%, 80% {
        stroke-dashoffset: 0;
      }
      80%, 81% {
        opacity: 1;
      }
      81%, 100% {
        opacity: 0;
      }
    }
    @keyframes tip {
      10%, 80% {
        stroke-dashoffset: 0;
      }
      60%, 61% {
        opacity: 1;
      }
      61%, 100% {
        opacity: 0;
      }
    }
    @keyframes line {
      15%, 60% {
        stroke-dashoffset: 0;
      }
      53%, 54% {
        opacity: 1;
      }
      54%, 100% {
        opacity: 0;
      }
    }
    .het-modal-subtitle {
      font-size: 12px;
      font-weight: 400;
      color: var(--clr-gray);
      margin-top: 4px;
    }
    .modal-default .modal-confirm-text {
      font-size: 20px;
      font-weight: 400;
      line-height: 24px;
      color: #616874;
      margin-bottom: 10px;
    }
    .p-9 {
      padding: 9px;
    }
    .p-25 {
      padding: 25px;
    }
    .px-16 {
      padding-inline: 16px;
    }
    .px-25 {
      padding-inline: 25px;
    }
    .mx-25 {
      margin-inline: 25px;
    }
    .px-40 {
      padding-inline: 40px;
    }
    .py-40 {
      padding-block: 40px;
    }
    .py-50 {
      padding-block: 50px;
    }
    .pb-10 {
      padding-bottom: 10px;
    }
    .pb-0 {
      padding-bottom: 0;
    }
    .ms-5 {
      margin-inline-start: 5px;
    }
    .mt-5 {
      margin-top: 5px;
    }
    .mt-10 {
      margin-top: 10px;
    }
    .mt-16 {
      margin-top: 16px;
    }
    .mb-0 {
      margin-bottom: 0;
    }
    .mb-16 {
      margin-bottom: 16px;
    }
    .mb-24 {
      margin-bottom: 24px;
    }
    .mb-20 {
      margin-bottom: 20px;
    }
    .mb-30 {
      margin-bottom: 30px;
    }
    .mb-32 {
      margin-bottom: 32px;
    }
    .mx-8 {
      margin-inline: 8px;
    }
    .gap-3 {
      gap: 3px;
    }
    .border-0 {
      border: 0;
    }
    #file_line {
      animation: upDown 2s ease-in-out infinite;
    }
    @keyframes upDown {
      0% {
        filter: drop-shadow(0px -10px 7px #28ff97);
      }
      50% {
        transform: translateY(-100px);
      }
      50.1% {
        filter: drop-shadow(0px 10px 7px #28ff97);
      }
      99.99% {
        transform: translateY(0px);
      }
      100% {
        filter: drop-shadow(0px -10px 7px #28ff97);
      }
    }
    .svg-spinner g {
      opacity: 0;
      animation-fill-mode: forwards;
    }
    .svg-spinner .leaf1 {
      animation: fadeSequence 0.5s linear infinite;
      animation-delay: 0s;
    }
    .svg-spinner .leaf1 * {
      fill: var(--clr-primary, black);
    }
    .svg-spinner .leaf2 {
      animation: fadeSequence 0.5s linear infinite;
      animation-delay: 0.05s;
    }
    .svg-spinner .leaf2 * {
      fill: var(--clr-primary, black);
    }
    .svg-spinner .leaf3 {
      animation: fadeSequence 0.5s linear infinite;
      animation-delay: 0.1s;
    }
    .svg-spinner .leaf3 * {
      fill: var(--clr-primary, black);
    }
    .svg-spinner .leaf4 {
      animation: fadeSequence 0.5s linear infinite;
      animation-delay: 0.15s;
    }
    .svg-spinner .leaf4 * {
      fill: var(--clr-primary, black);
    }
    .svg-spinner .leaf5 {
      animation: fadeSequence 0.5s linear infinite;
      animation-delay: 0.2s;
    }
    .svg-spinner .leaf5 * {
      fill: var(--clr-primary, black);
    }
    .svg-spinner .heart {
      animation: fadeSequence 0.5s linear infinite;
      animation-delay: 0.25s;
    }
    .svg-spinner .heart * {
      fill: var(--clr-primary, black);
    }
    @keyframes fadeSequence {
      0%, 10% {
        opacity: 0;
      }
      18% {
        opacity: 1;
      }
      65% {
        opacity: 1;
      }
      73%, 100% {
        opacity: 0;
      }
    }
    .justify-content-end {
      justify-content: end;
    }
  }
}
@layer utilities {
}

/* angular:styles/global:styles */
/*# sourceMappingURL=styles.css.map */